WPF - 在 Canvas 中使用“Thumb”调整大小时，保持比例

Question

我正在使用 Canvas 的背景图像来显示图像。 此图像的大小是动态的，
加载图像时调整画布大小。 背景的图像拉伸是“均匀的”
此时，画布的大小会根据渲染的大小进行调整。 然后，将 Thumb 放在右下角，并通过 DragDelta 调整 Canvas 的大小。 在这种情况下，我想得到一个提示，根据原始大小的比例调整它的大小。 我想在保持纵横比的同时不断放大和缩小尺寸。 水平方向
应在 300 到 900 之间调整。 你能给我一个提示吗 Note：此问题总结整理于:WPF - When resizing using "Thumb" in Canvas, keep proportions - Microsoft Q&A

Answer 1

你好，如果想要下面的动画效果，可以尝试参考下面的例子。即使不按比例拖动画布并调整画布大小，画布也会保持其原始比例。

MainWindow.xaml：

<Grid Background="AliceBlue">  
        <Canvas x:Name="cvs" Width="300" Height="300" MaxWidth="900" MaxHeight="900" Canvas.Left="0" Canvas.Top="0" MinWidth="300" MinHeight="300" >  
            <Canvas.Background>  
                <ImageBrush ImageSource="ges.png" Stretch="Uniform"/>  
            </Canvas.Background>  
            <TextBox Canvas.Left="0"  Canvas.Top="0"  Name="changes"   
         Width="200"   Height="30"   Background="Pink" Foreground="Black"  
         BorderThickness="0"/>  
            <Thumb Name="myThumb" Canvas.Right="0" Canvas.Bottom="0" Background="Blue"   
      Width="10" Height="10" DragDelta="onDragDelta"   
      DragStarted="onDragStarted" DragCompleted="onDragCompleted" />  
        </Canvas>  
    </Grid>

MainWindow.xaml.cs：

public partial class MainWindow : Window  
  {  
    public MainWindow()  
    {  
      InitializeComponent();  
    }  
    void onDragDelta(object sender, DragDeltaEventArgs e)  
    {  
      double yadjust = cvs.Height + e.VerticalChange;  
      double xadjust = cvs.Width + e.VerticalChange;  
      if (yadjust>=0 && xadjust>=0)  
      {  
        cvs.Width = yadjust;  
        cvs.Height = yadjust;  
        Canvas.SetLeft(myThumb, Canvas.GetLeft(myThumb) +  
                                e.HorizontalChange);  
        Canvas.SetTop(myThumb, Canvas.GetTop(myThumb) +  
                                e.VerticalChange);  
        changes.Text = "Size: " +  
                               cvs.Width.ToString(CultureInfo.InvariantCulture) +  
                               ", " +  
                               cvs.Height.ToString(CultureInfo.InvariantCulture);  
      }  
    }  
    void onDragStarted(object sender, DragStartedEventArgs e)  
    {  
      myThumb.Background = Brushes.Orange;  
    }  
    void onDragCompleted(object sender, DragCompletedEventArgs e)  
    {  
      myThumb.Background = Brushes.Blue;  
    }  
  }  

如果答案是正确的，请点击“接受答案”并点赞。 如果您对此答案还有其他疑问，请点击“评论”。 注意：如果您想接收相关电子邮件，请按照我们的文档中的步骤启用电子邮件通知 此线程的通知。