UWP 中的Strech ListBox/ItemsControl [英] Strech ListBox/ItemsControl in UWP

问题描述

我想在 UWP 中水平和垂直拉伸列表框.我尝试了一些 WPF 解决方案，但没有一个奏效.(

如何在 uwp 中拉伸列表框?

解决方案

您已显式设置 Height="252".这就是它不显示的原因.此外，您将实际 ListBox 的背景设置为 Green 但这被您的 ItemsPanelTemplate 覆盖，因此 Green 不会显示.

您的最终 XAML 应如下所示.

<ListBox.ItemContainerStyle><Style TargetType="ListBoxItem"><Setter Property="Horizo​​ntalContentAlignment" Value="Stretch"></Setter><Setter Property="VerticalContentAlignment" Value="Stretch"></Setter><Setter Property="VerticalAlignment" Value="Stretch"></Setter><Setter Property="Horizo​​ntalAlignment" Value="Stretch"></Setter><Setter Property="Background" Value="AliceBlue"/></风格></ListBox.ItemContainerStyle><ListBoxItem>asdf</ListBoxItem><ListBoxItem>asdfasdf</ListBoxItem><ListBoxItem>asdfsdf</ListBoxItem><ListBoxItem>34</ListBoxItem><ListBoxItem>as2df</ListBoxItem><ListBoxItem>asdf</ListBoxItem></列表框>

这未经过测试，但应该可以按预期工作.

I want to stretch a listbox horizontally and vertically in UWP. I tried some WPF solutions, but none of them worked. (Stretch line to width of Itemstemplate canvas in itemscontrol)

What I tried:

<Page.Content>
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <ListBox VerticalContentAlignment="Stretch" VerticalAlignment="Stretch" Background="Green">
            <ListBox.ItemContainerStyle>
                <Style TargetType="ListBoxItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter>
                    <Setter Property="VerticalContentAlignment" Value="Stretch"></Setter>
                    <Setter Property="VerticalAlignment" Value="Stretch"></Setter>
                    <Setter Property="HorizontalAlignment" Value="Stretch"></Setter>
                    <Setter Property="Background" Value="AliceBlue" />
                </Style>
            </ListBox.ItemContainerStyle>
            <ListBox.Template>
                <ControlTemplate TargetType="ListBox">
                    <ItemsPresenter  Height="252" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
                </ControlTemplate>
            </ListBox.Template>
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel VerticalAlignment="Stretch" HorizontalAlignment="Stretch" />
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBoxItem>asdf</ListBoxItem>
            <ListBoxItem>asdfasdf</ListBoxItem>
            <ListBoxItem>asdfsdf</ListBoxItem>
            <ListBoxItem>34</ListBoxItem>
            <ListBoxItem>as2df</ListBoxItem>
            <ListBoxItem>asdf</ListBoxItem>
        </ListBox>
    </Grid>
</Page.Content>

The result is the following:

How can I stretch a listbox in uwp?

解决方案

You have Explicitly Set the Height="252". That is the reason why it does not show up. Also you set the background of actual ListBox to Green but that is overridden by your ItemsPanelTemplate so Green doesn't show up.

Your final XAML should look something like below.

<ListBox VerticalContentAlignment="Stretch" VerticalAlignment="Stretch" Background="Green">
    <ListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter>
            <Setter Property="VerticalContentAlignment" Value="Stretch"></Setter>
            <Setter Property="VerticalAlignment" Value="Stretch"></Setter>
            <Setter Property="HorizontalAlignment" Value="Stretch"></Setter>
            <Setter Property="Background" Value="AliceBlue" />
        </Style>
    </ListBox.ItemContainerStyle>
    <ListBoxItem>asdf</ListBoxItem>
    <ListBoxItem>asdfasdf</ListBoxItem>
    <ListBoxItem>asdfsdf</ListBoxItem>
    <ListBoxItem>34</ListBoxItem>
    <ListBoxItem>as2df</ListBoxItem>
    <ListBoxItem>asdf</ListBoxItem>
</ListBox>

This is not Tested but should work as you expected.

这篇关于UWP 中的Strech ListBox/ItemsControl的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！