Xamarin XAML語(yǔ)言如何構(gòu)建ControlTemplate控件模板

小編給大家分享一下Xamarin XAML語(yǔ)言如何構(gòu)建ControlTemplate控件模板，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！

控件模板ControlTemplate

ControlTemplate是從Xamarin.Forms 2.1.0開(kāi)始被引入的。ControlTemplate被稱為控件模板，它將頁(yè)面的外觀和內(nèi)容進(jìn)行了分離，從而讓開(kāi)發(fā)者可以更方便的創(chuàng)建基于主題的頁(yè)面。

構(gòu)建控件模板

控件模板可以在應(yīng)用程序級(jí)別中構(gòu)建，也可以在頁(yè)面級(jí)別中構(gòu)建。以下將對(duì)這兩個(gè)構(gòu)建方式進(jìn)行講解。

1.應(yīng)用程序級(jí)別構(gòu)建

如果開(kāi)發(fā)者要在應(yīng)用程序級(jí)別構(gòu)建控件模板，首先必須將ResourceDictionary添加到App類中，然后在ResourceDictionary中實(shí)現(xiàn)模板的構(gòu)建。其語(yǔ)法形式如下：

• <Application>

• <Application.Resources>

• <ResourceDictionary>

• <ControlTemplate x:Key="KeyName">

• ……

• </ControlTemplate>

• </ResourceDictionary>

• </Application.Resources>

• </Application>

其中，KeyName指定一個(gè)字典鍵，用來(lái)指代控件模板。

構(gòu)建好模板后，我們需要將這個(gè)模板控件顯示出來(lái)，此時(shí)就需要可以模板化的視圖。在這些視圖中都會(huì)存在一個(gè)ControlTemplate屬性。將此屬性設(shè)置為創(chuàng)建的控件模板后，控件模板就可以進(jìn)行顯示了。在Xamarin.Forms目前只有4個(gè)視圖包含ControlTemplate屬性，這4個(gè)視圖如下：

• ContentPage：內(nèi)容頁(yè)面

• ContentView：內(nèi)容視圖

• TemplatedPage：模板頁(yè)面

• TemplatedView：模板視圖

【示例14-3：ControlTemplateDemo】下面將在應(yīng)用程序級(jí)別中構(gòu)建控件模板，實(shí)現(xiàn)應(yīng)用程序主題的切換。具體的操作步驟如下：

（1）打開(kāi)App.xaml文件，編寫(xiě)代碼，實(shí)現(xiàn)在應(yīng)用程序級(jí)別中構(gòu)建控件模板，代碼如下：

• <?xml version="1.0" encoding="utf-8" ?>

• <Application xmlns="http://xamarin.com/schemas/2014/forms"

•              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"

•              x:Class="ControlTemplateDemo.App">

•   <Application.Resources>

• <ResourceDictionary>

• <!--構(gòu)建控件模板-->

•       <ControlTemplate x:Key="TealTemplate">

•         <Grid>

•           <Grid.RowDefinitions>

•             <RowDefinition Height="0.1*" />

•             <RowDefinition Height="0.8*" />

•             <RowDefinition Height="0.1*" />

•           </Grid.RowDefinitions>

•           <Grid.ColumnDefinitions>

•             <ColumnDefinition Width="0.05*" />

•             <ColumnDefinition Width="0.95*" />

•           </Grid.ColumnDefinitions>

•           <BoxView Grid.ColumnSpan="2"

•                    Color="Teal" />

•           <Label Grid.Column="1"

•                  Text="Knowledge is power."

•                  TextColor="White"

•                  FontSize="18"

•                  VerticalOptions="Center" />

•           <ContentPresenter Grid.Row="1"

•                             Grid.ColumnSpan="2" />

•           <BoxView Grid.Row="2"

•                    Grid.ColumnSpan="2"

•                    Color="Teal" />

•           <Label Grid.Row="2"

•                  Grid.Column="1"

•                  Text="Xamarin.Froms XAML"

•                  TextColor="White"

•                  FontSize="18"

•                 VerticalOptions="Center" />

•         </Grid>

•       </ControlTemplate>

• <!--構(gòu)建控件模板-->

•       <ControlTemplate x:Key="AquaTemplate">

•                    <Grid>

•                             <Grid.RowDefinitions>

•                                      <RowDefinition Height="0.1*" />

•                                      <RowDefinition Height="0.8*" />

•                                      <RowDefinition Height="0.1*" />

•                             </Grid.RowDefinitions>

•                             <Grid.ColumnDefinitions>

•                                      <ColumnDefinition Width="0.05*" />

•                                      <ColumnDefinition Width="0.95*" />

•                             </Grid.ColumnDefinitions>

•                             <BoxView Grid.ColumnSpan="2"

•                        Color="Aqua" />

•                             <Label Grid.Column="1"

•                     Text="Knowledge is power."

•                     TextColor="Blue"

•                     FontSize="18"

•                     VerticalOptions="Center" />

•                             <ContentPresenter Grid.Row="1"

•                               Grid.ColumnSpan="2" />

•                             <BoxView Grid.Row="2"

•                         Grid.ColumnSpan="2"

•                         Color="Aqua" />

•                             <Label Grid.Row="2"

•                      Grid.Column="1"

•                      Text="Xamarin.Froms XAML"

•                      TextColor="Blue"

•                      FontSize="18"

•                      VerticalOptions="Center" />

•                    </Grid>

•            </ControlTemplate>

•     </ResourceDictionary>

•   </Application.Resources>

• </Application>

在此代碼中，我們構(gòu)建了兩個(gè)控件模板，一個(gè)為TealTemplate控件模板，另一為AquaTemplate控件模板。

看完了這篇文章，相信你對(duì)“Xamarin XAML語(yǔ)言如何構(gòu)建ControlTemplate控件模板”有了一定的了解，如果想了解更多相關(guān)知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道，感謝各位的閱讀！