C# WPF画布缩放/变换以适应

我重新发布这个问题，因为我上次没有得到太多的回应，希望重新措辞可能会有所帮助

本质上，我试图做的是创建一个数据绑定画布，它将自动缩放其内容以“填充”可用空间。有点像缩放到合适的操作。不幸的是，我的WPF技能还不是很强，我正在努力解决如何完成最后一部分。我遵循了一些数据绑定示例来绑定画布，但不确定这是否是错误的，是否会妨碍我

根据我尝试解决方案的方式，目前我有两个基本问题：

• 我不知道该怎么做 画布自动重新缩放 如果可能，可以使用 转变
• 我似乎不知道 参考后面的画布 代码，我猜是因为它是 一个ItemsControl

举一个我想要达到的目标的例子，我得到了A，我想得到B：

（已删除指向img的过期链接）

我目前使用的代码非常简单，只需创建4个点，并使用给定的坐标和另一个视图模型来封装这些点

public class PointCollectionViewModel
{
    private List<PointViewModel> viewModels;
    public PointCollectionViewModel()
    {
        this.viewModels = new List<PointViewModel>();
        this.viewModels.Add(new PointViewModel(new Point(1, 1)));
        this.viewModels.Add(new PointViewModel(new Point(9, 9)));
        this.viewModels.Add(new PointViewModel(new Point(1, 9)));
        this.viewModels.Add(new PointViewModel(new Point(9, 1)));
    }

    public List<PointViewModel> Models
    {
        get { return this.viewModels; }
    }
}

public class PointViewModel
{
   private Point point;
   public PointViewModel(Point point)
   {
       this.point = point;
   }

   public Double X { get { return point.X; } }
   public Double Y { get { return point.Y; } }
}

公共类PointCollectionViewModel
{
私有列表视图模型；
公共点集合视图模型（）
{
this.viewModels=新列表（）；
添加（新点ViewModel（新点（1,1））；
添加（新的PointViewModel（新的点（9,9））；
添加（新点ViewModel（新点（1,9））；
添加（新点ViewModel（新点（9,1））；
}
公共列表模型
{
获取{返回this.viewModels；}
}
}
公共类PointViewModel
{
专用点；
公共点视图模型（点）
{
这个点=点；
}
公共双X{get{return point.X；}}
公共双Y{get{return point.Y；}}
}

然后，PointCollectionViewModel被用作我的AutoResisingCanvas的数据内容，它具有以下XAML来实现绑定：

<UserControl x:Class="WpfCanvasTransform.AutoResizingCanvas"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:WpfCanvasTransform"
    x:Name="parent">
    <ItemsControl x:Name="itemsControl" ItemsSource="{Binding Path=Models}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
        <Canvas x:Name="canvas" Background="DarkSeaGreen" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
            <Canvas.LayoutTransform>
            <ScaleTransform ScaleY="-1" />
            </Canvas.LayoutTransform>

        </Canvas>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate DataType="{x:Type local:PointViewModel}">
        <Ellipse Width="3" Height="3" Fill="Red"/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
    <ItemsControl.ItemContainerStyle>
        <Style>
        <Setter Property="Canvas.Top" Value="{Binding Path=Y}"/>
        <Setter Property="Canvas.Left" Value="{Binding Path=X}"/>
        </Style>
    </ItemsControl.ItemContainerStyle>
    </ItemsControl>
</UserControl>

---

由于您的

画布

似乎没有固定的宽度和高度，我会将其包含在

视图框中

：

<ItemsControl.ItemsPanel>
    <ItemsPanelTemplate>
        <Viewbox Stretch="Uniform">
            <Canvas x:Name="canvas" Background="DarkSeaGreen">
                <Canvas.LayoutTransform>
                <ScaleTransform ScaleY="-1" />
                </Canvas.LayoutTransform>
            </Canvas>
        </Viewbox>
    </ItemsPanelTemplate>
</ItemsControl.ItemsPanel>

---

或者，将整个

UserControl

放入

ViewBox

@Mart：非常有趣，它看起来很接近我想要的。如果我像你建议的那样更改代码，我会得到一个InvalidOperationException“VisualTree of ItemsPanelTemplate必须包含一个面板。“System.Windows.Controls.Viewbox”不是一个面板。“@Mart:如果我按照你的其他建议在Viewbox中包装我的AutoResisingCanvas UserControl，我的点会缩放，然而，它们出现在一个奇怪的位置，我失去了我的背景色。请参见屏幕截图：您的问题来自画布没有维度这一事实。它的父容器使它占用整个可用空间。如果知道点的X和Y的边界，请将其设置为画布宽度和高度。通过这种方式，在UserControl或ItemsControl周围放置一个Viewbox实际上会拉伸它。完成后，我必须再次检查所有数据，并调整点以将整个数据集移动到（0,0），而不是从（1,1）开始。当前正在尝试使用TranslateTransform尝试执行此操作。您的PointViewModel类可用于转换。这就是ViewModels的用途：将实际数据转换为视图数据。更改X和Y getter以将值减少1。