Добавить границу вокруг всей сетки с несколькими рядами

Question

Я пытаюсь добавить границу вокруг сетки, которая в настоящее время содержит 2 строки. Эта сетка содержится в родительской сетке, которая является контейнером для всех элементов внутри окна. Мой код выглядит следующим образом:

<Grid>    <!-- This is the parent grid which is holding everything-->
    <TextBlock HorizontalAlignment="Center"
               VerticalAlignment="Top"
               Margin="0, 20, 0, 0"
               FontSize="28"
               >Welcome, User.</TextBlock>


    <Grid x:Name="inner_grid"     <!-- This is the grid I'm trying to enclose with a border-->
          Width="400"
          Height="250"
          HorizontalAlignment="Left"
          VerticalAlignment="Top"
          Margin="20, 150, 0, 0"  
        >

        <Grid.RowDefinitions>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <TextBlock Grid.Row="0"
                       FontSize="22"
                       Margin="10, 0, 0, 0">Row number 1</TextBlock>

        <TextBlock Grid.Row="1" 
                       FontSize="22"
                       Margin="10, 0, 0, 0">Row number 2</TextBlock>
    </Grid>
</Grid>

Я пробовал другие решения, в которых упоминается следующая конструкция:

 <Border BorderBrush="Black" BorderThickness="2">
 <Grid x:Name="inner_grid">
     <!-- some code -->
 </Grid>
 </Border>

Но то, что это сделало, это поставило границу вокруг родительская сетка, несмотря на теги Border, охватывающие дочернюю сетку. Еще я попробовал поместить тег <border> внутрь самого <Grid>, но это только поместит границу вокруг 0-й строки .

Как именно мне это сделать?

Редактировать (найти решение) Я добавил границу вокруг дочерней сетки, но перенес атрибуты Alignment и Margin из сетки в границу. Код следующий:

<!-- Move position attributes from the Grid into the enclosing Border -->
<Border BorderBrush="Black" 
        BorderThickness="2"
        CornerRadius="10"
        HorizontalAlignment="Left"
        VerticalAlignment="Top"
        Margin="20, 120, 0, 0">
        <Grid x:Name="inner_grid"
            Width="400"
            Height="250">
            <!-- Grid code here -->
        </Grid>

Answer 1

Вам необходимо установить VerticalAlignment и HorizontalAlignment границы. Если вы его опустите, используется значение по умолчанию Stretch. Stretch заставляет элемент заполнять все оставшееся пространство в родительском элементе. Возможные значения: Center, Left / Right и Top / Bottom.

<Border BorderBrush="Black"
        BorderThickness="2"
        HorizontalAlignment="Center"
        VerticalAlignment="Center">
  <Grid x:Name="inner_grid">
    <!-- some code -->
  </Grid>
</Border>

Также имейте в виду, что «Добро пожаловать, пользователь». TextBlock и inner_grid находятся в одной ячейке внешней сетки. Таким образом они могут визуально перекрываться.

Answer 2

Добро пожаловать в SO.

Я думаю, что проблема здесь в том, что ваша граница на самом деле находится вокруг внутреннего элемента управления, но и ваш TextBlock, и эта дочерняя Grid находятся в одной строке родительской Grid. Попробуйте дать родителю Grid несколько RowDefinitions и указать Grid.Row для этих дочерних элементов управления:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition />
    </Grid.RowDefinitions>

    <!-- This is the parent grid which is holding everything-->
    <TextBlock Grid.Row="0" HorizontalAlignment="Center"
        VerticalAlignment="Top"
        Margin="0, 20, 0, 0"
        FontSize="28"
        >Welcome, User.</TextBlock>


    <Border Grid.Row="1" BorderBrush="Black" BorderThickness="2">
        <Grid x:Name="inner_grid"
        Width="400"
        Height="250"
        HorizontalAlignment="Left"
        VerticalAlignment="Top"
        Margin="20, 150, 0, 0"  
    >

            <Grid.RowDefinitions>
                <RowDefinition Height="auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>

            <TextBlock Grid.Row="0"
                    FontSize="22"
                    Margin="10, 0, 0, 0">Row number 1</TextBlock>

            <TextBlock Grid.Row="1" 
                    FontSize="22"
                    Margin="10, 0, 0, 0">Row number 2</TextBlock>
        </Grid>
    </Border>
</Grid>