将网格中的第一行除以四个相等的 WPF

本文关键字：四个 WPF 网格 一行 | 更新日期: 2023-09-27 18:36:40

我曾经在扩展的WPF工具包的WizardPage控件中绘制类似tabcontrol的东西。

相关 XAML 代码：

<xctk:WizardPage x:Name="Page1" PageType="Blank" Width="540"
             BorderBrush="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="60"/>
                <RowDefinition Height="200"/>
            </Grid.RowDefinitions>
            <DockPanel Grid.Row="0">
                <TextBox Width="135" Text="Step 1" Background="#FF2BADDE" FontSize="16" TextAlignment="Center" />
                <TextBox Width="135" Text="Step 2" Background="#FF777A7C" FontSize="16" TextAlignment="Center" />
                <TextBox Width="135" Text="Step 3" Background="#FF777A7C" FontSize="16" TextAlignment="Center" />
                <TextBox Width="135" Text="Step 4" Background="#FF777A7C" FontSize="16" TextAlignment="Center" />
            </DockPanel>
            <Grid Grid.Row="1">
                <GroupBox Header="Group 1" FontSize="16" Height="80" Margin="0,0,0,90" >
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="270"/>
                            <ColumnDefinition Width="270"/>
                        </Grid.ColumnDefinitions>
                        <RadioButton x:Name="RadioButNew" Content="New" FontSize="13.333" BorderThickness="0,1,1,1" HorizontalAlignment="Left" Margin="30,30,0,0"/>
                        <RadioButton x:Name="RadioButUpdate" Content="Update" Grid.Column="1" FontSize="13.333" Focusable="False" HorizontalAlignment="Left" Margin="30,30,0,0"/>
                    </Grid>
                </GroupBox>
            </Grid>

但是网格内的文本框的宽度不同，尽管我将每个文本框设置为相同的宽度，即 WizardPage 总宽度/4（因为我有四个文本框）。

请问有什么解决方案吗？

谢谢！

将网格中的第一行除以四个相等的 WPF

要平均分成 4 列，您应该使用网格，而不是 DockPanel。尽管没有必要在宽度之前。只需指出您有 4 列： 

<Grid>    
    <Grid.RowDefinitions>
        <RowDefinition Height="60"/>
        <RowDefinition Height="200"/>
    </Grid.RowDefinitions>
    <Grid Grid.Row="0">
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <TextBox  Grid.Column="0" Text="Step 1" Background="#FF2BADDE" FontSize="16" TextAlignment="Center" />
        <TextBox  Grid.Column="1" Text="Step 2" Background="#FF777A7C" FontSize="16" TextAlignment="Center" />
        <TextBox  Grid.Column="2"  Text="Step 3" Background="#FF777A7C" FontSize="16" TextAlignment="Center" />
        <TextBox   Grid.Column="3"  Text="Step 4" Background="#FF777A7C" FontSize="16" TextAlignment="Center" />
    </Grid>
        <Grid Grid.Row="1">
            <GroupBox Header="Group 1" FontSize="16" Height="80" Margin="0,0,0,90" >
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="270"/>
                        <ColumnDefinition Width="270"/>
                    </Grid.ColumnDefinitions>
                    <RadioButton x:Name="RadioButNew" Content="New" FontSize="13.333" BorderThickness="0,1,1,1" HorizontalAlignment="Left" Margin="30,30,0,0"/>
                    <RadioButton x:Name="RadioButUpdate" Content="Update" Grid.Column="1" FontSize="13.333" Focusable="False" HorizontalAlignment="Left" Margin="30,30,0,0"/>
                </Grid>
            </GroupBox>
        </Grid>
    </Grid>

还可以通过仅使用 1 个网格来简化 XAML。Grid.ColumnSpan是方便的，就是这样一种情况： 

<Grid>    
    <Grid.RowDefinitions>
        <RowDefinition Height="60"/>
        <RowDefinition Height="80"/>
        <RowDefinition Height="200"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
        <ColumnDefinition />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
        <TextBox   Grid.Row="0" Grid.Column="0" Text="Step 1" Background="#FF2BADDE" FontSize="16" TextAlignment="Center" />
        <TextBox  Grid.Row="0"  Grid.Column="1" Text="Step 2" Background="#FF777A7C" FontSize="16" TextAlignment="Center" />
        <TextBox  Grid.Row="0"  Grid.Column="2"  Text="Step 3" Background="#FF777A7C" FontSize="16" TextAlignment="Center" />
        <TextBox   Grid.Row="0"  Grid.Column="3"  Text="Step 4" Background="#FF777A7C" FontSize="16" TextAlignment="Center" />
        <GroupBox Header="Group 1"  Grid.Row="2" Grid.Column="0"  Grid.ColumnSpan="4" FontSize="16"  Margin="0,0,0,90" />
        <RadioButton  Grid.Row="2" Grid.Column="0"  Grid.ColumnSpan="2" x:Name="RadioButNew" Content="New" FontSize="13.333" BorderThickness="0,1,1,1" HorizontalAlignment="Center" Margin="30,30,0,0"/>
        <RadioButton  Grid.Row="2" Grid.Column="2"  Grid.ColumnSpan="2"  x:Name="RadioButUpdate"  Content="Update"  FontSize="13.333" Focusable="False" HorizontalAlignment="Center" Margin="30,30,0,0"/>
</Grid>
相关文章：