炫丽的渐变色

炫丽的渐变色

开发工具与关键技术：Visual Studio + WPF
作者：琉敏
撰写时间：2019年4月13日

1、在很多时候，为了把某个地方搞得好看一点，炫丽耀眼一点，往往就会加些色彩上去，下面的就是用XAML写出来的3个漂亮的渐变色彩。

<Window x:Class="GradientRamp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="线性渐变画刷" Height="500" Width="550">
    <Grid>
        <Grid.Resources>
            <!--对角线性渐变画刷-->
            <LinearGradientBrush x:Key="bgBrush" StartPoint="0,0" EndPoint="1,1" Opacity="0.8">
                <GradientStop Color="Red" Offset="0.0"/>
                <GradientStop Color="Orange" Offset="0.25"/>
                <GradientStop Color="Yellow" Offset="0.35"/>
                <GradientStop Color="Green" Offset="0.55"/>
                <GradientStop Color="Blue" Offset="0.65"/>
                <GradientStop Color="Cyan" Offset="0.89"/>
                <GradientStop Color="Purple" Offset="1.0"/>
            </LinearGradientBrush>
        </Grid.Resources>
        <!--依赖属性绑定值-->
        <Button x:Name="btnSubmit" Background="{StaticResource bgBrush}" Height="100" Width="180" 
                Margin="50,0,300,300" FontSize="18">对角性渐</Button>

        <Button Content="垂直渐变" Height="100" Width="180" Margin="280,-238,30,60" FontSize="18">
            <Button.Background>
                <!--垂直线性渐变画刷-->
                <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1" Opacity="0.8">
                    <GradientStop Color="Red" Offset="0"/>
                    <GradientStop Color="Green" Offset="0.5"/>
                    <GradientStop Color="Blue" Offset="1"/>
                </LinearGradientBrush>
            </Button.Background>
        </Button>

        <Button Content="水平渐变" Height="100" Width="180" Margin="80,0,86,60" FontSize="18">
            <Button.Background>
                <!--水平线性渐变画刷-->
                <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5" Opacity="0.6">
                    <GradientStop Color="Yellow" Offset="0.0"/>
                    <GradientStop Color="Red" Offset="0.25"/>
                    <GradientStop Color="Blue" Offset="0.65"/>
                    <GradientStop Color="LimeGreen" Offset="1.0"/>
                </LinearGradientBrush>
            </Button.Background>
        </Button>
    </Grid>
</Window>

2、界面运行效果：