简体   繁体   中英

Grid view Item does not take all width availabel UWP Xaml

I wan't to display a grid view list item but I don't know why the gridview (in purple) take all the place I wan't but the grid elements does not take all the width evailable they wrap the content, what I'm missing ?

<GridView 
                Background="Purple"
                Grid.Row="1"
                Margin="20,20,20,0"
                ItemsSource="{Binding MyItems}"
                Style="{StaticResource GridViewStyle}"
                SelectionMode="Multiple"
            HorizontalContentAlignment="Stretch">
            <GridView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Vertical" 
                                HorizontalAlignment="Stretch"
                VerticalAlignment="Stretch"
                Background="White"
                BorderThickness="1"
                BorderBrush="Gray">

                        <StackPanel Orientation="Horizontal" 
                        HorizontalAlignment="Stretch">
                            <TextBlock Text="{Binding Name, Mode=OneWay}"/>
                            <TextBlock Text="{Binding Creator, Mode=OneWay}"/>                            </StackPanel>

                    </StackPanel>
                </DataTemplate>
            </GridView.ItemTemplate>
            <GridView.ItemContainerStyle>
                <Style TargetType="GridViewItem">
                    <Setter Property="Margin" Value="0,0,0,20"/>
                    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                </Style>
            </GridView.ItemContainerStyle>
            <GridView.ItemsPanel>
                <ItemsPanelTemplate>
                    <ItemsWrapGrid Orientation="Horizontal" 
                                   VerticalAlignment="Center"
                                   HorizontalAlignment="Center" 
                                   MaximumRowsOrColumns="1"/>
                </ItemsPanelTemplate>
            </GridView.ItemsPanel>
        </GridView>

Here is the render :

在此处输入图片说明

If you want the items to stack like this, you should be using a ListView instead. All you have to do is to remove the whole <GridView.ItemsPanel>...</GridView.ItemsPanel> code, change the GridView to ListView and TargetType="GridViewItem" to TargetType="ListViewItem" .

It looks like you want a single-column GridView. Try to use a ListView instead, and remove the custom ItemsPanelTemplate from your code. In the ListView items will use all the width available.

Alternatively set the HorizontalAlignment="Stretch" in your ItemsWrapGrid.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM