Почему горизонтальные разделители сетки центрируются в ряду, а вертикальные — нет?

Я изучаю, как использовать разделители сетки, и меня смущает то, насколько, казалось бы, горизонтальный разделитель отличается от вертикального. Если вы посмотрите на приведенный ниже код XAML, то увидите, что первый разделитель сетки, который я сделал очень легко, все работало, как и ожидалось, я установил, в какой строке и столбце он должен находиться, а затем установил, сколько строк он должен охватывать. Он разместил сплиттер там, где я и ожидал, с правой стороны колонки. (На самом деле он ничего не изменяет в размерах, и я не знаю почему, но, по крайней мере, он там, где должен быть).

Однако второй сплиттер просто никак не будет взаимодействовать. Я хочу, чтобы он был размещен над текстовым полем внизу формы. Итак, я установил его на эту ячейку, и похоже, что она оказалась в центре строки. Меня явно смущает что-то простое, чего я не понимаю, может ли кто-нибудь сказать мне, почему второй gridsplitter ведет себя не так, как я хочу?

<Window x:Class="FontViewer.MainWindow"
    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:FontViewer"
    mc:Ignorable="d"
    Title="Font Viewer" Height="480" Width="600">

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="2*"/>
    </Grid.ColumnDefinitions>

    <Grid.RowDefinitions>
        <RowDefinition Height="0.8*"/>
        <RowDefinition Height="0.5*"/>
        <RowDefinition Height="0.7*"/>
        <RowDefinition Height="1*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="0.3*"/>
    </Grid.RowDefinitions>

    <Border CornerRadius="6"
            BorderThickness="1"
            BorderBrush="Gray"
            Background="LightGray"
            Padding="8"
            Margin="6"
            Grid.ColumnSpan="2">
        <TextBlock FontSize="14"
                   TextWrapping="Wrap">
            Select a font to view from the list below.
            You can change the text by typing in the region at the bottom.
        </TextBlock>
    </Border>

    <ListBox x:Name="FontList"
             Grid.Row="1"
             Grid.RowSpan="5"
             HorizontalAlignment="Right"
             ItemsSource="{x:Static Fonts.SystemFontFamilies}"
             Width="190"
             Margin="0 0 0 8">
    </ListBox>

    <TextBox x:Name="SampleText"
             Grid.Row="5"
             Grid.Column="1"
             VerticalAlignment="Center"
             Height="18"
             MinLines="4"
             Margin="0 0 6 0"
             TextWrapping="Wrap"
             ToolTip="Type here to change the preview text.">
        The quick brown fox jumps over the lazy dog.
    </TextBox>

    <TextBlock Text="{Binding ElementName=SampleText, Path=Text}"
               FontFamily="{Binding ElementName=FontList,Path=SelectedItem}"
               FontSize="10"
               TextWrapping="Wrap"
               Margin="6"
               Grid.Column="1"
               Grid.Row="1"/>
    <TextBlock Text="{Binding ElementName=SampleText, Path=Text}"
               FontFamily="{Binding ElementName=FontList,Path=SelectedItem}"
               FontSize="16"
               TextWrapping="Wrap"
               Margin="6"
               Grid.Column="1"
               Grid.Row="2"/>
    <TextBlock Text="{Binding ElementName=SampleText, Path=Text}"
               FontFamily="{Binding ElementName=FontList,Path=SelectedItem}"
               FontSize="24"
               TextWrapping="Wrap"
               Margin="6"
               Grid.Column="1"
               Grid.Row="3"/>
    <TextBlock Text="{Binding ElementName=SampleText, Path=Text}"
               FontFamily="{Binding ElementName=FontList,Path=SelectedItem}"
               FontSize="32"
               TextWrapping="Wrap" 
               Grid.Column="1"
               Grid.Row="3"
               Margin="6,84,6,5.765" Grid.RowSpan="2"/>

    <GridSplitter Grid.Row="0"
            Grid.Column="0"
            Grid.RowSpan="6"
            Width="3"
            Background="LightGray"
            ResizeBehavior="PreviousAndNext"
            ResizeDirection="Columns" />

    <GridSplitter Grid.Row="5"
            Grid.Column="1"
            Height="3"
            Background="Black"
            ResizeBehavior="PreviousAndNext"
            ResizeDirection="Rows" />
</Grid>

Edit: It looks like I didn't include the closing window tag in the code, but it is there, it just gets omitted for some reason.


person Astralogic    schedule 27.12.2019    source источник


Ответы (1)


У тебя есть

             Grid.RowSpan="6"

На первом, который его растянет.

Попробуй временно убрать.

Обычно для разветвителя сетки устанавливается значение stretch.

Измените свой другой на:

     <GridSplitter Grid.Row="5"
        Grid.Column="1"
        Height="3"
        Background="Green"
        ResizeBehavior="PreviousAndNext"
        HorizontalAlignment="Stretch"
        ResizeDirection="Rows" />

И будет растягиваться по горизонтали.

По-прежнему мало что сделает, но будет растягиваться по горизонтали.

Трудно сказать, что еще вы хотите сделать, но обычно разделитель сетки выравнивается по краю столбца или строки.

Видеть

https://docs.microsoft.com/en-us/dotnet/framework/wpf/controls/how-to-resize-rows-with-a-gridsplitter

https://docs.microsoft.com/en-us/dotnet/framework/wpf/controls/how-to-resize-columns-with-a-gridsplitter

person Andy    schedule 27.12.2019
comment
Ах да, мне нужно было горизонтальное и вертикальное выравнивание, хотя странно, поскольку первому сплиттеру они не нужны, он автоматически был на краю. - person Astralogic; 27.12.2019