基本属性:
属性
|
说明
|
描述
|
Color
|
设置阴影效果背景色
|
Color="Red"
|
ShadowDepth
|
设置阴影的偏移度
|
ShadowDepth="5"
|
Direction
|
设置阴影的角度
|
Direction="-45"
|
BlurRadius
|
设置阴影模糊程度
|
BlurRadius="20"
|
Opacity
|
设置阴影透明度
|
Opacity="1"
|
<Button Width="100" Height="50"> <Button.Effect> <DropShadowEffect ShadowDepth="10" BlurRadius="20" Color="Gray"/> </Button.Effect> Click Me </Button>
代码实例: 由于时间关系,代码实例都写在一起了。
<Grid> <StackPanel> <!--设置阴影效果--> <Border Width="100" Height="50" Background="Orange"> <!--Effect设置影响效果标签--> <Border.Effect> <!--在目标周围绘画阴影效果--> <DropShadowEffect Color="Red" ShadowDepth="0"/> </Border.Effect> </Border> <!--设置阴影效果的基本属性--> <Border Margin="0 10" Width="100" Height="50" Background="Orange"> <!--Effect设置影响效果标签--> <Border.Effect> <!--默认显示黑色阴影效果--> <!--<DropShadowEffect/>--> <!--Color设置阴影颜色 ShadowDepth设置阴影偏移度 Direction设置阴影的角度 BlurRadius="20"设置模糊的程度 Opacity="1"设置透明度--> <!--大多数时候使用不设置阴影的偏移方向--> <DropShadowEffect Color="Red" ShadowDepth="5" Direction="-45" BlurRadius="20" Opacity="1"/> </Border.Effect> </Border> <!--设置阴影效果偏移度--> <Border Margin="0 10" Width="100" Height="50" Background="Orange"> <!--Effect设置影响效果标签--> <Border.Effect> <!--ShadowDepth设置阴影偏移度 --> <DropShadowEffect Color="Red" ShadowDepth="5"/> </Border.Effect> </Border> <!--实现旋转阴影效果--> <Border Width="100" Height="50" Background="Orange"> <!--设置旋转效果--> <Border.RenderTransform> <!--Angle设置旋转角度--> <RotateTransform Angle="45"/> </Border.RenderTransform> <!--Effect设置影响效果标签--> <Border.Effect> <!--Color设置阴影颜色 ShadowDepth设置阴影偏移度 Direction设置阴影的角度--> <DropShadowEffect Color="Red" ShadowDepth="5" Direction="-45"/> </Border.Effect> </Border> <!--给文本设置阴影效果--> <TextBlock Text="Hello"> <TextBlock.Effect> <!--Color设置阴影颜色 ShadowDepth设置阴影偏移度 Direction设置阴影的角度 BlurRadius="20"设置模糊的程度 Opacity="1"设置透明度--> <DropShadowEffect Color="Gray" ShadowDepth="0" BlurRadius="3"/> </TextBlock.Effect> </TextBlock> <!--实现阴影效果--> <Border Margin="0 60 0 0" Width="100" Height="30" BorderBrush="Green" BorderThickness="1" CornerRadius="10"> <!--这里设置隐形效果是对整个border内所有的控件生效,只要是非透明不部分都给它做阴影效果--> <Border.Effect> <DropShadowEffect Color="Red" ShadowDepth="0" Direction="-45" BlurRadius="5" Opacity="1"/> </Border.Effect> <TextBlock Text="Hello" VerticalAlignment="Center" HorizontalAlignment="Center"/> </Border> <!--实现只有外部显示阴影效果,不影响内部控件--> <!--Background="White" 设置内容区域为白色背景 - 样式组合可以千变万化-发挥想象力--> <Border Margin="0 10 0 0" Width="100" Height="30" BorderBrush="Green" BorderThickness="1" CornerRadius="10" Background="White"> <!--这里设置隐形效果是对整个border内所有的控件生效,只要是非透明不部分都给它做阴影效果--> <Border.Effect> <DropShadowEffect Color="Red" ShadowDepth="0" Direction="-45" BlurRadius="5" Opacity="1"/> </Border.Effect> <TextBlock Text="Hello" VerticalAlignment="Center" HorizontalAlignment="Center"/> </Border> <!--实现在内部显示阴影效果的情况下不影响内部的其它控件。--> <Grid Margin="0 10 0 0"> <!--ClipToBounds="True" 超出区域部分的阴影效果进行裁切--> <Border Width="100" Height="30" BorderBrush="Green" BorderThickness="1" CornerRadius="0" ClipToBounds="True"> <!--这里设置隐形效果是对整个border内所有的控件生效,只要是非透明不部分都给它做阴影效果--> <Border.Effect> <DropShadowEffect Color="Red" ShadowDepth="0" Direction="-45" BlurRadius="5" Opacity="1"/> </Border.Effect> </Border> <!--这里文字放在boder外面,这样文字部分可以不显示阴影效果。--> <TextBlock Text="Hello" VerticalAlignment="Center" HorizontalAlignment="Center"/> </Grid> <!--实现在设置圆角的情况下在内部显示阴影效果--> <Grid Margin="0 10 0 0"> <!--ClipToBounds="True" 超出区域部分的阴影效果进行裁切--> <Border Width="100" Height="30" BorderBrush="Green" BorderThickness="1" CornerRadius="10"> <!--这里设置告诉boder按照指定尺寸进行裁切--> <Border.Clip> <!--Rect="0 0 100 30" 图形坐标(x,y,w,h)(x轴坐标,y轴坐标,宽度,高度) RadiusX="10" X轴圆角度--> <RectangleGeometry Rect="0 0 100 30" RadiusX="10" RadiusY="10"/> </Border.Clip> <!--这里设置隐形效果是对整个border内所有的控件生效,只要是非透明不部分都给它做阴影效果--> <Border.Effect> <DropShadowEffect Color="Red" ShadowDepth="0" Direction="-45" BlurRadius="5" Opacity="1"/> </Border.Effect> </Border> <!--这里文字放在boder外面,这样文字部分可以不显示阴影效果。--> <TextBlock Text="Hello" VerticalAlignment="Center" HorizontalAlignment="Center"/> </Grid> </StackPanel> </Grid>
文章来源地址https://www.toymoban.com/news/detail-693229.html文章来源:https://www.toymoban.com/news/detail-693229.html
到了这里,关于WPF - 阴影效果的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!