屬性元素語法
這里有一些C#與第4章中的FramedText代碼相似。在一個語句中,它實例化一個Frame和一個Label,并將Label設置為Frame的Content屬性:
new Frame
{OutlineColor = Color.Accent,HorizontalOptions = LayoutOptions.Center,VerticalOptions = LayoutOptions.Center,Content = new Label{Text = "Greetings, Xamarin.Forms!"}
};
但是當你開始在XAML中復制它時,你可能會在設置Content屬性的時候變得有點困難:
<Frame OutlineColor="Accent"HorizontalOptions="Center"VerticalOptions="Center"Content=" what goes here? " />
如何將Content屬性設置為整個Label對象?
這個問題的解決方案是XAML語法的最基本特征。 第一步是將Frame標簽分成開始標簽和結束標簽:
<Frame OutlineColor="Accent"HorizontalOptions="Center"VerticalOptions="Center"></Frame>
在這些標簽中,添加兩個由元素(Frame)和您想要設置的屬性(Content)組成的標簽,并添加一個句點:
<Frame OutlineColor="Accent"HorizontalOptions="Center"VerticalOptions="Center"><Frame.Content></Frame.Content>
</Frame>
現在把標簽放在這些標簽中:
<Frame OutlineColor="Accent"HorizontalOptions="Center"VerticalOptions="Center"><Frame.Content><Label Text="Greetings, Xamarin.Forms!" /></Frame.Content>
</Frame>
該語法是如何將Label設置為Frame的Content屬性。
您可能想知道這個XAML功能是否違反了XML語法規則。 它不是。 這段時間在XML中沒有特殊含義,所以Frame.Content是一個完全有效的XML標簽。 然而,XAML強加了關于這些標簽的規則:Frame.Content標簽必須出現在Frame標簽中,并且不能在Frame.Content標簽中設置屬性。 設置為Content屬性的對象顯示為這些標記的XML內容。
一旦引入了這個語法,就需要一些術語。 在上面顯示的最終XAML代碼片段中:
- 框架和標簽是用XML元素表示的C#對象。 它們被稱為對象元素。
- OutlineColor,HorizontalOptions,VerticalOptions和Text是作為XML屬性提供的C#屬性。 他們被稱為財產屬性。
- Frame.Content是以XML元素表示的C#屬性,因此稱為屬性元素。
屬性元素在現實生活中很常見。 本章和未來章節中將會看到許多示例,您很快就會發現屬性元素成為您使用XAML的第二本質。 但要小心:有時開發人員必須記得太多,以至于我們忘記了基本知識。 即使在您使用XAML一段時間后,您可能會遇到這樣的情況,即似乎無法將特定對象設置為特定屬性。 解決方案通常是一個屬性元素。
您還可以對簡單的屬性使用屬性元素語法,例如:
<Frame HorizontalOptions="Center"><Frame.VerticalOptions>Center</Frame.VerticalOptions><Frame.OutlineColor>Accent</Frame.OutlineColor><Frame.Content><Label><Label.Text>Greetings, Xamarin.Forms!</Label.Text></Label></Frame.Content>
</Frame>
現在,Frame的VerticalOptions和OutlineColor屬性以及Label的Text屬性都已成為屬性元素。 這些屬性的值始終是不帶引號的屬性元素的內容。
當然,將這些屬性定義為屬性元素沒有多大意義。 這是不必要的,一切都很冗長。 但它的工作原理應該如此。
讓我們進一步:不是將HorizontalOptions設置為“Center”(對應于靜態屬性LayoutOptions.Center),您可以將HorizontalOptions表示為屬性元素,并將其設置為LayoutOptions值并設置其各個屬性:
<Frame><Frame.HorizontalOptions><LayoutOptions Alignment="Center"Expands="False" /></Frame.HorizontalOptions><Frame.VerticalOptions>Center</Frame.VerticalOptions><Frame.OutlineColor>Accent</Frame.OutlineColor><Frame.Content><Label><Label.Text>Greetings, Xamarin.Forms!</Label.Text></Label></Frame.Content>
</Frame>```您還可以將LayoutOptions的這些屬性表示為屬性元素:
<Frame.HorizontalOptions><LayoutOptions><LayoutOptions.Alignment>Center</LayoutOptions.Alignment><LayoutOptions.Expands>False</LayoutOptions.Expands></LayoutOptions>
</Frame.HorizontalOptions>
`
您不能將屬性設置為屬性屬性和屬性元素。 這是設置屬性兩次,這是不允許的。 請記住,沒有其他內容可以出現在屬性元素標簽中。 設置為屬性的值始終是這些標記的XML內容。
現在你應該知道如何在XAML中使用StackLayout。 首先將Children屬性表示為屬性元素StackLayout.Children,然后將StackLayout的子元素作為屬性元素標記的XML內容。 下面是一個例子,第一個StackLayout的每個孩子都是另一個具有水平方向的StackLayout:
<StackLayout><StackLayout.Children><StackLayout Orientation="Horizontal"><StackLayout.Children><BoxView Color="Red" /><Label Text="Red"VerticalOptions="Center" /></StackLayout.Children></StackLayout><StackLayout Orientation="Horizontal"><StackLayout.Children><BoxView Color="Green" /><Label Text="Green"VerticalOptions="Center" /></StackLayout.Children></StackLayout><StackLayout Orientation="Horizontal"><StackLayout.Children><BoxView Color="Blue" /><Label Text="Blue"VerticalOptions="Center" /></StackLayout.Children></StackLayout></StackLayout.Children>
</StackLayout>
每個水平的StackLayout都有一個帶有顏色的BoxView和一個帶有該顏色名稱的標簽。
當然,這里的重復標記看起來相當可怕! 如果你想要顯示16種顏色怎么辦? 還是140? 一開始可能會有很多復制和粘貼成功,但如果您需要稍微改進視覺效果,那么您的狀態會很糟糕。 在代碼中,您可以在循環中執行此操作,但XAML沒有此功能。
當標記威脅過于重復時,您可以隨時使用代碼。 在XAML中定義一些用戶界面而在代碼中定義一些用戶界面是非常合理的。 但是還有其他的解決方案,你會在后面的章節中看到。