WPF: перекрывающиеся элементы управления сеткой - PullRequest
Новая
       19

WPF: перекрывающиеся элементы управления сеткой

0 голосов
/ 11 сентября 2018

Я пытаюсь построить это в WPF (это было сделано в winform): enter image description here

Но результат выглядит так: enter image description here

Вот мой код: 

<DockPanel>
        <Menu DockPanel.Dock="Top">
            <MenuItem Header="_File">
                <MenuItem Header="_Exit" />
            </MenuItem>
            <MenuItem Header="_Test" />
        </Menu>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <Grid Grid.Row="0" Grid.Column="0">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
                <GroupBox Grid.Row="0" Grid.Column="0" Header="Interfaces" HorizontalAlignment="Left" Margin="10,10,-155,0"
                  VerticalAlignment="Top" Height="236" Width="419">
                </GroupBox>

                <GroupBox Grid.Row="1" Grid.Column="0" Header="Messages" HorizontalAlignment="Left" Margin="10,10,-155,0"
                  VerticalAlignment="Top" Height="236" Width="419">
                </GroupBox>

                <GroupBox Grid.Row="2" Grid.Column="0" Header="Responses" HorizontalAlignment="Left" Margin="10,10,-155,0"
                  VerticalAlignment="Top" Height="236" Width="419">
                </GroupBox>
            </Grid>

            <Grid Grid.Row="0" Grid.Column="1">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
                <RichTextBox Name="txtLog" Grid.Row="0" Grid.Column="0">
                    <FlowDocument>
                        <Paragraph FontSize="12">Hello, world!</Paragraph>
                    </FlowDocument>
                </RichTextBox>
            </Grid>
        </Grid>
    </DockPanel>

Я не могу понять, почему текстовое поле перекрывает поля Группы из столбца 0. Мне бы хотелось, чтобы оно заполняло сетку справа.

ТАК, что я хочу добавить больше текста: я, вероятно, захочу добавить GridSplitter в центре, поэтому помощь с этим также будет оценена.

Ответы [ 2 ]

0 голосов
/ 11 сентября 2018

Вот как вы можете упростить DockPanel, чтобы он мог соответствовать любому размеру экрана.Я удалил много ненужных вещей. 

<DockPanel>
    <Menu DockPanel.Dock="Top">
        <MenuItem Header="_File">
            <MenuItem Header="_Exit" />
        </MenuItem>
        <MenuItem Header="_Test" />
    </Menu>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <Grid Grid.Column="0">
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <GroupBox Grid.Row="0" Header="Interfaces" HorizontalAlignment="Stretch" Margin="5">
            </GroupBox>
            <GroupBox Grid.Row="1" Grid.Column="0" Header="Messages" HorizontalAlignment="Stretch" Margin="5">
            </GroupBox>
            <GroupBox Grid.Row="2" Grid.Column="0" Header="Responses" HorizontalAlignment="Stretch" Margin="5">
            </GroupBox>
        </Grid>
        <Grid Grid.Column="1">
            <RichTextBox Name="txtLog" Margin="5">
                <FlowDocument>
                    <Paragraph FontSize="12">Hello, world!</Paragraph>
                </FlowDocument>
            </RichTextBox>
        </Grid>
    </Grid>
</DockPanel>

И вывод

enter image description here

0 голосов
/ 11 сентября 2018

@ АШ прав. Отрицательное значение -155 несколько сбивает с толку, оно позволяет GroupBoxes на левой панели занимать более широкое место, чем их содержащее Grid.

Так что RichTextBox не перекрывается с GropuBoxes; RichTextBox находится там, где и должно быть, это три GroupBoxes, растянутые вправо на 155 пикселей.

А для RichTextBox, поскольку вы помещаете его в Grid, для которого Width установлен как Auto, поэтому RictTextBox не растягивается горизонтально, чтобы занять все доступное пространство.

Удаление этих строк исправит эту проблему. 

<Grid Grid.Row="0" Grid.Column="1" >

    <!--Remove the RowDefinitions/ColumnDefinitions-->           

    <RichTextBox Name="txtLog">
        <FlowDocument>
            <Paragraph FontSize="12">Hello, world!</Paragraph>
        </FlowDocument>
    </RichTextBox>
</Grid>
...