wpf 如何将网格与底部对齐,并在右下角放置两个按钮?

pn9klfpd  于 2023-03-24  发布在  其他
关注(0)|答案(2)|浏览(152)

这里是WPF的初学者。我试图创建一个窗口,窗口底部有一个面板,右下角有两个并排的按钮,如下图所示:

但到目前为止我所写的代码是这样的:

底部面板是一个烂摊子。我如何使它看起来像我原来的设计?我已经尝试在设计器内拖动,但它不起作用。
我的XAML下面(整个窗口-因为我是一个菜鸟。随时纠正任何错误)。

<Window x:Class="ace.views.Window1"
        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:ace.views"
        mc:Ignorable="d"
        Title="Welcome to My software " Height="450" Width="800">

    <Grid VerticalAlignment="top"  HorizontalAlignment="Stretch">
        <StackPanel Margin="30">
            <TextBlock FontFamily="Segoe UI" FontSize="30" Foreground="#0078D7">Welcome to my software</TextBlock>
            <TextBlock FontFamily="Segoe UI" FontSize="20" TextWrapping="Wrap" Margin="0 20">This application is here to help you to teach vocabulary to your students, and to keep track of their progress.</TextBlock>
            <TextBlock FontFamily="Segoe UI" FontSize="20" TextWrapping="Wrap" Margin="0 20">Let's get started in the next step.</TextBlock>
        </StackPanel>

        <Grid Background="#EFEFEF" VerticalAlignment="Bottom" HorizontalAlignment="Stretch" Margin="0,0,0,0">
            <Grid.RowDefinitions>
                <RowDefinition Height="*"></RowDefinition>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"></ColumnDefinition>
                <ColumnDefinition Width="*"></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <Button  x:Name="cmdSubmit"
HorizontalAlignment="Center"
VerticalAlignment="Stretch" Grid.Row="0"  Width="120" Content="Next" />

            <Button x:Name="cmdReset"
HorizontalAlignment="Center"
VerticalAlignment="Stretch" Grid.Row="0"  Width="120" Content="Cancel" Grid.Column="1"/>
        </Grid>
    </Grid>
</Window>
xsuvu9jc

xsuvu9jc1#

外部Grid中的两个RowDefinition应该可以实现Window布局。
更改内部网格的ColumnDefinitions将有助于将按钮固定到右侧。

<Window x:Class="ace.views.Window1"
        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:ace.views"
        mc:Ignorable="d"
        Background="#EFEFEF" 
        Title="Welcome to My software " Height="450" Width="800">

    <Grid Background="White">
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>

        <StackPanel Margin="30">
            <TextBlock FontFamily="Segoe UI" FontSize="30" Foreground="#0078D7">Welcome to my software</TextBlock>
            <TextBlock FontFamily="Segoe UI" FontSize="20" TextWrapping="Wrap" Margin="0 20">This application is here to help you to teach vocabulary to your students, and to keep track of their progress.</TextBlock>
            <TextBlock FontFamily="Segoe UI" FontSize="20" TextWrapping="Wrap" Margin="0 20">Let's get started in the next step.</TextBlock>
        </StackPanel>

        <Grid Grid.Row="1" Background="#EFEFEF">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <Button  x:Name="cmdSubmit" HorizontalAlignment="Center" Grid.Column="1"  Width="120" Margin="5" Content="Next"/>

            <Button x:Name="cmdReset" HorizontalAlignment="Center" Grid.Column="2"  Width="120" Margin="5" Content="Cancel"/>
        </Grid>
    </Grid>
</Window>
wxclj1h5

wxclj1h52#

将第一个网格从“顶部”更改为“拉伸”。

<Grid VerticalAlignment="Stretch"  HorizontalAlignment="Stretch">

在此处放置Grid.RowDefinitions ...

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

将第二个网格指向网格。行=1

<Grid Background="#EFEFEF" Grid.Row="1" VerticalAlignment="Bottom" HorizontalAlignment="Stretch" Margin="0,0,0,0">

若要了解有关行定义的详细信息,请Here

相关问题