2012-10-02 35 views
3

我想画一个显示内容的用户控件。基本上我想要一个自定义框,无论内容是什么。如何在不缩放线宽的情况下缩放路径几何图形以适合视图框?

我想要那个盒子缩放,所以我正在使用一个viewbox。不幸的是,viewbox转换整个显示的控件,而不仅仅是框的几何形状。这导致用于边框的线条被拉伸。

这里是我的控制,我需要伸展点的矢量路径,以适应父盒。 Here is what I want to scale to fill the parent box

这里是不希望的结果,我得到。

enter image description here

是否有STRETCH时到充满几何同时不结垢白描厚度什么好办法?

我知道我可以用这种简单的几何图形这几个其他的方式,但是在我的实际应用程序的路径要复杂得多。

这里是那些有兴趣谁在我的控制代码:

<UserControl.Template> 
    <ControlTemplate TargetType="{x:Type UserControl}"> 
     <Grid> 
      <Viewbox Stretch="Fill"> 
       <Canvas Name="svg2" Margin="0" Width="100" Height="63" > 
        <Path Fill="#FFFFFFFF" Stroke="#FF6800FF" StrokeThickness="4" StrokeStartLineCap="Flat" StrokeEndLineCap="Flat" StrokeLineJoin="Miter" StrokeMiterLimit="4" Name="rect2985" RenderTransformOrigin="0,0"> 
         <Path.Data> 
          <PathGeometry FillRule="Nonzero" Figures="M 0,250 L 0,50 L 150,50 L 200,-0.96 L 250,50 L 400,50 L 400,250 L 0,250z"> 
           <PathGeometry.Transform> 
            <TransformGroup> 
             <ScaleTransform ScaleX=".24" ScaleY=".23" /> 
            </TransformGroup> 
           </PathGeometry.Transform> 
          </PathGeometry> 
         </Path.Data> 

         <Path.RenderTransform> 
          <TransformGroup> 
           <TranslateTransform X="2.1" Y="3" /> 
          </TransformGroup> 
         </Path.RenderTransform> 
        </Path> 

        <Grid Canvas.Top="17" Width="90" HorizontalAlignment="Center" Height="40" Canvas.Left="5"> 
         <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"   
            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
        </Grid> 

       </Canvas> 
      </Viewbox> 
     </Grid> 
    </ControlTemplate> 
</UserControl.Template> 

回答

3

取下视框,并分割你的“边界”为固定大小,水平伸展,和垂直拉伸件,如下图:

Content Decorator

从这里我们可以看出,列宽(从左至右)应为:

  1. 固定
  2. 变量/拉伸
  3. 固定
  4. 变量/拉伸
  5. 固定

和行高度(从顶部至底部)应该是:

  1. 固定
  2. 变量/拉伸
  3. 固定

从这里你就可以构建XAML网格,你的“边界”的每个部分放置到相应的位置。这样,当控件的高度发生变化时,只有垂直线被拉伸。类似地,当内容的宽度改变时,只有水平线会被拉伸。

相关问题