Как организовать элементы внутри кнопки

Question

Я новичок в wpf. у меня есть кнопка wpf, в нем мне нужно поместить 2 элемента: текстовый блок и окно просмотра, инкапсулирующее холст

проблема в том, что я вообще не вижу холста, если только я не даю ему статические значения для его размера

 <Button Margin="10,30,10,10" Padding="0">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition  Width="1*"/>
            <ColumnDefinition  Width="2*"/>                        
        </Grid.ColumnDefinitions>

        <TextBlock Text="Me" Grid.Row="0" Grid.Column="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"></TextBlock>
        <Viewbox Margin="0,0,0,5">
            <Canvas Background="red" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0" Grid.Column="1" >
                  <Ellipse  HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Stroke="Black"  StrokeThickness="4"   ></Ellipse>                          
            </Canvas>
        </Viewbox>
    </Grid>
</Button>

iv'e также попытался сделать это, используя панель стека с горизонтальной ориентацией ни в коем случае холст не показывает

есть мысли о том, что я делаю не так? Благодарю.

Answer 1

1. Свойства присоединенной сетки работают только на дочернем уровне сетки, т. Е. Свойства, заданные на холсте, не вступают в силу, их следует устанавливать в контейнере, ViewBox, который является прямым потомкомСетка.

2. Viewbox работают только если контент имеет конкретный размер, вам, вероятно, не нужны ни ViewBox, ни Canvas.Если вы хотите, чтобы эллипс был кругом, установите Stretch="Uniform"

3. По умолчанию содержимое кнопок не растягивается, вам следует установить HorizontalContentAligment и его вертикальный аналог Stretch.

например

<Button Margin="10,30,10,10" Padding="0" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="2*" />
        </Grid.ColumnDefinitions>

        <TextBlock Text="Me" Grid.Row="0" Grid.Column="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"></TextBlock>
        <Ellipse Stretch="Uniform" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
                Stroke="Black" StrokeThickness="4"></Ellipse>
    </Grid>
</Button>