Question

我在TextBlock内有TextBox和StackPanel个控件，我需要拉伸TextBox以按UWP中的父级大小调整大小。

<StackPanel Grid.Column="0" Grid.Row="1" Orientation="Horizontal">
    <TextBlock Text="Name:" VerticalAlignment="Center" Width="130" />
    <TextBox VerticalAlignment="Center" HorizontalAlignment="Stretch" />
</StackPanel>

这不起作用..有什么想法吗？

Answer 1

问题是堆栈面板只会伸展到子元素的大小，因此在您的示例中，您只能看到一个130像素的Textblock，而您将看不到TextBox。

要获得所需的功能，您应该使用一个网格，其中两列为130像素，另一列为*以填充可用的整个列空间。

<Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="130"/>
                <ColumnDefinition  Width="*"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="25"/>
            </Grid.RowDefinitions>

            <TextBlock Grid.Row="0" Grid.Column="0" Text="Name:" VerticalAlignment="Center" Width="130" />
            <TextBox Grid.Row="0" Grid.Column="1"/>
        </Grid>

Answer 2

我通常将TextBlock和TextBox对包裹在DockPanel

中

<DockPanel Grid.Column="0" Grid.Row="1" >
    <TextBlock Text="Name:" 
               VerticalAlignment="Center"
               Margin="5"
               />
    <TextBox VerticalAlignment="Center"/>
</DockPanel>

修改

对于没有DockPanel的UWP：

<Grid> <Grid.RowDefinitions> <RowDefinition /> <RowDefinition /> </Grid.RowDefinitions> <Grid Grid.Column="0" Grid.Row="1" > <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto"/> <ColumnDefinition /> </Grid.ColumnDefinitions> <TextBlock Text="Name:" VerticalAlignment="Center" Margin="5" /> <TextBox Grid.Column="1" VerticalAlignment="Center" HorizontalAlignment="Stretch" /> </Grid> </Grid>

Answer 3

我在UWP中解决了类似的问题

    <StackPanel Margin="{StaticResource SmallTopBottomMargin}" Orientation="Vertical">
        <TextBlock Text="Project Name:" /> 
        <TextBox />    <--full width
        <TextBlock Text="Exported Template:" /> <--full width
        <Grid HorizontalAlignment="Stretch">
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition Width="auto"/>
            </Grid.ColumnDefinitions>
            <TextBox />  <--max width - button width
            <Button Grid.Column="1">...</Button>
        </Grid>

UWP TextBox不会在StackPanel中拉伸

3 个答案: