Gaya Dinamis dalam Xamarin.Forms
Gaya tidak merespons perubahan properti, dan tetap tidak berubah selama durasi aplikasi. Misalnya, setelah menetapkan Gaya ke elemen visual, jika salah satu instans Setter dimodifikasi, dihapus, atau instans Setter baru ditambahkan, perubahan tidak akan diterapkan ke elemen visual. Namun, aplikasi dapat merespons perubahan gaya secara dinamis saat runtime dengan menggunakan sumber daya dinamis.
Ekstensi DynamicResource markup mirip StaticResource dengan ekstensi markup karena keduanya menggunakan kunci kamus untuk mengambil nilai dari ResourceDictionary. Namun, saat StaticResource melakukan pencarian kamus tunggal, DynamicResource mempertahankan tautan ke kunci kamus. Oleh karena itu, jika entri kamus yang terkait dengan kunci diganti, perubahan diterapkan ke elemen visual. Ini memungkinkan perubahan gaya runtime untuk dilakukan dalam aplikasi.
Contoh kode berikut menunjukkan gaya dinamis di halaman XAML:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="Styles.DynamicStylesPage" Title="Dynamic" IconImageSource="xaml.png">
<ContentPage.Resources>
<ResourceDictionary>
<Style x:Key="baseStyle" TargetType="View">
...
</Style>
<Style x:Key="blueSearchBarStyle"
TargetType="SearchBar"
BasedOn="{StaticResource baseStyle}">
...
</Style>
<Style x:Key="greenSearchBarStyle"
TargetType="SearchBar">
...
</Style>
...
</ResourceDictionary>
</ContentPage.Resources>
<ContentPage.Content>
<StackLayout Padding="0,20,0,0">
<SearchBar Placeholder="These SearchBar controls"
Style="{DynamicResource searchBarStyle}" />
...
</StackLayout>
</ContentPage.Content>
</ContentPage>
Instans SearchBar menggunakan DynamicResource ekstensi markup untuk mereferensikan Style bernama searchBarStyle, yang tidak ditentukan dalam XAML. Namun, karena Style properti SearchBar instans diatur menggunakan DynamicResource, kunci kamus yang hilang tidak mengakibatkan pengecualian dilemparkan.
Sebagai gantinya, dalam file code-behind, konstruktor membuat ResourceDictionary entri dengan kunci searchBarStyle, seperti yang ditunjukkan dalam contoh kode berikut:
public partial class DynamicStylesPage : ContentPage
{
bool originalStyle = true;
public DynamicStylesPage ()
{
InitializeComponent ();
Resources ["searchBarStyle"] = Resources ["blueSearchBarStyle"];
}
void OnButtonClicked (object sender, EventArgs e)
{
if (originalStyle) {
Resources ["searchBarStyle"] = Resources ["greenSearchBarStyle"];
originalStyle = false;
} else {
Resources ["searchBarStyle"] = Resources ["blueSearchBarStyle"];
originalStyle = true;
}
}
}
Ketika penanganan OnButtonClicked aktivitas dijalankan, searchBarStyle akan beralih antara blueSearchBarStyle dan greenSearchBarStyle. Ini menghasilkan tampilan yang ditunjukkan pada cuplikan layar berikut:
Contoh kode berikut menunjukkan halaman yang setara di C#:
public class DynamicStylesPageCS : ContentPage
{
bool originalStyle = true;
public DynamicStylesPageCS ()
{
...
var baseStyle = new Style (typeof(View)) {
...
};
var blueSearchBarStyle = new Style (typeof(SearchBar)) {
...
};
var greenSearchBarStyle = new Style (typeof(SearchBar)) {
...
};
...
var searchBar1 = new SearchBar { Placeholder = "These SearchBar controls" };
searchBar1.SetDynamicResource (VisualElement.StyleProperty, "searchBarStyle");
...
Resources = new ResourceDictionary ();
Resources.Add ("blueSearchBarStyle", blueSearchBarStyle);
Resources.Add ("greenSearchBarStyle", greenSearchBarStyle);
Resources ["searchBarStyle"] = Resources ["blueSearchBarStyle"];
Content = new StackLayout {
Children = { searchBar1, searchBar2, searchBar3, searchBar4, button }
};
}
...
}
Di C#, SearchBar instans menggunakan metode untuk mereferensikan SetDynamicResourcesearchBarStyle. Kode OnButtonClicked penanganan aktivitas identik dengan contoh XAML, dan ketika dijalankan, searchBarStyle akan beralih antara blueSearchBarStyle dan greenSearchBarStyle.
Pewarisan gaya dinamis
Mendapatkan gaya dari gaya dinamis tidak dapat dicapai menggunakan Style.BasedOn properti . Sebaliknya, Style kelas menyertakan BaseResourceKey properti , yang dapat diatur ke kunci kamus yang nilainya mungkin berubah secara dinamis.
Contoh kode berikut menunjukkan pewarisan gaya dinamis di halaman XAML:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="Styles.DynamicStylesInheritancePage" Title="Dynamic Inheritance" IconImageSource="xaml.png">
<ContentPage.Resources>
<ResourceDictionary>
<Style x:Key="baseStyle" TargetType="View">
...
</Style>
<Style x:Key="blueSearchBarStyle" TargetType="SearchBar" BasedOn="{StaticResource baseStyle}">
...
</Style>
<Style x:Key="greenSearchBarStyle" TargetType="SearchBar">
...
</Style>
<Style x:Key="tealSearchBarStyle" TargetType="SearchBar" BaseResourceKey="searchBarStyle">
...
</Style>
...
</ResourceDictionary>
</ContentPage.Resources>
<ContentPage.Content>
<StackLayout Padding="0,20,0,0">
<SearchBar Text="These SearchBar controls" Style="{StaticResource tealSearchBarStyle}" />
...
</StackLayout>
</ContentPage.Content>
</ContentPage>
Instans SearchBar menggunakan StaticResource ekstensi markup untuk mereferensikan bernama tealSearchBarStyleStyle . Ini Style mengatur beberapa properti tambahan dan menggunakan BaseResourceKey properti untuk mereferensikan searchBarStyle. Ekstensi DynamicResource markup tidak diperlukan karena tealSearchBarStyle tidak akan berubah, kecuali dari Style yang berasal. Oleh karena itu, tealSearchBarStyle mempertahankan tautan ke searchBarStyle dan diubah ketika gaya dasar berubah.
Dalam file code-behind, konstruktor membuat ResourceDictionary entri dengan kunci searchBarStyle, sesuai contoh sebelumnya yang menunjukkan gaya dinamis. Ketika penanganan OnButtonClicked aktivitas dijalankan, searchBarStyle akan beralih antara blueSearchBarStyle dan greenSearchBarStyle. Ini menghasilkan tampilan yang ditunjukkan pada cuplikan layar berikut:
Contoh kode berikut menunjukkan halaman yang setara di C#:
public class DynamicStylesInheritancePageCS : ContentPage
{
bool originalStyle = true;
public DynamicStylesInheritancePageCS ()
{
...
var baseStyle = new Style (typeof(View)) {
...
};
var blueSearchBarStyle = new Style (typeof(SearchBar)) {
...
};
var greenSearchBarStyle = new Style (typeof(SearchBar)) {
...
};
var tealSearchBarStyle = new Style (typeof(SearchBar)) {
BaseResourceKey = "searchBarStyle",
...
};
...
Resources = new ResourceDictionary ();
Resources.Add ("blueSearchBarStyle", blueSearchBarStyle);
Resources.Add ("greenSearchBarStyle", greenSearchBarStyle);
Resources ["searchBarStyle"] = Resources ["blueSearchBarStyle"];
Content = new StackLayout {
Children = {
new SearchBar { Text = "These SearchBar controls", Style = tealSearchBarStyle },
...
}
};
}
...
}
tealSearchBarStyle ditetapkan langsung ke Style properti SearchBar instans. Ini Style mengatur beberapa properti tambahan, dan menggunakan BaseResourceKey properti untuk mereferensikan searchBarStyle. Metode SetDynamicResource ini tidak diperlukan di sini karena tealSearchBarStyle tidak akan berubah, kecuali untuk Style itu berasal. Oleh karena itu, tealSearchBarStyle mempertahankan tautan ke searchBarStyle dan diubah ketika gaya dasar berubah.