Поделиться через


VisualStateManager Класс

Определение

Управляет визуальными состояниями и логикой переходов между визуальными состояниями для элементов управления. Кроме того, предоставляет поддержку присоединенных свойств для VisualStateManager.VisualStateGroups, которая позволяет определять визуальные состояния в XAML для шаблона элемента управления.

/// [Windows.Foundation.Metadata.ContractVersion(Windows.Foundation.UniversalApiContract, 65536)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
class VisualStateManager : DependencyObject
[Windows.Foundation.Metadata.ContractVersion(typeof(Windows.Foundation.UniversalApiContract), 65536)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
public class VisualStateManager : DependencyObject
Public Class VisualStateManager
Inherits DependencyObject
Наследование
Object IInspectable DependencyObject VisualStateManager
Атрибуты

Требования к Windows

Семейство устройств
Windows 10 (появилось в 10.0.10240.0)
API contract
Windows.Foundation.UniversalApiContract (появилось в v1.0)

Примеры

В этом примере показано, как использовать присоединенное свойство XAML VisualStateManager.VisualStateGroups. Обратите внимание, что в противном случае тег "VisualStateManager" не определен. По сути, VisualStateManager.VisualStateGroups содержит визуальные состояния элемента управления в качестве непосредственного дочернего тега корня шаблона в шаблоне элемента управления.

Конкретный набор визуальных состояний содержит одну группу VisualStateGroup с именем CommonStates, которая определяет объекты VisualState PointerOver и Normal. Когда пользователь навел указатель на кнопку, сетка меняется с зеленого на красный через 0,5 секунды. Когда пользователь перемещает указатель от кнопки, элемент Grid немедленно меняется обратно на зеленый.

<ControlTemplate TargetType="Button">
  <Grid >
    <VisualStateManager.VisualStateGroups>
      <VisualStateGroup x:Name="CommonStates">

        <VisualStateGroup.Transitions>

          <!--Take one half second to transition to the PointerOver state.-->
          <VisualTransition To="PointerOver" 
                              GeneratedDuration="0:0:0.5"/>
        </VisualStateGroup.Transitions>
        
        <VisualState x:Name="Normal" />

        <!--Change the SolidColorBrush, ButtonBrush, to red when the
            Pointer is over the button.-->
        <VisualState x:Name="PointerOver">
          <Storyboard>
            <ColorAnimation Storyboard.TargetName="ButtonBrush" 
                            Storyboard.TargetProperty="Color" To="Red" />
          </Storyboard>
        </VisualState>
      </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    <Grid.Background>
      <SolidColorBrush x:Name="ButtonBrush" Color="Green"/>
    </Grid.Background>
  </Grid>
</ControlTemplate>
<common:LayoutAwarePage>
  <Grid>
...
    <VisualStateManager.VisualStateGroups>
    <!-- Visual states reflect the application's window size -->
      <VisualStateGroup>
        <VisualState x:Name="DefaultLayout">
           <Storyboard>
           </Storyboard>
        </VisualState>
        <VisualState x:Name="Below768Layout">
           <Storyboard>
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)"
               Storyboard.TargetName="ContentRoot">
               <DiscreteObjectKeyFrame KeyTime="0">
                 <DiscreteObjectKeyFrame.Value>
                   <Thickness>20,20,20,20</Thickness>
                 </DiscreteObjectKeyFrame.Value>
               </DiscreteObjectKeyFrame>
             </ObjectAnimationUsingKeyFrames>
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.HorizontalAlignment)"
               Storyboard.TargetName="FooterPanel">
               <DiscreteObjectKeyFrame KeyTime="0">
                 <DiscreteObjectKeyFrame.Value>
                    <HorizontalAlignment>Left</HorizontalAlignment>
                 </DiscreteObjectKeyFrame.Value>
               </DiscreteObjectKeyFrame>
             </ObjectAnimationUsingKeyFrames>
           </Storyboard>
         </VisualState>
       </VisualStateGroup>
     </VisualStateManager.VisualStateGroups>
   </Grid>
</common:LayoutAwarePage>

Следующий фрагмент кода — это код для работы с XAML, показывающий, как приложение может определить ширину окна приложения и использовать эти сведения для вызова соответствующего визуального состояния.

String state = (Window.Current.Bounds.Width > 768) ? "DefaultLayout" : "Below768Layout";
VisualStateManager.GoToState(this, state, false); // 'this' is the LayoutAwarePage, scope is page code-behind

Комментарии

