VisualState Kelas

Referensi

Definisi

Ruang nama:: Microsoft.UI.Xaml

Penting

Beberapa informasi terkait produk prarilis yang dapat diubah secara signifikan sebelum dirilis. Microsoft tidak memberikan jaminan, tersirat maupun tersurat, sehubungan dengan informasi yang diberikan di sini.

Edit

Mewakili tampilan visual elemen UI saat berada dalam status tertentu. Status visual menggunakan Setters atau Storyboard untuk mengatur properti UI dalam halaman atau templat kontrol tempat VisualState ditentukan.

public ref class VisualState sealed : DependencyObject

/// [Microsoft.UI.Xaml.Markup.ContentProperty(Name="Storyboard")]
/// [Windows.Foundation.Metadata.Activatable(65536, "Microsoft.UI.Xaml.WinUIContract")]
/// [Windows.Foundation.Metadata.ContractVersion(Microsoft.UI.Xaml.WinUIContract, 65536)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
class VisualState final : DependencyObject

[Microsoft.UI.Xaml.Markup.ContentProperty(Name="Storyboard")]
[Windows.Foundation.Metadata.Activatable(65536, "Microsoft.UI.Xaml.WinUIContract")]
[Windows.Foundation.Metadata.ContractVersion(typeof(Microsoft.UI.Xaml.WinUIContract), 65536)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
public sealed class VisualState : DependencyObject

Public NotInheritable Class VisualState
Inherits DependencyObject

<VisualState x:Name="stateName" />
-or-
<VisualState x:Name="stateName">
  singleStoryboard
</VisualState>
-or-
<VisualState x:Name="stateName">
  <VisualState.Setters>
    oneOrMoreSetters
  </VisualState.Setters>
  [optional]singleStoryboard
</VisualState>
-or-
<VisualState x:Name="stateName">
  <VisualState.StateTriggers>
    oneOrMoreTriggers
  </VisualState.StateTriggers>  
  <VisualState.Setters>
    oneOrMoreSetters
  </VisualState.Setters>
  [optional]singleStoryboard
</VisualState>

Warisan: Object Platform::Object IInspectable DependencyObject VisualState

Atribut: ContentPropertyAttribute ActivatableAttribute ContractVersionAttribute MarshalingBehaviorAttribute ThreadingAttribute

Contoh

Contoh ini membuat VisualStateGroup di ControlTemplate tombol yang disebut "CommonStates" dan menambahkan VisualState objek untuk status, "Normal", "Pressed", dan "PointerOver". juga Button mendefinisikan status yang disebut "Dinonaktifkan" yang ada di "CommonStates" bernama VisualStateGroup, tetapi contoh menghilangkannya untuk keringkasan.

<ControlTemplate TargetType="Button">
  <Border x:Name="RootElement">

    <VisualStateManager.VisualStateGroups>

      <!--Define the states for the common states.
          The states in the VisualStateGroup are mutually exclusive to
          each other.-->
      <VisualStateGroup x:Name="CommonStates">

        <!--The Normal state is the state the button is in
            when it is not in another state from this VisualStateGroup.-->
        <VisualState x:Name="Normal" />

        <!--Change the SolidColorBrush, BorderBrush, to red when the
            Pointer is over the button.-->
        <VisualState x:Name="PointerOver">
          <Storyboard>
            <ColorAnimation Storyboard.TargetName="BorderBrush" 
                              Storyboard.TargetProperty="Color" To="Red" />

          </Storyboard>

        </VisualState>

        <!--Change the SolidColorBrush, BorderBrush, to Transparent when the
            button is pressed.-->
        <VisualState x:Name="Pressed">
          <Storyboard >
            <ColorAnimation Storyboard.TargetName="BorderBrush" 
                              Storyboard.TargetProperty="Color" To="Transparent"/>
          </Storyboard>
        </VisualState>
          <!--The Disabled state is omitted for brevity.-->
        </VisualStateGroup>
  
    </VisualStateManager.VisualStateGroups>
    

    <Border.Background>
      <SolidColorBrush x:Name="BorderBrush" Color="Black"/>
    </Border.Background>

    <Grid Background="{TemplateBinding Background}" Margin="4">
      <ContentPresenter
        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
        VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
        Margin="4,5,4,4" />

    </Grid>


  </Border>
</ControlTemplate>

<Page>
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup>
                <VisualState>
                    <VisualState.StateTriggers>
                        <!-- VisualState to be triggered when window width is >=720 effective pixels -->
                        <AdaptiveTrigger MinWindowWidth="720"/>
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="myPanel.Orientation" Value="Horizontal"/>
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <StackPanel x:Name="myPanel" Orientation="Vertical">
            <TextBlock x:Name="myTextBlock" MaxLines="5" Style="{ThemeResource BodyTextBlockStyle}"/>
        </StackPanel>
    </Grid>
</Page>

Keterangan

VisualState Elemen harus selalu dimuat dalam induk VisualStateGroup di markup XAML. VisualStateGroup memiliki status properti koleksi implisit, sehingga Anda dapat menempatkan masing-masing VisualState sebagai elemen turunan langsung dari VisualStateGroup induk. Contohnya:

<VisualStateGroup x:Name="CommonStates">
   <VisualState x:Name="Normal"/>
   <VisualState x:Name="PointerOver">...</VisualState>
<!-- do not need explicit VisualStateGroups.States property element, States is the XAML content property-->
</VisualStateGroup>

Saat Anda menggunakan StateTriggers, pastikan bahwa VisualStateGroup dideklarasikan di bawah turunan pertama akar agar pemicu berlaku secara otomatis.

Status default

Adalah legal dan umum untuk menentukan VisualState yang memiliki atribut x:Name tetapi tidak menentukan apa pun di Storyboard. Ini berguna karena akan VisualState menggunakan nilai apa pun yang ada dalam templat default. Anda kemudian dapat secara khusus meminta status kosong dari panggilan GoToState . Ketika status kosong menjadi status saat ini, yang membatalkan semua modifikasi pada properti templat yang dibuat oleh status visual sebelumnya dari VisualStateGroup yang sama.

Saat Anda menggunakan StateTriggers, Anda tidak lagi diharuskan membuat kosong VisualState untuk memanggil GoToState . Ketika kondisi untuk StateTrigger tidak lagi terpenuhi, semua modifikasi pada properti yang dibuat oleh yang VisualState sesuai secara otomatis dihapus dan nilai yang disediakan dalam markup default berlaku.

VisualState dan x:Name

Metode GoToState (yang biasanya dipanggil dari kode kontrol) memerlukan stateName parameter untuk memberi tahu VisualStateManager status mana yang harus digunakan sebagai status saat ini. Tentukan atribut x:Name untuk setiap VisualState atribut yang perlu diterapkan secara manual menggunakan GoToState panggilan dari kode. Jika Anda menggunakan StateTriggers untuk memicu VisualState markup dari secara otomatis, Anda tidak perlu menentukan atribut x:Name pada VisualState tersebut.

Jika Anda menggunakan transisi visual, nilai atribut x:Name dari juga VisualState direferensikan oleh nilai Dari atau Ke dari VisualTransition. Dalam hal ini nama mengidentifikasi status atau menyatakan bahwa VisualTransition menyediakan nilai perantara di antaranya.

Nilai atribut x:Name yang Anda tentukan untuk VisualState harus unik dalam templat kontrol XAML di mana VisualState ada. Cakupan untuk nama status tidak hanya tercakup untuk setiap VisualStateGroup, cakupannya dicakup ke semua status visual dalam templat. Misalnya, Anda tidak dapat menentukan dua status berbeda bernama "Fokus" dalam templat XAML yang sama, bahkan jika mereka berada dalam grup yang berbeda.

Anda harus menggunakan atribut x:Name untuk memberi nama status visual atau grup status visual; atribut "Name" yang tidak diprefiks tidak akan berfungsi. VisualState dan VisualStateGroup masing-masing memiliki Name properti tetapi ini baca-saja. Properti tersebut Name ada untuk skenario tingkat lanjut yang menggunakan kode untuk memeriksa konten templat kontrol pada run-time, bukan untuk pengaturan dari XAML.

Mengganti templat kontrol kontrol yang sudah ada

Jika Anda adalah pengembang aplikasi yang menggunakan kontrol di antarmuka pengguna aplikasi, Anda dapat mengganti templat kontrol dengan mengatur properti Control.Template ke nilai yang berbeda. Atau Anda dapat mengganti templat dengan mendeklarasikan gaya baru yang menggunakan kunci gaya implisit untuk kontrol tersebut. Untuk informasi selengkapnya tentang konsep ini, lihat templat Kontrol XAML.

Saat Anda mengganti templat kontrol, penting bagi Anda untuk mereprodusi semua elemen bernama VisualState yang ada dari konten templat VisualStateManager.VisualStateGroups kontrol asli di XAML. Kode kontrol (yang tidak Anda ubah) memanggil GoToState. Status dengan nama tersebut harus ada di templat kontrol. Permintaan untuk yang hilang VisualState tidak akan melemparkan pengecualian, tetapi sering kali akan meninggalkan kontrol dalam keadaan visual yang akan membingungkan pengguna. Misalnya, jika Anda tidak menyediakan VisualState "Diperiksa" bernama untuk kontrol CheckBox , tidak ada umpan balik visual yang muncul saat pengguna memilih kontrol. Pengguna akan mengharapkan bahwa ada sesuatu yang berbeda secara visual untuk membedakan yang diperiksa CheckBox dari yang tidak dicentang CheckBox. Jadi kegagalan untuk mereprodusi status visual pada bagian pengembang aplikasi akan membuat kontrol tampak rusak kepada pengguna.

Saat Anda menggunakan IDE seperti Microsoft Visual Studio, tindakan yang Anda gunakan untuk mengganti templat kontrol menyediakan opsi untuk memulai dengan salinan templat XAML asli, sehingga Anda dapat melihat semua elemen bernama VisualState asli dan komposisi kontrol lain yang Anda ganti. Yang terbaik adalah memulai dengan salinan templat, lalu memodifikasinya, sehingga Anda tidak secara tidak sengaja menghilangkan status visual yang diharapkan dari templat baru Anda.

Mengaitkan status visual bernama kontrol kustom

Jika Anda mendefinisikan kontrol kustom yang memiliki status visual dalam templat kontrolnya XAML, ini adalah praktik terbaik untuk mengaitkan kelas kontrol untuk menunjukkan kepada konsumen status visual mana yang tersedia. Untuk melakukan ini, terapkan satu atau beberapa atribut TemplateVisualState di tingkat kelas kode definisi kontrol Anda. Setiap atribut harus menentukan atribut x:Name status, yang merupakan stateName nilai yang akan diteruskan konsumen kontrol dalam panggilan GoToState untuk menggunakan status visual tersebut. VisualState Jika adalah bagian dari VisualStateGroup, itu juga harus ditunjukkan dalam nilai atribut Anda.

Konstruktor

VisualState()

Menginisialisasi instans baru kelas VisualState .

Properti

Dispatcher	Selalu kembali `null` di aplikasi SDK Aplikasi Windows. Gunakan DispatcherQueue sebagai gantinya . (Diperoleh dari DependencyObject)
DispatcherQueue	`DispatcherQueue` Mendapatkan yang dikaitkan dengan objek ini. `DispatcherQueue` mewakili fasilitas yang dapat mengakses `DependencyObject` pada utas UI bahkan jika kode dimulai oleh utas non-UI. (Diperoleh dari DependencyObject)
Name	Mendapatkan nama VisualState.
Setters	Mendapatkan kumpulan objek Setter yang menentukan nilai properti diskrit yang mengontrol tampilan UIElements saat VisualState ini diterapkan.
StateTriggers	Mendapatkan kumpulan objek StateTriggerBase yang menunjukkan kapan VisualState ini harus diterapkan. Jika ada (tidak semua) pemicu aktif, `VisualState` pemicu akan diterapkan.
Storyboard	Mendapatkan atau mengatur Storyboard yang menentukan nilai properti khusus status dan tampilan kontrol saat menggunakan status visual ini.

Metode

ClearValue(DependencyProperty)	Menghapus nilai lokal properti dependensi. (Diperoleh dari DependencyObject)
GetAnimationBaseValue(DependencyProperty)	Mengembalikan nilai dasar apa pun yang ditetapkan untuk properti dependensi, yang akan berlaku dalam kasus di mana animasi tidak aktif. (Diperoleh dari DependencyObject)
GetValue(DependencyProperty)	Mengembalikan nilai efektif properti dependensi saat ini dari DependencyObject. (Diperoleh dari DependencyObject)
ReadLocalValue(DependencyProperty)	Mengembalikan nilai lokal properti dependensi, jika nilai lokal ditetapkan. (Diperoleh dari DependencyObject)
RegisterPropertyChangedCallback(DependencyProperty, DependencyPropertyChangedCallback)	Mendaftarkan fungsi pemberitahuan untuk mendengarkan perubahan pada DependencyProperty tertentu pada instans DependencyObject ini. (Diperoleh dari DependencyObject)
SetValue(DependencyProperty, Object)	Mengatur nilai lokal properti dependensi pada DependencyObject. (Diperoleh dari DependencyObject)
UnregisterPropertyChangedCallback(DependencyProperty, Int64)	Membatalkan pemberitahuan perubahan yang sebelumnya terdaftar dengan memanggil RegisterPropertyChangedCallback. (Diperoleh dari DependencyObject)

Berlaku untuk

Share via