| 属性名 | 功能说明 | 例子 |
| Color | 设置阴影效果背景色 | Color="Red" |
| ShadowDepth | 设置阴影的偏移度 | ShadowDepth="5" |
| Direction | 设置阴影的角度 | Direction="-45" |
| BlurRadius | 设置阴影模糊程度 | BlurRadius="20" |
| Opacity | 设置阴影透明度 | Opacity="1" |
<Button Content="进入WPF中文网" Width="100" Height="50"><Button.Effect><DropShadowEffect ShadowDepth="10" BlurRadius="20" Color="Gray"/></Button.Effect>
</Button>
| 元素类型 | 关键属性/特性 |
|---|
| Button | Content="进入WPF中文网"
Width="100"
Height="50" |
| Button.Effect | <DropShadowEffect> |
| DropShadowEffect | ShadowDepth="10"
BlurRadius="20"
Color="Gray" |
graph TD A[Button] --> B[基础属性]A --> C[视觉效果]B --> B1("显示文字：进入WPF中文网")B --> B2("尺寸：100x50")C --> C1{DropShadowEffect}C1 --> C1a("阴影深度：10")C1 --> C1b("模糊半径：20")C1 --> C1c("颜色：Gray")
<Grid x:Name="grid" Background="Transparent"MouseMove="grid_MouseMove"><Button x:Name="button" Content="进入WPF" Width="100" Height="50"><Button.Effect><DropShadowEffect Direction="-45"ShadowDepth="10"BlurRadius="25"Color="Gray"/></Button.Effect></Button></Grid>
| 素类型 | 关键属性/特性 | 属性含义 |
|---|
| Grid | x:Name="grid"
Background="Transparent"
MouseMove="grid_MouseMove" | 容器命名、透明背景、绑定鼠标移动事件 |
| Button | x:Name="button"
Content="进入WPF"
Width="100"
Height="50" | 按钮命名、显示文本、固定尺寸（100×50） |
| DropShadowEffect | Direction="-45"
ShadowDepth="10"
BlurRadius="25"
Color="Gray" | 阴影方向（-45°角）、投影距离（10像素）、模糊强度（25像素）、阴影颜色（灰色） |
graph TD A[Grid] --> B[基础属性] A --> C[事件绑定] A --> D[Button控件] B --> B1("x:Name=grid") B --> B2("Background=Transparent") C --> C1("MouseMove=grid_MouseMove") D --> D1("x:Name=button") D --> D2("Content=进入WPF") D --> D3("Width=100 | Height=50") D --> E[视觉效果] E --> E1{DropShadowEffect} E1 --> E1a("Direction=-45°") E1 --> E1b("ShadowDepth=10") E1 --> E1c("BlurRadius=25") E1 --> E1d("Color=Gray")
private void grid_MouseMove(object sender, MouseEventArgs e)
{double width = grid.ActualWidth;double height = grid.ActualHeight;Point centerPoint = new Point(width / 2, height / 2);Point mousePoint = e.GetPosition(grid);//与X轴的夹角double angle = Math.Atan2(mousePoint.Y - centerPoint.Y, mousePoint.X - centerPoint.X); //弧度double theta = angle * 180 / Math.PI;// 角度this.Title = $"角度={theta}";DropShadowEffect dropShadowEffect = button.Effect as DropShadowEffect; //计算距离var distance = Math.Sqrt((Math.Pow(mousePoint.X - centerPoint.X, 2) + Math.Pow(mousePoint.Y - centerPoint.Y, 2)));dropShadowEffect.Direction = -theta;//设置阴影角度dropShadowEffect.ShadowDepth = distance/10;//设置阴影偏移量dropShadowEffect.BlurRadius = distance / 10 * 2;//设置模糊程度
}
private void grid_MouseMove(object sender, MouseEventArgs e)
{// 获取Grid容器的实际尺寸（动态适应布局变化）double width = grid.ActualWidth; // [!] 若Grid未初始化可能为0 double height = grid.ActualHeight;// 计算Grid中心点坐标（坐标系原点为左上角）Point centerPoint = new Point(width / 2, height / 2);// 获取鼠标相对于Grid的实时坐标 Point mousePoint = e.GetPosition(grid); // [!] 坐标可能超出Grid边界 // 计算鼠标与中心点的夹角（基于笛卡尔坐标系）// [!] Atan2参数顺序为(Y,X)，与数学常规相反 double angle = Math.Atan2( mousePoint.Y - centerPoint.Y, // Y轴差值 mousePoint.X - centerPoint.X); // X轴差值 double theta = angle * 180 / Math.PI; // 弧度转角度（-180°~180°）// 在窗口标题显示实时角度（调试用途）this.Title = $"角度={theta}"; // [!] 高频更新可能影响性能 // 获取按钮的投影效果（需提前设置Effect为DropShadowEffect）DropShadowEffect dropShadowEffect = button.Effect as DropShadowEffect; // [!] 未处理类型转换失败情况 // 计算欧氏距离（勾股定理）var distance = Math.Sqrt(Math.Pow(mousePoint.X - centerPoint.X, 2) + Math.Pow(mousePoint.Y - centerPoint.Y, 2));// 动态调整阴影参数 dropShadowEffect.Direction = -theta; // 角度镜像处理 dropShadowEffect.ShadowDepth = distance / 10; // 随距离线性变化 dropShadowEffect.BlurRadius = distance / 10 * 2; // 模糊度为深度2倍 // [!] 未设置数值边界，极端坐标可能产生异常效果
}
graph TDsubgraph 鼠标事件处理A[进入图像区域] --> B[显示放大镜]C[移动鼠标] --> D{控件校验}D -->|image/ellipse已初始化| E[计算坐标与尺寸]E --> F[构建视口矩形]F --> G[更新画刷显示区域]E --> H[定位放大镜中心]I[离开图像区域] --> J[隐藏放大镜]endstyle B stroke:#4CAF50,stroke-width:2pxstyle J stroke:#F44336,stroke-width:2pxclassDef critical fill:#FFEBEE,stroke:#EF5350;class D critical
增强版代码示例
// 带边界检查和动画过渡的版本
private void Enhanced_MouseMove(object sender, MouseEventArgs e)
{if (image.ActualWidth > 0 && ellipse != null){Point point = e.GetPosition(image);double maxX = image.ActualWidth - length;double maxY = image.ActualHeight - length;// 边界约束计算double clampedX = Math.Clamp(point.X - radius, 0, maxX);double clampedY = Math.Clamp(point.Y - radius, 0, maxY);// 添加视口切换动画visualBrush.BeginAnimation(VisualBrush.ViewboxProperty,new RectAnimation(new Rect(clampedX, clampedY, length, length),TimeSpan.FromMilliseconds(150)));// 弹性定位动画ellipse.BeginAnimation(Canvas.LeftProperty, new DoubleAnimation(point.X - ellipse.ActualWidth / 2, new Duration(TimeSpan.FromMilliseconds(200))));}
}
| 属性名称 | 说明 | 例子 |
| Radius | 获取或设置模糊效果的曲线的半径。默认值为5 | Radius="5" |
| KernelType | 获取或设置计算变得模糊的曲线 | |
| RenderingBias | 获取或设置是否呈现效果时注重速度还是质量 | |
<Window.Resources><Storyboard x:Key="WidthStoryboard" TargetProperty="Width"><DoubleAnimation From="200" To="300" Duration="0:0:1.5"AutoReverse="True" RepeatBehavior="Forever"></DoubleAnimation></Storyboard><Storyboard x:Key="HeightStoryboard" TargetProperty="Height"><DoubleAnimation From="200" To="30