VisualStateManager поддерживает две важные функции для авторов элементов управления и для разработчиков приложений, которые применяют пользовательский шаблон к элементу управления:

  • Авторы элементов управления или разработчики приложений добавляют элементы объекта VisualStateGroup в корневой элемент определения шаблона элемента управления в XAML с помощью присоединенного свойства VisualStateManager.VisualStateGroups . В элементе VisualStateGroup каждый элемент VisualState представляет дискретное визуальное состояние элемента управления. У каждого visualState есть имя, представляющее состояние пользовательского интерфейса, которое может быть изменено пользователем или логикой управления. VisualState состоит в основном из раскадровки. Эта раскадровка предназначена для отдельных изменений значений свойств зависимостей, которые должны применяться всякий раз, когда элемент управления находится в этом визуальном состоянии. Дополнительные сведения о написании визуальных состояний в XAML, включая пример кода, см. в разделе Раскадровка анимации для визуальных состояний.
  • Управляйте переходом авторов или разработчиков приложений между этими состояниями, вызывая статический метод GoToState в VisualStateManager. Авторы элементов управления делают это всякий раз, когда логика элемента управления обрабатывает события, указывающие на изменение состояния, или логика элемента управления инициирует изменение состояния самостоятельно. Чаще всего это делает код определения элемента управления, а не код приложения, поэтому все возможные визуальные состояния, их переходы и условия триггера имеются по умолчанию для кода приложения, а логика инкапсулируется элементом управления.

Большинство разработчиков будут использовать только два API VisualStateManager: VisualStateManager.VisualStateGroups и GoToState, как описано выше. Остальные API предназначены для поддержки расширений и создания пользовательского VisualStateManager. Дополнительные сведения см. в разделе "Пользовательский VisualStateManager" этой статьи.

При редактировании копий стилей, включенных областью конструктора XAML в Microsoft Visual Studio, визуальные состояния из шаблона по умолчанию определяются в редактируемом XAML. Убедитесь, что вы не удаляете эти состояния и не изменяете их имена, так как логика элемента управления ожидает, что эти визуальные состояния существуют в шаблоне.

Помимо визуальных состояний, модель визуального состояния также включает переходы. Переходы — это действия анимации, управляемые раскадровкой , которые происходят между каждым визуальным состоянием при изменении состояния. Переход можно определить по-разному для каждого сочетания начального и конечного состояний в соответствии с набором визуальных состояний элемента управления. Переходы определяются свойством Transitions объекта VisualStateGroup в XAML с использованием синтаксиса элемента свойства. Большинство шаблонов элементов управления по умолчанию не определяют переходы. При отсутствии конкретно определенных переходов переходы между состояниями происходят мгновенно (нулевая длительность). Дополнительные сведения см. в разделе VisualTransition.

Пользовательский VisualStateManager

Если вы хотите реализовать собственную логику для переходов между состояниями (расширенный сценарий), можно создать класс, наследующий от VisualStateManager. Соблюдайте следующие правила.

  • Производный класс должен переопределить защищенный метод GoToStateCore . Любой экземпляр настраиваемого VisualStateManager использует эту логику Core при вызове метода GoToState .
  • Чтобы сослаться на пользовательский класс VisualStateManager, задайте значение присоединенного свойства VisualStateManager.CustomVisualStateManager в корневом элементе ControlTemplate , где требуется использовать настраиваемое поведение класса VisualStateManager, а также присоединенное свойство VisualStateManager.VisualStateGroups , определяющее визуальные состояния шаблона. Как правило, экземпляр пользовательского класса VisualStateManager создается с помощью конструкции XAML по умолчанию в Application.Resources. Затем присоединенное свойство VisualStateManager.CustomVisualStateManager задается с помощью ссылки расширения разметки {StaticResource} на ключ настраиваемого ресурса VisualStateManager.

Это основные требования для создания и использования пользовательского VisualStateManager. Вы также можете переопределить еще несколько вариантов поведения:

Все остальные API (CustomVisualStateManagerProperty, GetCustomVisualStateManager, GetVisualStateGroups, SetCustomVisualStateManager) являются инфраструктурой для поддержки присоединенных свойств, и вам не нужно вызывать их или делать с ними какие-либо действия.

Визуальные состояния для элементов, которые не являются элементами управления

Визуальные состояния иногда полезны для сценариев, в которых требуется изменить состояние какой-то области пользовательского интерфейса, которая не сразу является подклассом Control . Это невозможно сделать напрямую, так как для параметра control метода GoToState требуется подкласс Control , который ссылается на объект, с которым работает VisualStateManager. Page — это подкласс Control , и вы довольно редко отображаете пользовательский интерфейс в контексте, где у вас нет страницы или корневой каталог Window.Content не является подклассом Control . Рекомендуется определить настраиваемый элемент UserControl в качестве корневого каталога Window.Content или контейнера для другого содержимого, к которому вы хотите применить состояния (например , Панель). Затем можно вызвать GoToState в элементе UserControl и применить состояния независимо от того, является ли остальное содержимое элементом Управления. Например, можно применить визуальные состояния к пользовательскому интерфейсу, который в противном случае состоит только из SwapChainPanel , если вы разместили его в элементе UserControl и объявили именованные состояния, которые применяются к свойствам родительского элемента UserControl или именованной части SwapChainPanel шаблона.

