首页 > 其他分享 >MAUI新生4.4-笔刷Brush

MAUI新生4.4-笔刷Brush

时间:2022-12-20 23:34:56浏览次数:40  
标签:4.4 控件 笔刷 渐变 Brush MAUI 属性

Brush用于定义控件的外轮廓、背景等属性的值,是为属性赋值的。如Shape类控件的Stroke或Fill属性、Border控件的Stroke属性、Shadow的Brush属性、VisualElement派生类控件的Background属性等,同时在MAUI的Microsoft.Maui.Graphics画布中也有用到。MAUI为我们提供了三种类型的笔刷:(1)纯色笔刷:SolidColorBrush;(2)线性渐变笔刷:LinearGradientBrush;(3)径向渐变笔刷:RadialGradientBrush。其中纯色笔刷SolidColorBrush较常使用,线性渐变笔刷LinearGradientBrush次之。

 

一、纯色笔刷SolidColorBrush:

<ContentPage
    ......>
    <StackLayout>
        <!--①Background和Stroke属性,使用颜色名称赋值,内置转换器自动转换为SolidColorBrush对象。
Stroke为Border控件的外轮廓,Background为Boder控件的背景--> <Border x:Name="颜色名称" Background="Green" Stroke="GreenYellow" StrokeThickness="4" HeightRequest="200" WidthRequest="200" /> <!--②Background和Stroke属性,使用十六进制赋值,内置转换器自动转换为SolidColorBrush对象 十六进制颜色还可以增加透明度值,位于前两位,从00(100%透明度)至FF(0%透明度),如【#FF008000】--> <Border x:Name="十六进制" Background="#008000" Stroke="#ADFF2F" StrokeThickness="4" HeightRequest="200" WidthRequest="200" /> <!--③Background和Stroke属性,使用静态类Brush的静态属性赋值,内置转换器自动转换为SolidColorBrush对象--> <Border x:Name="Brush静态类" Background="{x:Static Brush.Green}" Stroke="{x:Static Brush.GreenYellow}" StrokeThickness="4" HeightRequest="200" WidthRequest="200" /> <!--④Background和Stroke属性,使用SolidColorBrush对象赋值--> <Border x:Name="使用SolidColorBrush实例化对象" HeightRequest="200" WidthRequest="200"> <Border.Background> <SolidColorBrush Color="Green" /> </Border.Background> <Border.Stroke> <SolidColorBrush Color="GreenYellow" /> </Border.Stroke> <Border.StrokeThickness>4</Border.StrokeThickness> </Border> </StackLayout> </ContentPage>

 

 

二、线性渐变笔刷:LinearGradientBrush

 

<ContentPage
    ......>
    <StackLayout>
        <!--  渐变方向为从左向右,水平延伸  -->
        <Border HeightRequest="200" WidthRequest="200">
            <Border.Background>
                <!--
                    LinearGradientBrush的StartPoint和EndPoint属性,确定渐变方向
                    笔刷区域的左上角为坐标起点(0,0),分别向右和向下延伸,右下角为坐标终点(1,1)
                    GradientStop类型的集合,定义渐变的颜色段,其中Color定义颜色,Offset定义了渐变色的起止点
                    Offset的数值范围为0.0至1.0,0.0为渐变的起点,1.0为渐变的终点
                -->
                <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
                    <GradientStop Offset="0.0" Color="Yellow" />
                    <GradientStop Offset="0.5" Color="Red" />
                    <GradientStop Offset="1.0" Color="Blue" />
                </LinearGradientBrush>
            </Border.Background>
        </Border>

        <!--  通过将EndPoint的值更改为【1,1】,将渐变方向为从左上角向右下向,对角线延伸  -->
        <Border HeightRequest="200" WidthRequest="200">
            <Border.Background>
                <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                    <GradientStop Offset="0.0" Color="Yellow" />
                    <GradientStop Offset="0.5" Color="Red" />
                    <GradientStop Offset="1.0" Color="Blue" />
                </LinearGradientBrush>
            </Border.Background>
        </Border>
    </StackLayout>
</ContentPage>

 

    

 

 

