VisualTransition Kelas
Definisi
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.
Mewakili perilaku visual yang terjadi saat kontrol beralih dari satu status visual ke status visual lainnya.
/// [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)]
/// [Windows.UI.Xaml.Markup.ContentProperty(Name="Storyboard")]
class VisualTransition : 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)]
[Windows.UI.Xaml.Markup.ContentProperty(Name="Storyboard")]
public class VisualTransition : DependencyObject
Public Class VisualTransition
Inherits DependencyObject
<VisualStateGroup>
<!--one or more Visual State elements in the implicit States collection property -->
<VisualStateGroup.Transitions>
<VisualTransition>
singleStoryboard
</VisualTransition>
<!--more transitions as above-->
</VisualStateGroup.Transitions>
</VisualStateGroup>
- Warisan
- Atribut
Persyaratan Windows
Rangkaian perangkat |
Windows 10 (diperkenalkan dalam 10.0.10240.0)
|
API contract |
Windows.Foundation.UniversalApiContract (diperkenalkan dalam v1.0)
|
Contoh
Contoh ini membuat VisualTransition yang menentukan bahwa ketika pengguna menjauhkan mouse dari kontrol, batas kontrol berubah menjadi biru, lalu menjadi kuning, lalu menjadi hitam dalam 1,5 detik.
<!--Take one and a half seconds to transition from the
PointerOver state to the Normal state.
Have the SolidColorBrush, BorderBrush, fade to blue,
then to yellow, and then to black in that time.-->
<VisualTransition From="PointerOver" To="Normal"
GeneratedDuration="0:0:1.5">
<Storyboard>
<ColorAnimationUsingKeyFrames
Storyboard.TargetProperty="Color"
Storyboard.TargetName="BorderBrush"
FillBehavior="HoldEnd" >
<ColorAnimationUsingKeyFrames.KeyFrames>
<LinearColorKeyFrame Value="Blue"
KeyTime="0:0:0.5" />
<LinearColorKeyFrame Value="Yellow"
KeyTime="0:0:1" />
<LinearColorKeyFrame Value="Black"
KeyTime="0:0:1.5" />
</ColorAnimationUsingKeyFrames.KeyFrames>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualTransition>
<VisualStateGroup x:Name="CommonStates">
<!--Define the VisualTransitions that can be used when the control
transitions between VisualStates that are defined in the
VisualStatGroup.-->
<VisualStateGroup.Transitions>
<!--Take one hundredth of a second to transition to the
Pressed state.-->
<VisualTransition To="Pressed"
GeneratedDuration="0:0:0.01" />
<!--Take one half second to transition to the PointerOver state.-->
<VisualTransition To="PointerOver"
GeneratedDuration="0:0:0.5" />
<!--Take one hundredth of a second to transition from the
Pressed state to the PointerOver state.-->
<VisualTransition From="Pressed" To="PointerOver"
GeneratedDuration="0:0:0.01" />
<!--Take one and a half seconds to transition from the
PointerOver state to the Normal state.
Have the SolidColorBrush, BorderBrush, fade to blue,
then to yellow, and then to black in that time.-->
<VisualTransition From="PointerOver" To="Normal"
GeneratedDuration="0:0:1.5">
<Storyboard>
<ColorAnimationUsingKeyFrames
Storyboard.TargetProperty="Color"
Storyboard.TargetName="BorderBrush"
FillBehavior="HoldEnd" >
<ColorAnimationUsingKeyFrames.KeyFrames>
<LinearColorKeyFrame Value="Blue"
KeyTime="0:0:0.5" />
<LinearColorKeyFrame Value="Yellow"
KeyTime="0:0:1" />
<LinearColorKeyFrame Value="Black"
KeyTime="0:0:1.5" />
</ColorAnimationUsingKeyFrames.KeyFrames>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualTransition>
</VisualStateGroup.Transitions>
<!--The remainder of the VisualStateGroup is the
same as the previous example.-->
<VisualState x:Name="Normal" />
<VisualState x:Name="PointerOver">
<Storyboard>
<ColorAnimation Storyboard.TargetName="BorderBrush"
Storyboard.TargetProperty="Color" To="Red" />
</Storyboard>
</VisualState>
<VisualState x:Name="Pressed">
<Storyboard >
<ColorAnimation Storyboard.TargetName="BorderBrush"
Storyboard.TargetProperty="Color" To="Transparent"/>
</Storyboard>
</VisualState>
<!--The Disabled state is omitted for brevity.-->
</VisualStateGroup>
Keterangan
VisualTransition adalah perilaku yang memulai Storyboard. Papan Cerita ini adalah garis waktu yang menyatakan durasi animasi yang beralih antara dua status visual akan berjalan. Transisi dapat didefinisikan secara berbeda untuk setiap kombinasi status awal (status Dari ) dan status akhir (status Ke ) seperti yang didefinisikan oleh serangkaian status visual kontrol Anda. Transisi ditentukan oleh properti TransisiVisualStateGroup dan biasanya didefinisikan dalam XAML. Sebagian besar templat kontrol default tidak menentukan transisi, dan dalam hal ini transisi antar status terjadi secara instan. Modifikasi status lama pada templat dihapus, dan modifikasi status baru diterapkan.
VisualTransition mereferensikan satu atau dua status visual bernama. Nilai Dari mereferensikan nama status yang merupakan status saat ini. Nilai Kepada mereferensikan nama status yang merupakan status baru yang diminta oleh panggilan GoToState . Nama-nama ini berasal dari nilai string atribut x:Name yang diterapkan ke VisualState sebagai bagian dari definisinya dalam VisualStateGroup yang sama. Dari atauKe adalah nilai yang diperlukan untuk VisualTransition yang efektif, VisualTransition yang tidak memiliki salah satu dari nilai ini atau menggunakan nilai yang tidak cocok dengan status yang ada tidak melakukan apa-apa.
VisualTransition hanya dapat mereferensikan status Dari , hanya status Ke , atau status Dari dan Ke . Menghilangkan dari atau Ke sama dengan status apa pun. VisualStateManager menggunakan logika prioritas yang transisinya diterapkan setiap kali status visual berubah:
- Jika Ada VisualTransition yang secara khusus mereferensikan status lama sebagai Dari dan status baru sebagai Kepada, gunakan transisi tersebut.
- Jika tidak, jika Ada VisualTransition yang secara khusus mereferensikan status baru sebagai Kepada tetapi tidak menentukan Dari, gunakan transisi tersebut.
- Terakhir, jika Ada VisualTransition yang secara khusus mereferensikan status lama sebagai Dari tetapi tidak menentukan Kepada, gunakan transisi tersebut. Jika tidak ada hal di atas yang berlaku, tidak ada transisi yang berjalan.
Saat Anda memanggil GoToState untuk mengubah status visual kontrol, VisualStateManager melakukan tindakan ini:
- Jika VisualState yang digunakan kontrol sebelum status visual yang baru diminta memiliki Papan Cerita, papan cerita tersebut akan berhenti.
- Di antara tindakan ini, Storyboard untuk VisualTransition berjalan, jika transisi yang melibatkan dua status visual ada, dan status visual bernama yang diminta oleh GoToState valid dan merupakan status baru.
- Jika VisualState seperti yang dinamai oleh stateName memiliki Storyboard, papan cerita dimulai.
VisualTransition dapat memiliki nilai Storyboard , nilai GeneratedDuration , atau keduanya. Tetapi jika VisualTransition tidak memiliki nilai Papan Cerita atau nilai GeneratedDuration , VisualTransition tidak melakukan apa pun dalam hal animasi, bahkan jika status yang dinamai oleh nilai Dari dan Ke terlibat dalam perubahan status.
Transisi implisit
Anda dapat menentukan VisualTransition sehingga memiliki GeneratedDuration, tetapi tidak memiliki properti dependensi tertentu yang ditargetkan dan dianimasikan. Ini membuat transisi implisit. Properti dependensi apa pun yang secara khusus ditargetkan untuk animasi dalam status visual Dari atau Ke dan dengan demikian memiliki nilai yang berbeda di seluruh perubahan status kemudian menggunakan animasi transisi yang dihasilkan. Ini menghasilkan transisi animasi antara nilai status Dari dan nilai status Kepada dari properti tersebut menggunakan interpolasi. Animasi transisi implisit berlangsung selama waktu yang dinyatakan oleh GeneratedDuration.
Transisi implisit hanya berlaku untuk properti yang merupakan nilai Ganda, Warna , atau Titik . Dengan kata lain properti harus dimungkinkan untuk secara implisit menganimasikan menggunakan DoubleAnimation, PointAnimation atau ColorAnimation. Jika Anda ingin membuat animasi transisi pada beberapa nilai lain, misalnya nilai yang memerlukan ObjectAnimationUsingKeyFrames, letakkan animasi tersebut di Papan Cerita dan beri animasi Durasi yang Anda inginkan untuk dijalankan.
Secara default, animasi transisi implisit menggunakan interpolasi linier untuk menganimasikan nilai melalui GeneratedDuration. Anda dapat mengubah interpolasi linier ke perilaku interpolasi pilihan Anda dengan mengatur GeneratedEasingFunction serta GeneratedDuration pada VisualTransition.
Animasi transisi
Ada pola desain dan API lain untuk menampilkan transisi visual untuk aplikasi UWP menggunakan C++, C#, atau Visual Basic. Konsep ini disebut animasi transisi dan kelas yang mengimplementasikan perilaku adalah transisi tema atau animasi tema. Daripada mendeklarasikan transisi antara status visual kontrol yang sama dan menerapkan perubahan pada properti bagian kontrol seperti yang Anda lakukan dengan status visual, animasi transisi mewakili perubahan dalam hubungan antara elemen UI lengkap dan aplikasi dan UI secara keseluruhan. Misalnya, ada RepositionThemeTransition yang dapat diterapkan setiap kali elemen UI dipindahkan di ruang koordinat UI kontainer tata letaknya. Banyak animasi transisi dimulai oleh tindakan pengguna. Animasi transisi berlaku untuk berbagai properti TransisiUIElement dan kelas turunan tertentu, bukan ke VisualStateGroup. Animasi transisi dan animasi tema sering kali bawaan ke perilaku default kontrol. Untuk informasi selengkapnya, lihat Animasi storyboard untuk status visual.
Catatan untuk versi sebelumnya
Windows 8.x
Untuk Windows 8, transisi tema XAML dan berbagai perilaku animasi otomatis lainnya di pustaka animasi tidak menghormati pengaturan Kemudahan Akses Microsoft Windows tertentu yang memungkinkan pengguna menonaktifkan "animasi yang tidak perlu".
Dimulai dengan Windows 8.1, transisi tema, animasi tema, dan transisi visual semuanya menghormati pengaturan Nonaktifkan semua animasi yang tidak perlu (jika memungkinkan) di Kemudahan Akses. Animasi tidak akan berjalan dan perubahan status kontrol atau perubahan visual seketika.
Jika Anda memigrasikan kode aplikasi dari Windows 8 ke Windows 8.1, Anda mungkin ingin menguji perilaku animasi Anda dengan mengaktifkan pengaturan Nonaktifkan semua animasi yang tidak perlu (jika memungkinkan). Karena beberapa animasi ini dikontrol oleh papan cerita, dan karena Anda terkadang menautkan animasi kustom untuk memulai setelah transisi visual atau animasi tema selesai, pengaturan Nonaktifkan semua animasi yang tidak perlu (jika memungkinkan) dapat memengaruhi pengaturan waktu animasi Anda. Selain itu, jika Anda telah menerapkan sesuatu sebagai VisualTransition dalam status visual daripada sebagai animasi papan cerita, Anda mungkin ingin mengalihkannya menjadi animasi kustom yang sebenarnya, sehingga pengaturan Matikan semua animasi yang tidak perlu (jika memungkinkan) tidak akan menonaktifkannya.
Aplikasi yang dikompilasi untuk Windows 8 tetapi berjalan di Windows 8.1 terus menggunakan perilaku Windows 8 untuk animasi tema dan transisi visual. Namun, transisi tema dinonaktifkan oleh pengaturan pada Windows 8.1, meskipun aplikasi tidak dikompilasi ulang.
Konstruktor
VisualTransition() |
Menginisialisasi instans baru kelas VisualTransition . |
Properti
Dispatcher |
Mendapatkan CoreDispatcher yang dikaitkan dengan objek ini. CoreDispatcher mewakili fasilitas yang dapat mengakses DependencyObject pada utas UI bahkan jika kode dimulai oleh utas non-UI. (Diperoleh dari DependencyObject) |
From |
Mendapatkan atau mengatur nama VisualState ke transisi. |
GeneratedDuration |
Mendapatkan atau mengatur jumlah waktu yang diperlukan untuk berpindah dari satu status ke status lainnya, dan waktu ketika animasi transisi implisit harus berjalan sebagai bagian dari perilaku transisi. |
GeneratedEasingFunction |
Mendapatkan atau mengatur fungsi permudah yang diterapkan ke animasi yang dihasilkan. |
Storyboard |
Mendapatkan atau mengatur Storyboard yang berjalan saat transisi terjadi. |
To |
Mendapatkan atau mengatur nama VisualState ke transisi. |
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) |