Xamarin XAML語言教程模板檢視TemplatedView(一)

Xamarin XAML語言教程模板檢視TemplatedView(一)

模板檢視TemplatedView

與模板頁面相對的是TemplatedView，它被稱為模板檢視，它的功能和模板頁面類似，也是用來顯示控制元件模板的，只不過比模板頁面更加靈活。TemplatedView提供ControlTemplate屬性，實現對控制元件模板的關聯，從而展現對應的介面。

【示例14-6：TemplatedViewDemo】以下將使用模板檢視顯示控制元件模板，並實現模板的切換。具體的操作步驟如下：

（1）開啟App.xaml檔案，編寫程式碼，實現在應用程式級別中構建控制元件模板，程式碼如下：

• <?xml version="1.0" encoding="utf-8" ?>
• <Application xmlns=""
•              xmlns:x=""
•              x:Class="TemplatedViewDemo.App">
•   <Application.Resources>
• <ResourceDictionary>
• <!--構建控制元件模板-->
•       <ControlTemplate x:Key="ChineseTemplate">
•         <StackLayout>
•           <StackLayout VerticalOptions="End">
•             <BoxView Color="Aqua" />
•           </StackLayout>
•           <StackLayout Spacing="35"
•             VerticalOptions="CenterAndExpand"  >
•             <Frame OutlineColor="Accent">
•               <StackLayout Spacing="20"
•                            VerticalOptions="CenterAndExpand"
•                            HorizontalOptions="Center">
•                 <Label Text="山居秋暝"
•                        FontSize="30"
•                        FontAttributes="Bold"
•                        HorizontalOptions="Center"/>
•                 <Label Text="空山新雨後，天氣晚來秋。"
•                        FontSize="18"/>
•                 <Label Text="明月松間照，清泉石上流。"
•                        FontSize="18"/>
•                 <Label Text="竹喧歸浣女，蓮動下漁舟。"
•                        FontSize="18"/>
•                 <Label Text="隨意春芳歇，王孫自可留。"
•                        FontSize="18"/>
•               </StackLayout>
•             </Frame>
•             <Button Command="{TemplateBinding Parent. CommandEnglish}"
•                       Text="Enter English Template" />
•           </StackLayout>
•         </StackLayout>
•       </ControlTemplate>
• <!--構建控制元件模板-->
•       <ControlTemplate x:Key="EnglishTemplate">
•         <StackLayout>
•           <StackLayout VerticalOptions="End">
•             <BoxView Color="Green" />
•           </StackLayout>
•           <StackLayout Spacing="35"
•                        VerticalOptions="CenterAndExpand"  >
•             <Frame OutlineColor="Accent">
•               <Label Text="your life only lasts for a few decades, so be sure that you don\'t leave any regrets. laugh or cry as you like, and it‘s meaningless to oppress yourself."
•                      FontAttributes="Bold"
•                      FontSize="18"/>
•             </Frame>
•             <Button Command="{TemplateBinding Parent.CommandChinese}"
•                     Text="Enter Chinese Template" />
•           </StackLayout>
•         </StackLayout>
•       </ControlTemplate>
•     </ResourceDictionary>
•   </Application.Resources>
• </Application>

在此程式碼中，我們構建了兩個控制元件模板，一個為ChineseTemplate控制元件模板，另一為EnglishTemplate控制元件模板。