Присоединенные свойства XAML

VisualStateManager — это класс службы узла для нескольких присоединенных свойств XAML.

Для поддержки доступа обработчика XAML к присоединенным свойствам, а также для предоставления коду эквивалентных операций получения и задания , каждое присоединенное свойство XAML имеет пару методов доступа Get и Set. Другой способ получить или задать значение в коде — использовать систему свойств зависимостей, вызывая метод GetValue или SetValue и передавая поле идентификатора в качестве идентификатора свойства зависимостей.

Присоединенное свойствоОписание
VisualStateGroups Возвращает коллекцию элементов VisualStateGroup, определенных корневым элементом определения шаблона. Элемент управления обычно определяет его как часть своего шаблона.

При получении этого свойства в коде используйте GetVisualStateGroups. При этом возвращается объект коллекции, в который можно добавлять элементы. Это параллельное поведение обработки XAML для любых дочерних элементов использования элемента свойства VisualStateManager.VisualStateGroups.

Так как для этого конкретного присоединенного свойства нет открытого идентификатора свойства зависимостей, вы не можете использовать GetValue для получения значения присоединенного свойства. Всегда необходимо использовать GetVisualStateGroups.

CustomVisualStateManager Возвращает или задает пользовательский объект VisualStateManager, обрабатывающий переходы между состояниями элемента управления.

Конструкторы

VisualStateManager()

Инициализирует новый экземпляр класса VisualStateManager .

Свойства

CustomVisualStateManagerProperty

Определяет свойство зависимости VisualStateManager.CustomVisualStateManager .

Dispatcher

Возвращает объект CoreDispatcher , с которым связан этот объект. CoreDispatcher представляет собой средство, которое может получить доступ к DependencyObject в потоке пользовательского интерфейса, даже если код инициируется потоком, не относящегося к пользовательскому интерфейсу.

(Унаследовано от DependencyObject)

Присоединенные свойства

CustomVisualStateManager

Возвращает или задает пользовательский объект VisualStateManager, обрабатывающий переходы между состояниями элемента управления.

Методы

ClearValue(DependencyProperty)

Очищает локальное значение свойства зависимостей.

(Унаследовано от DependencyObject)
GetAnimationBaseValue(DependencyProperty)

Возвращает любое базовое значение, установленное для свойства зависимостей, которое применяется в случаях, когда анимация не активна.

(Унаследовано от DependencyObject)
GetCustomVisualStateManager(FrameworkElement)

Возвращает значение присоединенного свойства VisualStateManager.CustomVisualStateManager .

GetValue(DependencyProperty)

Возвращает текущее действующее значение свойства зависимостей из DependencyObject.

(Унаследовано от DependencyObject)
GetVisualStateGroups(FrameworkElement)

Извлекает коллекцию объектов VisualStateGroup, связанных с указанным FrameworkElement.

GoToState(Control, String, Boolean)

Перемещает элемент управления между двумя состояниями, запрашивая новый VisualState по имени.

GoToStateCore(Control, FrameworkElement, String, VisualStateGroup, VisualState, Boolean)

При переопределении в производном классе перемещает элемент управления между состояниями.

RaiseCurrentStateChanged(VisualStateGroup, VisualState, VisualState, Control)

При переопределении в производном классе вызывает событие CurrentStateChanged для указанного объекта VisualStateGroup.

RaiseCurrentStateChanging(VisualStateGroup, VisualState, VisualState, Control)

При переопределении в производном классе вызывает событие CurrentStateChanging для указанного объекта VisualStateGroup.

ReadLocalValue(DependencyProperty)

Возвращает локальное значение свойства зависимостей, если задано локальное значение.

(Унаследовано от DependencyObject)
RegisterPropertyChangedCallback(DependencyProperty, DependencyPropertyChangedCallback)

Регистрирует функцию уведомления для прослушивания изменений определенного DependencyProperty в этом экземпляре DependencyObject .

(Унаследовано от DependencyObject)
SetCustomVisualStateManager(FrameworkElement, VisualStateManager)

Задает значение присоединенного свойства VisualStateManager.CustomVisualStateManager .

SetValue(DependencyProperty, Object)

Задает локальное значение свойства зависимостей для Объекта DependencyObject.

(Унаследовано от DependencyObject)
UnregisterPropertyChangedCallback(DependencyProperty, Int64)

Отменяет уведомление об изменениях, которое было ранее зарегистрировано путем вызова Метода RegisterPropertyChangedCallback.

(Унаследовано от DependencyObject)

Применяется к

См. также раздел