c# - Xaml中Border元素外的阴影状边框
问题描述
我需要我的组件有一个靠近组件的深色边框,然后它会逐渐消失。DropShadowEffect 仅出现在两侧(右侧和下部),而我希望它出现在所有四个侧面。这就是我需要的
虽然我目前有类似的东西,
这是我当前的代码,
<Border x:Name="ShadowBorder" BorderThickness="1" Width="242" Height="280" Margin="5,5,5,5">
<Border.BorderBrush>
<RadialGradientBrush GradientOrigin="0.5,0.5" Center="0.5,0.5">
<GradientStop Color="Blue" Offset="0"/>
<GradientStop Color="LightBlue" Offset="1"/>
</RadialGradientBrush>
</Border.BorderBrush>
</Border>
解决方案
您使用 DropShadowEffect 走在了正确的轨道上。之所以只模糊了两侧,是因为你的ShadowDepth
。将它设置为 0,你就会得到你想要的。
<Border x:Name="ShadowBorder" BorderThickness="1" Width="242" Height="280" Margin="5,5,5,5" Background="#00FFFFFF">
<Rectangle Fill="White" Width="242" Height="280"/>
<Border.Effect>
<DropShadowEffect BlurRadius="10" ShadowDepth="0" Color="LightBlue"/>
</Border.Effect>
</Border>
这是它的样子:
推荐阅读
- javascript - context.drawImage() 即使在 .onLoad 之后也无法在移动设备上工作(TypeError:null 不是对象)
- swift - 生成的 MTLTexture 比 CGImage 轻
- angular - Angular 9 PWA:在子目录中运行应用程序和托管在不同子目录中的服务工作者时,服务工作者/清单范围问题
- typescript - VS 代码的 launch.json 中不允许使用属性 outFiles
- aws-lambda - 无服务器部署具有特定依赖关系的 lambda@edge
- r - 将三个情节合二为一
- react-native - 使用 react-navigation-tab 创建一个自定义的可滚动顶部标签栏?
- networking - 运行 VPN 客户端软件时客户端实际发生的情况
- node.js - NodeJS 路由顺序
- install4j - 为什么 Install4j 无法解析带有 SAXParseException 的 updates.xml 文件?