WPF 实现拟态化按钮

6 篇文章 0 订阅
3 篇文章 0 订阅

用WPF实现拟态化按钮,主要得用颜色的渐变与阴影实现(效果如上图),喜欢的点个赞!

实现代码如下:

   <Grid Background="#FFB1CFED">
        <Grid HorizontalAlignment="Center" VerticalAlignment="Center">    
            <Ellipse Height="60" Width="60" HorizontalAlignment="Center" VerticalAlignment="Center" Fill="#FFB1CFED">
                <Ellipse.Effect>
                    <DropShadowEffect Direction="-80" Color="Black" ShadowDepth="3"/>
                </Ellipse.Effect>
            </Ellipse>
            <Ellipse Height="60" Width="60"  HorizontalAlignment="Center" VerticalAlignment="Center"  >
                <Ellipse.Effect>
                    <DropShadowEffect Direction="90" Color="Black" BlurRadius="5" ShadowDepth="1"/>
                </Ellipse.Effect>
                <Ellipse.Fill>
                    <LinearGradientBrush EndPoint="0.9,1" MappingMode="RelativeToBoundingBox" StartPoint="0.5,0">
                        <GradientStop Color="WhiteSmoke"/>
                        <GradientStop Color="#AAB1CFED" Offset="0.4"/>
                    </LinearGradientBrush>
                </Ellipse.Fill>                
            </Ellipse>
            <Ellipse Height="55" Width="55"  HorizontalAlignment="Center" VerticalAlignment="Center"  Fill="#FFB1CFED" />
            <TextBlock Text="H" FontSize="30" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="Chocolate"/>
        </Grid>
    </Grid>

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值