您的位置:首页 > 其它

Xamarin.Forms 用户界面——控件——Style——介绍

2017-08-21 09:04 447 查看


样式简介

PDF用于离线使用

下载PDF

相关文章:

XAML标记扩展

相关API:

样式

二传手

让我们知道你对此的感受

最后更新:2016年4月

样式允许定制视觉元素的外观。为特定类型定义样式,并包含该类型可用属性的值。

Xamarin.Forms应用程序通常包含具有相同外观的多个控件。例如,应用程序可能具有多个
Label
具有相同字体选项和布局选项的实例,如以下XAML代码示例所示:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Styles.NoStylesPage"
Title="No Styles"
Icon="xaml.png">
<ContentPage.Content>
<StackLayout Padding="0,20,0,0">
<Label Text="These labels"
HorizontalOptions="Center"
VerticalOptions="CenterAndExpand"
FontSize="Large" />
<Label Text="are not"
HorizontalOptions="Center"
VerticalOptions="CenterAndExpand"
FontSize="Large" />
<Label Text="using styles"
HorizontalOptions="Center"
VerticalOptions="CenterAndExpand"
FontSize="Large" />
</StackLayout>
</ContentPage.Content>
</ContentPage>
[/code]

以下代码示例显示了在C#中创建的等效页面:
public class NoStylesPageCS : ContentPage
{
public NoStylesPageCS ()
{
Title = "No Styles";
Icon = "csharp.png";
Padding = new Thickness (0, 20, 0, 0);

Content = new StackLayout {
Children = {
new Label {
Text = "These labels",
HorizontalOptions = LayoutOptions.Center,
VerticalOptions = LayoutOptions.CenterAndExpand,
FontSize = Device.GetNamedSize (NamedSize.Large, typeof(Label))
},
new Label {
Text = "are not",
HorizontalOptions = LayoutOptions.Center,
VerticalOptions = LayoutOptions.CenterAndExpand,
FontSize = Device.GetNamedSize (NamedSize.Large, typeof(Label))
},
new Label {
Text = "using styles",
HorizontalOptions = LayoutOptions.Center,
VerticalOptions = LayoutOptions.CenterAndExpand,
FontSize = Device.GetNamedSize (NamedSize.Large, typeof(Label))
}
}
};
}
}
[/code]

每个
Label
实例具有相同的属性值,用于控制显示的文本的外观
Label
。这将导致以下屏幕截图中显示的外观:





设置每个单独控件的外观可能是重复的并且容易出错。相反,可以创建一个定义外观的样式,然后应用于所需的控件。


创造风格

Style
类组的属性值的集合为一个对象,然后可以应用到多个可视元素的实例。这有助于减少重复性标记,并允许应用程序外观更容易更改。

虽然样式主要用于基于XAML的应用程序,但它们也可以在C#中创建:
Style
在XAML中创建的实例通常定义在
ResourceDictionary
分配给
Resources
控件,页面或
Resources
应用程序集合的集合中。
Style
 在C#中创建的实例通常在页面的类中或者可以被全局访问的类中定义。

选择在哪里定义
Style
可以使用的影响:
Style
 控制级别定义的实例只能应用于控件及其子级。
Style
 在页面级别定义的实例只能应用于页面及其子项。
Style
 在整个应用程序中可以应用在应用程序级定义的实例。

每个
Style
实例都包含一个或多个
Setter
对象的集合,每个对象
Setter
具有a 
Property
和a 
Value
。它
Property
是应用于样式的元素的bindable属性的名称,
Value
它是应用于该属性的值。

每个
Style
实例可以是显式的或隐式的:
一个明确的 
Style
实例是通过指定所定义的
TargetType
x:Key
值,并且由所述目标元件的设置
Style
属性的
x:Key
参考。有关显式样式的更多信息,请参阅显式样式
通过仅指定一个隐式 
Style
实例来定义
TargetType
Style
然后,该实例将自动应用于该类型的所有元素。请注意,子类
TargetType
不会自动
Style
应用。有关隐式样式的更多信息,请参阅隐式样式

创建时
Style
TargetType
始终需要属性。以下代码示例显示了在XAML中创建的显式样式(注意
x:Key

<Style x:Key="labelStyle" TargetType="Label">
<Setter Property="HorizontalOptions" Value="Center" />
<Setter Property="VerticalOptions" Value="CenterAndExpand" />
<Setter Property="FontSize" Value="Large" />
</Style>
[/code]

为了应用a 
Style
,目标对象必须
VisualElement
与该
TargetType
属性值匹配
Style
,如以下XAML代码示例所示:
<Label Text="Demonstrating an explicit style" Style="{StaticResource labelStyle}" />
[/code]

视图层次结构中较低的样式优先于定义较高的样式。例如,将
Style
设置
Label.TextColor
Red
应用程序级别的设置将被设置
Label.TextColor
为的页面级别风格覆盖
Green
。类似地,页面级风格将被控件级风格覆盖。另外,如果
Label.TextColor
直接在控件属性上设置,则优先于任何样式。

本节中的文章将演示和解释如何创建和应用显式和隐式样式,如何创建全局样式,样式继承,如何在运行时响应样式更改以及如何使用Xamarin.Forms中包含的内置样式。

什么是StyleId?

在Xamarin.Forms 2.2之前,该
StyleId
属性用于识别UI测试中的识别应用程序中的各个元素,以及像Pixate这样的主题引擎。但是,Xamarin.Forms
2.2引入了该
AutomationId
属性,该属性已取代该
StyleId
属性。有关更多信息,请参阅使用Xamarin.UITest和测试云自动化Xamarin.Forms测试


概要

Xamarin.Forms应用程序通常包含具有相同外观的多个控件。设置每个单独控件的外观可能是重复的并且容易出错。相反,可以创建通过控件类型可用的分组和设置属性自定义控件外观的样式。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  xamarin xamarin.forms