Как можно вертикально растянуть пользовательский элемент управления WPF и его компоненты, одновременно растягивая его родительское окно

Question

У меня есть пользовательский элемент управления с текстовым полем и 2 кнопками под ним.Я хочу, чтобы текстовое поле растягивалось вертикально, когда родительское окно растягивается вертикально, но ничего не происходит.Другая проблема заключается в том, что кнопки появляются под текстовым полем, когда пользовательский элемент управления помещается в окно.Но когда я вижу пользовательский элемент управления, а не в окне, кнопки разделяются 1 строкой сетки.Как я могу заставить это работать должным образом, чтобы текстовое поле увеличивалось в размере, когда родительское окно растянуто по вертикали, а также чтобы кнопки внизу оставались в стороне от текстового поля?

Вот код xaml дляокно, которое использует пользовательский элемент управления:

<Window x:Class="SerialNumTool.Views.test2View"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:SerialNumTool.UserControls"
        mc:Ignorable="d"
        Title="test2View" Height="300" Width="300"
        VerticalAlignment="Stretch">
    <Grid Margin="0,0,0,0"  Background="Cyan" >
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width=".5*"/>
            <ColumnDefinition Width=".5*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height=".20*"/>
            <RowDefinition Height=".20*"/>
            <RowDefinition Height=".20*"/>
            <RowDefinition Height=".20*"/>
            <RowDefinition Height=".20*"/>

        </Grid.RowDefinitions>
        <StackPanel Name="MainContentAreaStackPanel" Margin="0" VerticalAlignment="Stretch" 
                    HorizontalAlignment="Stretch"
                    Grid.Row="1" Grid.RowSpan="3" Grid.Column="0" Grid.ColumnSpan="2">
            <local:UserControl2  VerticalAlignment="Stretch" 
                                 HorizontalAlignment="Stretch">
            </local:UserControl2>
        </StackPanel>


    </Grid>
</Window>

Вот код управления пользователя:

<UserControl x:Class="SerialNumTool.UserControls.UserControl2"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:SerialNumTool.UserControls"
             mc:Ignorable="d" 
             d:DesignHeight="150" d:DesignWidth="200"
             VerticalAlignment="Stretch">
    <Grid Margin="0,0,0,0"  Background="Beige" >
        <Grid.ColumnDefinitions>
                <ColumnDefinition Width=".5*"/>
                <ColumnDefinition Width=".5*"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height=".20*"/>
                <RowDefinition Height=".20*"/>
                <RowDefinition Height=".20*"/>
                <RowDefinition Height=".20*"/>
                <RowDefinition Height=".20*"/>
        </Grid.RowDefinitions>
        <StackPanel Background="Green" Grid.Column="0" Grid.ColumnSpan="1" Grid.Row="1" Grid.RowSpan="2">
        <TextBox x:Name="TextOutputAreaTextBox" 
                      HorizontalAlignment="Stretch" Margin="5"  
                      VerticalAlignment="Stretch" AcceptsReturn="True"
                      VerticalScrollBarVisibility="Auto"
                      TextWrapping="Wrap" />

        </StackPanel>
        <StackPanel Orientation="Horizontal" Background="Green" Grid.Column="0" Grid.ColumnSpan="2" 
                    Margin="0,0,0,0" Grid.Row="4" Grid.RowSpan="1" HorizontalAlignment="Stretch" >

            <Button Content="Operation 2" Margin="5"></Button>
            <Button Content="Operation 3" Margin="5"></Button>
        </StackPanel>

    </Grid>
</UserControl>

Заранее спасибо.

Answer 1

Комментарий Хенка Холтермана об удалении StackPanel вокруг текста решает проблему.Текстовое поле не будет вертикально растягиваться внутри или снаружи пользовательского элемента управления внутри StackPanel.Мне пришлось удалить StackPanel вокруг текстового поля в пользовательском элементе управления, а также в окне, в котором использовался пользовательский элемент управления.Ниже приведены обновления кода для рабочего примера:

