WPF绘图---Canvas中Polygon屏幕居中显示

问题描述

在一个Canvas中绘制了多个Polygon,由于坐标可能超出界面显示范围,需要将绘制的Polygon居中显示,并且缩放至界面大小,效果如下:

xaml代码
xml 复制代码
<Border
    x:Name="border"
    Background="#fff"
    ClipToBounds="True">
    <Canvas
        x:Name="canvas"
        Width="{Binding Path=ActualWidth, RelativeSource={RelativeSource AncestorType=Border}}"
        Height="{Binding Path=ActualHeight, RelativeSource={RelativeSource AncestorType=Border}}">
        <Canvas.RenderTransform>
            <TransformGroup />
        </Canvas.RenderTransform>
    </Canvas>
</Border>
实现代码
csharp 复制代码
private void CenterAndScalePolygons()
{
    if (canvas == null || canvas.Children.Count == 0)
    {
        return;
    }
    // 获取所有 Polygon 的边界框
    Rect boundingBox = GetBoundingBox(canvas.Children.OfType<Polygon>());

    // 计算需要进行的缩放和平移操作
    double scaleX = border.ActualWidth / boundingBox.Width;
    double scaleY = border.ActualHeight / boundingBox.Height;

    // 使用较小的缩放比例,保持图形完全在 Canvas 内显示
    double scale = Math.Min(scaleX, scaleY);

    double offsetX = border.ActualWidth / 2 - (boundingBox.Left + boundingBox.Right) / 2 * scale;
    double offsetY = border.ActualHeight / 2 - (boundingBox.Top + boundingBox.Bottom) / 2 * scale;

    // 遍历 Polygon 进行缩放和平移
    foreach (var polygon in canvas.Children.OfType<Polygon>())
    {
        ScaleTransform scaleTransform = new ScaleTransform(scale, scale);
        TranslateTransform translateTransform = new TranslateTransform(offsetX, offsetY);

        TransformGroup transformGroup = new TransformGroup();
        transformGroup.Children.Add(scaleTransform);
        transformGroup.Children.Add(translateTransform);

        polygon.RenderTransform = transformGroup;
        // 调整 Polygon 边框线宽
        polygon.StrokeThickness = 1 / scale;
    }
}

private Rect GetBoundingBox(IEnumerable<Polygon> polygons)
{
    double minX = double.MaxValue;
    double minY = double.MaxValue;
    double maxX = double.MinValue;
    double maxY = double.MinValue;

    foreach (Polygon polygon in polygons)
    {
        foreach (Point point in polygon.Points)
        {
            minX = Math.Min(minX, point.X);
            minY = Math.Min(minY, point.Y);
            maxX = Math.Max(maxX, point.X);
            maxY = Math.Max(maxY, point.Y);
        }
    }

    return new Rect(minX, minY, maxX - minX, maxY - minY);
}
相关推荐
小羊没烦恼!1 天前
分布式事务 | 使用DTM 的Saga 模式
java·linux·运维·数据库·wpf
samble2 天前
从零搭建半导体设备上位机(二):Prism + DryIoc,五个工程与区域导航怎么串起来
wpf·prism·dryioc
一条闲鱼_mytube2 天前
分布式 ID 生成方案:雪花算法与号段模式
分布式·算法·wpf
她说彩礼65万3 天前
WPF Prism代码走读
wpf
光泽雨5 天前
动画生命周期
c#·wpf
nap1177 天前
WPF 中常用的 LINQ 语句
wpf
做个文艺程序员10 天前
MQ第12篇:AI原生消息架构演进:从MQ到事件驱动的全链路设计
架构·消息队列·wpf·事件驱动架构·ai-native·cqrs
donk131412 天前
React Native for OpenHarmony 实战:三方库 react-native-circular-action-menu 的鸿蒙化适配指南
javascript·分布式·react native·react.js·wpf·harmonyos
donk131412 天前
React Native for OpenHarmony 实战:三方库 react-native-step-indicator 的鸿蒙化适配指南
分布式·react native·react.js·wpf·harmonyos