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 : DependencyObjectPublic Class VisualStateManager
Inherits DependencyObject- Наследование
- Атрибуты
Требования к 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. Вы также можете переопределить еще несколько вариантов поведения:
- Переопределите RaiseCurrentStateChanged , чтобы управлять тем, когда событие CurrentStateChanged запускается объектом VisualStateGroup , управляемым VisualStateManager.
- Переопределите RaiseCurrentStateChanging , чтобы управлять тем, когда событие CurrentStateChanging запускается объектом VisualStateGroup , управляемым 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, обрабатывающий переходы между состояниями элемента управления. |