Xaml之自定义控件Style

最新推荐文章于 2025-08-11 09:32:57 发布

般若波罗蜜y

最新推荐文章于 2025-08-11 09:32:57 发布

阅读量1.2k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： Xamarin.Forms

本文链接：https://blog.youkuaiyun.com/qq_33606368/article/details/80980037

本文介绍了Xaml中如何创建和使用样式Style，包括显式样式、隐式样式、应用程序级样式、样式继承、动态样式、设备样式以及采用.css样式表的方法。详细讲解了各种样式的设置和应用规则，帮助优化界面代码并简化修改过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在写界面的过程中经常会遇到大量属性重复的控件，编写style（样式）文件可以有效减少代码量，并且方便修改。

1.显式样式：指定TargetType和x:key属性，显示引用

1）页面级

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="Styles.ExplicitStylesPage" Title="Explicit" Icon="xaml.png">
    <ContentPage.Resources>
        <ResourceDictionary>            //在资源字典中声明样式
            <Style x:Key="labelRedStyle" TargetType="Label">       //x:key为唯一标识符，TargetType指定可以运用的控件类型
                <Setter Property="HorizontalOptions"               //setter设置属性值
                        Value="Center" />
                <Setter Property="VerticalOptions"
                        Value="CenterAndExpand" />
                <Setter Property="FontSize" Value="Large" />
                <Setter Property="TextColor" Value="Red" />
            </Style>
            <Style x:Key="labelGreenStyle" TargetType="Label">
                ...
                <Setter Property="TextColor" Value="Green" />
            </Style>
            <Style x:Key="labelBlueStyle" TargetType="Label">
                ...
                <Setter Property="TextColor" Value="Blue" />
            </Style>
        </ResourceDictionary>
    </ContentPage.Resources>
    <ContentPage.Content>
        <StackLayout Padding="0,20,0,0">
            <Label Text="These labels"
                   Style="{StaticResource labelRedStyle}" />            //静态调用资源
            <Label Text="are demonstrating"
                   Style="{StaticResource labelGreenStyle}" />
            <Label Text="explicit styles,"
                   Style="{StaticResource labelBlueStyle}" />
            <Label Text="and an explicit style override"
                   Style="{StaticResource labelBlueStyle}"
                   TextColor="Teal" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

2）控件级

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="Styles.ExplicitStylesPage" Title="Explicit" Icon="xaml.png">
    <ContentPage.Content>
        <StackLayout Padding="0,20,0,0">
            <StackLayout.Resources>
                <ResourceDictionary>
                    <Style x:Key="labelRedStyle" TargetType="Label">
                      ...
                    </Style>
                    ...
                </ResourceDictionary>
            </StackLayout.Resources>
            <Label Text="These labels" Style="{StaticResource labelRedStyle}" />
            ...
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

注：低级别总会被高级别覆盖

3）c#中编写style

public class ExplicitStylesPageCS : ContentPage
{
    public ExplicitStylesPageCS ()
    {
        var labelRedStyle = new Style (typeof(Label)) {
            Setters = {
                ...
                new Setter { Property = Label.TextColorProperty, Value = Color.Red    }
            }
        };
        var labelGreenStyle = new Style (typeof(Label)) {
            Setters = {
                ...
                new Setter { Property = Label.TextColorProperty, Value = Color.Green }
            }
        };
        var labelBlueStyle = new Style (typeof(Label)) {
            Setters = {
                ..