Question

我是xaml和Windows 10 Gui编程的新手。我想设计一个带有TextBlock，ListBox和Button的页面，它们都在页面中心。无论用户如何调整窗口大小，我都希望TextBlock和按钮始终位于页面的顶部和底部。 ListBox应该自动伸展以自动填充TextBlock和ListBox之间的空白。我已经尝试将VerticalAlignment设置为不同的值，但它似乎没有做任何事情。

<Page
x:Class="FirstWin10.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:FirstWin10"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">

<StackPanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Orientation="Vertical">
    <TextBlock x:Name="textBlock" HorizontalAlignment="Center" Margin="10,20,10,0" TextWrapping="Wrap" VerticalAlignment="Top">
        <Run Text="Unkown Screen Name"/>
        <LineBreak/>
        <Run/>
    </TextBlock>
    <ListBox x:Name="listBox" HorizontalAlignment="Center" MinWidth="450" MinHeight="178" Margin="50,20,50,0" VerticalAlignment="Stretch">
        <StackPanel Orientation="Horizontal">
            <CheckBox />
            <TextBox Text="ListBox Item #1" />
        </StackPanel>
        <StackPanel Orientation="Horizontal">
            <CheckBox />
            <TextBlock>
                <Run Text="ListBox Item #2"/>
            </TextBlock>
        </StackPanel>
        <StackPanel Orientation="Horizontal">
            <CheckBox />
            <TextBlock>
                <Run Text="ListBox Item #3"/>
            </TextBlock>
        </StackPanel>
        <StackPanel Orientation="Horizontal">
            <CheckBox />
            <TextBlock>
                <Run Text="ListBox Item #4"/>
            </TextBlock>
        </StackPanel>
    </ListBox>
    <Button x:Name="button" Content="Button" HorizontalAlignment="Center" Margin="10,20,10,0" VerticalAlignment="Bottom"/>
</StackPanel>

Answer 1

考虑使用包含三行的Grid。第一行和最后一行自动拉伸到TextBlock和Button的大小;中间行占据了剩下的空间。

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <TextBlock Grid.Row="0" HorizontalAlignment="Center" /> <!-- Grid.Row="0" can be removed as it's the default -->
    <ListBox Grid.Row="1" HorizontalAlignment="Center" />
    <Button Grid.Row="2" HorizontalAlignment="Center" />
</Grid>

如何根据调整大小填充页面并调整文本位置

1 个答案: