我的画布垂直和水平延伸，但里面的图像不是

我创建了一个弹出菜单ToggleButton和一个Popup控件。所有这些都包含在画布中。下图是我的应用程序的右下角。我设置了我的画布，使其位于索引1列中，延伸2列，并位于第二行。我的画布垂直和水平延伸，但里面的图像不是

enter image description here

灰色图像仅仅是一个占位符。从下面的XAML，你可以看到我已经设置了所有的东西。帆布延伸，但没有别的。注释掉StackPanel和/或标签什么也不做。所以我确信这两者都不是原因。 ToggleButton没有伸展到Canvas的大小。

enter image description here

我做了截图，所以我可以突出那些相关的部分，效果更好。但是如果我需要粘贴代码，我可以。

任何想法？

编辑

更新XAML：

<Border BorderBrush="Green" BorderThickness="1" Grid.Row="3" Grid.Column="1" Grid.ColumnSpan="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"> 
      <Grid Name="ToggleButtonCanvas" Grid.Row="3" Grid.Column="1" Grid.ColumnSpan="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" > 
       <StackPanel Orientation="Vertical" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" > 
        <ToggleButton x:Name="btnPluginMenu" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"> 
         <ToggleButton.Template> 
          <ControlTemplate TargetType="{x:Type ToggleButton}"> 
           <Border x:Name="bdr" BorderThickness="0"> 
            <Border.Background> 
             <ImageBrush ImageSource="<omitted>" Stretch="Fill" TileMode="None" /> 
            </Border.Background> 
            <ContentPresenter VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="8,6,8,6" ContentSource="Content" /> 
           </Border> 
          </ControlTemplate> 
         </ToggleButton.Template> 
        </ToggleButton> 
        <Label Canvas.Left="10" Canvas.Top="10" Content="Menu" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" /> 
       </StackPanel> 
       <Popup Placement="Relative" HorizontalOffset="-120" VerticalOffset="-130" PlacementTarget="{Binding ElementName=btnPluginMenu}" IsOpen="{Binding ElementName=btnPluginMenu, Path=IsChecked}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" PopupAnimation="Scroll"> 
        <Grid Background="Gray"> 
         <Grid.BitmapEffect> 
          <DropShadowBitmapEffect /> 
         </Grid.BitmapEffect> 
        </Grid> 
       </Popup> 
      </Grid> 
     </Border>

来源

2013-02-11 ernest

帆布不会延长其子元素。改为使用网格。

从Canvas文档中的备注中MSDN：

Canvas是不具有固有的布局特性的唯一面板元件。画布的默认高度和宽度属性为零，除非它是元素的子元素，它自动将其子元素的大小设置为。 画布的子元素永远不会调整大小，他们只是定位在他们指定的坐标。这提供了灵活性的情况下固有的大小限制或对齐不需要或想要的。对于您希望子内容自动调整大小和对齐的情况，通常最好使用Grid元素。

您可以简单地在您的XAML中用Grid代替Canvas。没有必要定义行或列。

来源

2013-02-11 15:05:36 Clemens

那......工作起来。它现在水平延伸，但不是垂直延伸。我在网格周围放置了一个绿色边框，以便您可以更好地了解运行时发生了什么。我要编辑我的原始文章以包含更新的XAML。 http://i2.minus.com/i3N8CGnhcgzy8.png – ernest 2013-02-11 15:22:28

@ernest“StackPanels”仅仅意味着和他们的孩子一样高，并且不应该长到填满所有可用的空间。使用'DockPanel'或'Grid'而不是'StackPanel'，它应该可以工作。 – Rachel 2013-02-11 15:43:59

@Rachel谢谢，蕾切尔。 DockPanel几乎修复了一切。我很感谢帮助。 – ernest 2013-02-11 18:30:40

我的画布垂直和水平延伸，但里面的图像不是

回答

相关问题