带有边界框缩放点框的用户控件答案

【问题标题】：UserControl with Bounding Box Scaling Point boxes带有边界框缩放点框的用户控件
【发布时间】：2014-06-10 13:03:10
【问题描述】：

我想像这张图片一样制作UserControl；

共有 9 个框，顶部的一个用于旋转，另一个用于缩放。我尝试使用网格和背景图像、2 行和带有StackPanel 的小框来制作这个，但必须提供大量的负边距和正边距才能达到这个结果。有什么简单的方法可以做到这一点需要帮助。

谢谢。

【问题讨论】：

标签： c# xaml windows-store-apps windows-8.1

【解决方案1】：

这样的？

<Grid HorizontalAlignment="Center" VerticalAlignment="Center">
     <Grid.RowDefinitions>
         <RowDefinition Height="25"/>
         <RowDefinition Height="Auto"/>
     </Grid.RowDefinitions>
     <Grid.Resources>
         <Style TargetType="Rectangle">
             <Setter Property="Stroke" Value="Black"/>
             <Setter Property="StrokeThickness" Value="1"/>
             <Setter Property="Height" Value="11"/>
             <Setter Property="Width" Value="11"/>
             <!-- For hittestvisibility -->
             <Setter Property="Fill" Value="Transparent"/>
         </Style>
     </Grid.Resources>

     <Line X1="0" Y1="1" X2="0" Y2="0" Stretch="Fill" Stroke="Black" />
     <Rectangle VerticalAlignment="Top" HorizontalAlignment="Center"/>

     <Grid Grid.Row="1" Height="200" Width="200" Margin="-5">

         <Rectangle Margin="5" Height="Auto" Width="Auto" Fill="{x:Null}"/>
         <Rectangle VerticalAlignment="Top" HorizontalAlignment="Left"/>
         <Rectangle VerticalAlignment="Top" HorizontalAlignment="Center"/>
         <Rectangle VerticalAlignment="Top" HorizontalAlignment="Right"/>
         <Rectangle VerticalAlignment="Center" HorizontalAlignment="Left"/>
         <Rectangle VerticalAlignment="Center" HorizontalAlignment="Right"/>
         <Rectangle VerticalAlignment="Bottom" HorizontalAlignment="Left"/>
         <Rectangle VerticalAlignment="Bottom" HorizontalAlignment="Center"/>
         <Rectangle VerticalAlignment="Bottom" HorizontalAlignment="Right"/>

         <!-- The Content -->
         <Rectangle Width="Auto" Height="Auto" Margin="20" Fill="Green"/>
         <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" 
                        Text="Content"/>
     </Grid>
</Grid>

术语是Bounding Box

【讨论】：

干杯，很高兴这是一种补救措施，我为小 Rectangle 添加了一个透明背景，这样它们就有了 hittestvisibility，你甚至可以把它们做成一个模板，提供像 mouseover Stroke 这样的改变或缩放以获得更好的用户体验。无论哪种方式，听起来都是一个整洁的项目。