动态调色板

 今天抽空做了一个简单的动态的调色板,当做对MVVM的复习吧

效果如下:

功能比较简单,通过调节滑块来调节A,R,G,B的值来改变窗口的透明度和颜色,颜色的绑定上,还没找到更好的方案来改变笔刷的值

主要代码如下:

<Window.Resources>
        <Style TargetType="Slider">
            <Setter Property="IsSnapToTickEnabled" Value="True"/>
            <Setter Property="TickFrequency" Value="1"/>
            <Setter Property="Minimum" Value="0"/>
            <Setter Property="Maximum" Value="255"/>
            <Setter Property="VerticalAlignment" Value="Center"/>
            <Setter Property="Margin" Value="10,0"/>           
        </Style>
        <Style TargetType="TextBlock">
            <Setter Property="VerticalAlignment" Value="Center"/>
        </Style>
    </Window.Resources>

  

<Border Name="border1" BorderBrush="{Binding ColorBrush}" BorderThickness="4" CornerRadius="10" Padding="8" PreviewMouseLeftButtonDown="border1_PreviewMouseLeftButtonDown">
        <Border BorderBrush="{Binding ColorBrush}" BorderThickness="6" CornerRadius="8">
            <Grid Background="{Binding ColorBrush}" >
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"></RowDefinition>
                    <RowDefinition Height="*"></RowDefinition>
                    <RowDefinition Height="*"></RowDefinition>
                    <RowDefinition Height="*"></RowDefinition>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="40"></ColumnDefinition>
                    <ColumnDefinition Width="200"></ColumnDefinition>
                    <ColumnDefinition Width="*"></ColumnDefinition>
                </Grid.ColumnDefinitions>
                <TextBlock Text="Alpha" HorizontalAlignment="Right"/>
                <TextBlock Text="R" Grid.Row="1" HorizontalAlignment="Right" />
                <TextBlock Text="G" Grid.Row="2" HorizontalAlignment="Right"/>
                <TextBlock Text="B" Grid.Row="3" HorizontalAlignment="Right" />
                <Slider  Grid.Column="1"  Value="{Binding A}" Name="slider1" />
                <Slider Grid.Row="1" Grid.Column="1" Value="{Binding R}" Name="slider2"/>
                <Slider Grid.Row="2" Grid.Column="1" Value="{Binding G}" Name="slider3"/>
                <Slider Grid.Row="3" Grid.Column="1" Value="{Binding B}" Name="slider4"/>
                <TextBlock Text="{Binding ElementName=slider1,Path=Value,UpdateSourceTrigger=PropertyChanged}" Grid.Column="2" />
                <TextBlock Text="{Binding ElementName=slider2,Path=Value,UpdateSourceTrigger=PropertyChanged}" Grid.Row="1" Grid.Column="2" />
                <TextBlock Text="{Binding ElementName=slider3,Path=Value,UpdateSourceTrigger=PropertyChanged}" Grid.Row="2" Grid.Column="2" />
                <TextBlock Text="{Binding ElementName=slider4,Path=Value,UpdateSourceTrigger=PropertyChanged}" Grid.Row="3" Grid.Column="2" />
            </Grid>
        </Border>
    </Border>

 

下载 动态调色板

转载于:https://www.cnblogs.com/linuxda/p/3898104.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值