C#/Xaml: Listview Item füllt nicht den gesamten Breite aus

Question

Hallo zusammen,

ich habe ein Problem mit XAML und Listview. Ich habe eine Liste bestehend aus einer Nummerierung, einem Namen und einem Wert (eingebunden in einem Stackpanel, das auch das entsprechende Design liefern soll). Soweit so gut. Jetzt habe ich das Problem, dass das Item nicht die gesamte Breite der Spalte ausfüllt.

Ich habe Code angefügt:

<ListView x:Name="ListLeader"
                                  BorderThickness="1"
                                  Margin="5"
                                  ScrollViewer.VerticalScrollBarVisibility="Visible"
                                  ScrollViewer.VerticalScrollMode="Enabled"
                                  ShowsScrollingPlaceholders="True">
                            <ListView.BorderBrush>
                                <SolidColorBrush Color="#FF787272" Opacity="0.85"/>
                            </ListView.BorderBrush>
                            <ListView.ItemTemplate>
                                <DataTemplate x:DataType="x:String">
                                    <Grid>
                                        <StackPanel Orientation="Horizontal" Width="750" BorderBrush="#FF7A5545" 
                                                Margin="5" CornerRadius="5" HorizontalAlignment="Stretch" BorderThickness="1">
                                            <StackPanel.Background>
                                                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                                    <GradientStop Color="#FF6C483C" Offset="0.928"/>
                                                    <GradientStop Color="#FF865B4B"/>
                                                </LinearGradientBrush>
                                            </StackPanel.Background>
                                            <TextBlock x:Name="Name2" Text="1" Margin="25,0"
                                                       Foreground="LawnGreen" FontWeight="Bold"
                                                       FontFamily="MV Boli" FontSize="36"
                                                       Style="{StaticResource CaptionTextBlockStyle}"/>
                                            <Image x:Name="IMGAvatar" Margin="3,0" 
                                                   Width="44" Height="44"
                                                   HorizontalAlignment="Left"
                                                   Source="ms-appx:///Assets/Character/Profil.png" />

                                            <TextBlock x:Name="txtUser" Text="UserName" 
                                                       Foreground="White" FontWeight="ExtraBold"
                                                       FontFamily="MV Boli" FontSize="30"
                                                       Style="{StaticResource BodyTextBlockStyle}" />
                                            
                                            <TextBlock x:Name="txtScore" Text="Score1515124"
                                                       Foreground="#FF7CDA00" FontWeight="ExtraBold"
                                                       FontFamily="MV Boli" FontSize="30"  
                                                       Style="{StaticResource BodyTextBlockStyle}" Margin="30,0,0,0" />
                                            
                                            
                                        </StackPanel>

                                    </Grid>
                                </DataTemplate>
                            </ListView.ItemTemplate>
                            <x:String>Item 1</x:String>
                            <x:String>Item 2</x:String>
                            <x:String>Item 3</x:String>
                            <x:String>Item 4</x:String>
                            <x:String>Item 5</x:String>
                            <x:String>Item 6</x:String>
                            <x:String>Item 7</x:String>
                            <x:String>Item 8</x:String>
                            <x:String>Item 9</x:String>
                            <x:String>Item 10</x:String>
                            <x:String>Item 11</x:String>
                            <x:String>Item 12</x:String>

                        </ListView>

Wieso füllt mein Stackpanel nicht die zur Verfügung stehenden Width aus? (hier habe ich fiktiv den Wert 750 eingesetzt).
Die drei Spalten sollten sich dem entsprechenden Platz anpassen.

Weißt jemand, woran das liegt?

Vielen Dank für Eure Tipps.

LG Michael

Answer 1

Hallo Michael,

das liegt am ItemContainer der jedes Objekt umhüllt. Du musst den Style überschreiben. So müsste es gehen

<ListView>
    <ListView.ItemTemplate>
        <!--Beschreibung deiner Items-->
    </ListView.ItemTemplate>
    <ListView.ItemContainerStyle>
        <!--Überschreibung des Styles-->
        <Style TargetType="ListViewItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
        </Style>
    </ListView.ItemContainerStyle>
</ListView>

---

Gruß Thomas
Sage nie, ich kann es nicht - sage nur, ich kann es noch nicht!
Dev Apps von mir: Icon für UWP,  UI Strings
Andere Dev Apps: UWP Community Toolkit Sample App

Answer 2

Hallo Thomas,

vielen Dank.

Manchmal ist es doch so leicht :-)

Lieben Gruß
Michael