三、径向渐变笔刷RadialGradientBrush

<ContentPage
    ......>
    <StackLayout>
        <Border HeightRequest="200" WidthRequest="200">
            <Border.Background>
                <!--RadialGradientBrush径向笔刷,以Center为圆心,以Radius为半径,以圆形方式填充渐变色-->
                <!--笔刷区域以左上角为坐标起点(0.0,0.0),右下角为坐标终点(1.0,1.0)-->
                <RadialGradientBrush Center="0.5,0.5" Radius="0.5">
                    <GradientStop Offset="0.0" Color="Red" />
                    <GradientStop Offset="0.8" Color="Green" />
                    <GradientStop Offset="1.0" Color="Blue" />
                </RadialGradientBrush>
            </Border.Background>
        </Border>
    </StackLayout>
</ContentPage>

 

 

 

四、MAUI内置的颜色对照表,包括字符串颜色名称和十六进制颜色名称

 

 

标签:4.4,控件,笔刷,渐变,Brush,MAUI,属性
From: https://www.cnblogs.com/functionMC/p/16995336.html

相关文章

  • MAUI新生4.1-控件视图:控件总览(未完待续)
    根据控件的功能特点,以及个人的习惯,我将MAUI的控件划分为以下几个大类:Page页面类Layout布局类Content单一内容类Collection集合内容类Form表单类Shape形状类辅助功......
  • MAUI新生5.3-样式外观:触发器Trigger
    MAUI的触发器,提供了在运行时动态更改控件样式的方法。在Blazor或Vue中,可以通过三元表达式或绑定class来轻松实现,而MAUI则相对麻烦些,需要通过触发器来实现。触发器,其实就是......
  • 微软跨平台maui开发chatgpt客户端
    image什么是maui.NET多平台应用UI(.NETMAUI)是一个跨平台框架,用于使用C#和XAML创建本机移动(ios,andriod)和桌面(windows,mac)应用。imagechagpt最近......
  • 如何远程调试 MAUI blazor / Blazor Hybrid
    我们知道浏览器模式下Blazor可以使用F12打开开发工具,调试js查看页面元素,那当MauiBlazor提示烦人的anunhandlederrorhasoccurred该怎么进行调试呢?1.VS运......
  • React Native V0.64.4版本 开发环境搭建及问题
    一、开发环境依赖安装 必须安装的依赖有:Node、Watchman、Xcode和CocoaPods。brew安装及问题:苹果电脑标准安装脚本:/bin/zsh-c"$(curl-fsSLhttps://gitee.com/cu......
  • JeecgBoot 3.4.4 ONLINE专项升级,开源的企业级低代码平台
    项目介绍JeecgBoot是一款企业级的低代码平台!前后端分离架构SpringBoot2.x,SpringCloud,AntDesign&Vue3,Mybatis-plus,Shiro,JWT支持微服务。强大的代码生成器让前后端代码......
  • MAUI新生5.2-样式外观:控件状态样式VisualState
    (当前版本V7.0.94,VisualState有bug)控件状态指控件当前处于什么使用状态,如禁用、聚焦、鼠标悬停等等,当控件进入到某种状态时,可以通过【附加属性】【VisualStateManager.Visu......
  • MAUI开发迁移AVD默认位置释放C盘空间
    默认情况下,VS2022启动MAUI工程后创建的AndroidVirtualDeviceManager(AVD)模拟器会在用户当前目录下,例如:C:\Users\登录账户\.android\avd下,每个Target一个avd文件夹,......
  • MAUI新生3.5-深入理解XAML:行为Behavior
    通过行为Behavior,可以将功能附加到控件上,而不需要在宿主控件上定义,和扩展方法有异曲同功之妙。在MAUI中实现Behavior,有两种方式:①附加行为;②MAUI内置行为。附加行为,通过附......
  • c++标准库笔记:13.4.4 Stream的状态和异常
    设置触发异常Stream缺省的情况下不抛出异常,但可由成员函数exceptions来设置这种行为。exceptions有两种形式:获取引发异常的标志(不带参数)设置引发异常的标志(带参数)//Thisme......