Пользовательский элемент управления с удаленной StackPanel:

<UserControl x:Class="SerialNumTool.UserControls.UserControl2"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:SerialNumTool.UserControls"
             mc:Ignorable="d" 
             d:DesignHeight="150" d:DesignWidth="200"
             VerticalAlignment="Stretch">
    <Grid Margin="0,0,0,0"  Background="Beige" >
        <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="2*"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="2*"/>
        </Grid.RowDefinitions>
        <TextBox x:Name="TextOutputAreaTextBox" Grid.Column="0" Grid.Row="1" 
                      HorizontalAlignment="Stretch" Margin="5"  
                      VerticalAlignment="Stretch"  VerticalContentAlignment="Stretch"
                      AcceptsReturn="True"
                      VerticalScrollBarVisibility="Auto"
                      TextWrapping="Wrap" />
        <StackPanel Orientation="Horizontal" Background="Green" Grid.Column="0" Grid.ColumnSpan="2" 
                    Margin="0,0,0,0" Grid.Row="4" Grid.RowSpan="1" HorizontalAlignment="Stretch" >

            <Button Content="Operation 2" Margin="5"></Button>
            <Button Content="Operation 3" Margin="5"></Button>
        </StackPanel>
    </Grid>
</UserControl>

Вот окно, в котором использовался пользовательский элемент управления:

<Window x:Class="SerialNumTool.Views.test2View"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:SerialNumTool.UserControls"
        mc:Ignorable="d"
        Title="test2View" Height="300" Width="300"
        VerticalAlignment="Stretch">
    <Grid Margin="0,0,0,0"  Background="Cyan" >
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width=".5*"/>
            <ColumnDefinition Width=".5*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height=".20*"/>
            <RowDefinition Height=".20*"/>
            <RowDefinition Height=".20*"/>
            <RowDefinition Height=".20*"/>
            <RowDefinition Height=".20*"/>

        </Grid.RowDefinitions>
        <local:UserControl2  VerticalAlignment="Stretch" 
                             HorizontalAlignment="Stretch"
                             Grid.Row="1" Grid.RowSpan="3" Grid.Column="0" Grid.ColumnSpan="2">
        </local:UserControl2>
    </Grid>
</Window>

Answer 2

Вы можете значительно упростить разметку, используя только сетки.

Похоже, вы неправильно поняли, как работает * gridmeasure.

Я думаю, что приведенная ниже разметка делает то, что вы пытаетесьдостичь.Когда вы помещаете большинство элементов управления в сетку (ячейку), они расширяются и занимают все доступное пространство.Это то, что вы хотите здесь, поэтому все, что вам нужно, это сетки и ячейки.

* не является абстрактной мерой фактической высоты в том виде, как вы ее используете.У вас был контроль, охватывающий два ряда.Я упростил это, сделав один из рядов высотой 2 *.Если бы вы хотели два элемента управления в правом столбце рядом с ним, то, конечно, вам, вероятно, нужно 5 строк.Но у вас этого нет.

    xmlns:local="clr-namespace:wpf_99"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525"
    >
    <Grid Background="Cyan" >
        <local:UserControl2/>
    </Grid>
</Window>

и

         d:DesignHeight="450" d:DesignWidth="800">
<Grid Background="Beige" >
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="2*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <TextBox x:Name="TextOutputAreaTextBox" 
                HorizontalAlignment="Stretch" 
                Margin="5"  
                VerticalAlignment="Stretch" 
                AcceptsReturn="True"
                VerticalScrollBarVisibility="Auto"
                TextWrapping="Wrap" />

        <Button Content="Operation 2" Margin="5" Grid.Row="4"></Button>
        <Button Content="Operation 3" Margin="5" Grid.Row="4" Grid.Column="1"></Button>
    </Grid>
</UserControl>