Question

我有问题，我的第一个红色矩形（见图中的第三个）没有ListViewItem的高度，而第二个具有较大文本的具有相同的大小。此外，左边有一个边距，我自己没有定义。类似的情况似乎与按钮一起出现，其中蓝线不填充按钮的整个高度（图中的第三个）。

我想要实现的是像绿色矩形（图中的第3个）。没有左边缘，填满整个可能的高度。我也将我的XAML代码留在这里，并提前感谢你。

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

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="1*"/>
        </Grid.ColumnDefinitions>

        <ListView Grid.Column="0">
            <ListViewItem>
                <StackPanel Orientation="Horizontal">
                    <Rectangle Fill="Red" Width="5"/>
                    <TextBlock Text="red"/>
                </StackPanel>
            </ListViewItem>
            <ListViewItem>
                <StackPanel Orientation="Horizontal">
                    <Rectangle Fill="Red" Width="5"/>
                    <TextBlock Text="red"
                               FontSize="36"/>
                </StackPanel>
            </ListViewItem>
        </ListView>

        <Button Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" HorizontalContentAlignment="Left" VerticalContentAlignment="Top">
            <StackPanel Orientation="Horizontal">
                <Rectangle Fill="Blue" Width="5"/>
                <TextBlock Text="blue"/>
            </StackPanel>
        </Button>

        <StackPanel Orientation="Horizontal"
                    Grid.Column="2">
            <Rectangle Fill="Green" Width="5"/>
            <TextBlock Text="green"/>
        </StackPanel>



    </Grid>
</Page>

Answer 1

如果我正确理解了要求，您可以使用Border来达到您想要的效果。

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="1*"/>
        <ColumnDefinition Width="1*"/>
        <ColumnDefinition Width="1*"/>
    </Grid.ColumnDefinitions>

    <Border Grid.Column="0" BorderBrush="Red" BorderThickness="5, 0, 0, 0" >
        <ListView>
            <TextBlock Text="red"/>
            <TextBlock Text="red"/>
            <TextBlock Text="red"/>
        </ListView>
    </Border>

    <Border Grid.Column="1" BorderBrush="Blue" BorderThickness="5, 0, 0, 0" >
        <Button HorizontalAlignment="Stretch" VerticalAlignment="Stretch" HorizontalContentAlignment="Left" VerticalContentAlignment="Top">
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="blue"/>
            </StackPanel>
        </Button>
    </Border>

    <Border Grid.Column="2" BorderBrush="Green" BorderThickness="5, 0, 0, 0" >
        <StackPanel Orientation="Horizontal">
            <TextBlock Text="green"/>
        </StackPanel>
    </Border>
</Grid>

如果你想完全消除边框描边和控件之间的空间，你可以使用Margin来玩。例如，尝试

<ListView Margin="-10, 0, 0, 0">

XAML：ListViewItem中的StackPanel / GridView不占用ListViewItem的整个空间

1 个答案: