Блог

Главная - Вопросы по программированию - Установка нескольких визуальных состояний за один раз?

Установка нескольких визуальных состояний за один раз?

#c# #silverlight #visualstatemanager #visualstates

#c# #silverlight #visualstatemanager #visualstates

Вопрос:

У меня определено четыре визуальных состояния, каждое из которых влияет на разные дочерние элементы управления в рамках одного элемента управления silver-light. Возможно ли для меня создать другие визуальные состояния, которые вызывают комбинацию этих других?

Итак, если у меня есть Visual_Group_1, Visual_Group_2, Visual_Group_3, Visual_Group_4

  1. Возможно ли создать, скажем, группу Visual_Comb_1, которая использует состояния в Visual_Group_1 и Visual_Group_3?
  2. Затем создайте еще одно с именем Visual_Comb_2, которое использует Visual_Group_4 и Visual_Group_3?

Я рад реализовать solution in xaml or codebehind or a combination of both . Альтернатива, которую я рассматриваю в настоящее время, включает в себя тонны копирования вставки кода, и я не слишком стремлюсь это делать.

Еще немного деталей по запросу:

Это то, что у меня примерно есть прямо сейчас:

 <VisualState x:Name="State1">
    <ColorAnimation Storyboard.TargetName="Path1"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="Blue" Duration="0:0:0.5" />
    // fade out the rest of the paths...
    <ColorAnimation Storyboard.TargetName="Path2"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
    <ColorAnimation Storyboard.TargetName="Path3"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
    <ColorAnimation Storyboard.TargetName="Path4"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
</VisualState>

<VisualState x:Name="State2">
    <ColorAnimation Storyboard.TargetName="Path3"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="Red" Duration="0:0:0.5" />
    // fade out the rest of the paths...
    <ColorAnimation Storyboard.TargetName="Path2"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
    <ColorAnimation Storyboard.TargetName="Path1"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
    <ColorAnimation Storyboard.TargetName="Path4"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
</VisualState>

<VisualState x:Name="State3">
    <ColorAnimation Storyboard.TargetName="Path4"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="Pink" Duration="0:0:0.5" />
    // fade out the rest of the paths...
    <ColorAnimation Storyboard.TargetName="Path2"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
    <ColorAnimation Storyboard.TargetName="Path1"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
    <ColorAnimation Storyboard.TargetName="Path3"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
</VisualState>

Моя цель — иметь элемент управления, который при нажатии на циклы перехода из состояния 1 в состояние 3 каждое состояние исчезает по другому пути, одновременно исчезая по другим путям. Моя проблема в том, что в разделе «удалить остальные пути» есть тонна copy paste, поэтому, если бы я хотел добавить Path5, это означало бы добавление его к каждому отдельному визуальному состоянию, которое уже определено, или если бы я хотел изменить цвет fadeoff или анимацию, мне пришлось бы делать это для каждого визуального состояния.

Комментарии:

1. Я надеюсь, что смогу помочь, но с описанием проблемы, которое вы предоставили, довольно сложно выработать конкретное понимание того, что именно вы хотите, чтобы произошло. Возможно ли опубликовать базовую структуру XAML, чтобы мы могли видеть, где в визуальном дереве VisualStates реализованы, и предоставьте конкретный пример того, что вы хотите получить. (Например. Я хочу нажать эту кнопку, а затем заставить ‘Control A’ ввести это визуальное состояние, ‘Control B’ ввести это состояние, а все остальные ввести какое-то другое состояние.)

2. Я просто добавил немного xaml, чтобы показать, что я сейчас делаю и как я надеюсь улучшить указанный код 🙂

Ответ №1:

Спасибо за предоставление XAML. Вот как я бы решил проблему.

Прежде всего, создайте VisualStates индивидуально для каждого Path . (Я бы рекомендовал использовать Style вместо этого, чтобы избавить вас от перекодирования очень похожих VisualState элементов в каждый путь, но я недостаточно знаком с ними, чтобы знать, можете ли вы применить разные цвета к каждому.)

 <VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="Path1States">
        <VisualState x:Name="Activate">
            <Storyboard>
                <ColorAnimation Storyboard.TargetName="Path1"
                                Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                                To="Blue"
                                Duration="0:0:0.5" />
            </Storyboard>
        </VisualState>
        <VisualState x:Name="Deactivate">
            <Storyboard>
                <ColorAnimation Storyboard.TargetName="Path1"
                                Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                                To="#00000000"
                                Duration="0:0:0.5" />
            </Storyboard>
        </VisualState>
    </VisualStateGroup>
    <VisualStateGroup x:Name="Path2States">
        <!-- ... etc ... -->
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

Теперь создайте List в коде, который содержит каждый из связанных объектов, а затем настройте свою собственную GoToState функцию таким образом, чтобы она включала состояние in для одного объекта и вызывала состояние off для остальных.

 List<Path> pathList;

public Page() // constructor
{
    InitializeComponent();
    pathList = new List<Path>();
    pathList.Add(Path1);
    // and so forth
}

// Call this function when you want to change the state
private void ActivatePath(Path p)
{
    foreach (Path listItem in pathList)
    {
        // If the item from the list is the one you want to activate...
        if (listItem == p)
            VisualStateManager.GoToState(listItem, "Activate", true);
        // otherwise...
        else
            VisualStateManager.GoToState(listItem, "Deactivate", true);
    }
}

Если бы я лучше разбирался в XAML и стилизации, у меня мог бы быть более чистый способ создания визуальных состояний. Однако моя сильная сторона больше связана с логикой и кодированием. При этом, это намного чище, чем записывать одно и то же VisualState четыре или пять раз ! 🙂
Надеюсь, это поможет!