UWP - Ist es möglich, die Verschachtelung zwischen ListViewItems in einem UWP List View Steuerelement zu reduzieren?

Question

Ich arbeite an einem benutzerdefinierten Steuerelement, dass eine verschiebbare Liste von Bildern. Ich beschloss, diese verschiebbare Bildliste als ListView mit horizontaler Ausrichtung zu implementieren. Unten ist die XAML für die genannte Umsetzung (die Verwendung von Rahmen und verschiedene Hintergrundfarben nur um das Problem zu veranschaulichen ist):

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

    <Page.Resources> 
     <DataTemplate x:Key="ListViewItemTemplate" x:DataType="BitmapImage"> 
      <Border BorderBrush="Red" 
        BorderThickness="1" 
        Padding="0" 
        HorizontalAlignment="Center" 
        VerticalAlignment="Center" 
        Background="White"> 
       <Image x:Name="theIcon" 
         Stretch="UniformToFill" 
         Source="{Binding Path=DisplayImage}" 
         HorizontalAlignment="Center" 
         VerticalAlignment="Center"> 
       </Image> 
      </Border> 
     </DataTemplate> 
    </Page.Resources> 
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="6.7*"/> 
      <RowDefinition Height="10*"/> 
      <RowDefinition Height="80*"/> 
     </Grid.RowDefinitions> 


     <ListView x:Name="theListView" 
      ItemsSource="{Binding MyImageList}" 
      Grid.Row="0" 
      ItemTemplate="{StaticResource ListViewItemTemplate}" 
      ScrollViewer.HorizontalScrollBarVisibility="Hidden" 
      ScrollViewer.HorizontalScrollMode="Enabled" 
      ScrollViewer.VerticalScrollBarVisibility="Hidden" 
      ScrollViewer.VerticalScrollMode="Disabled"> 

      <ListView.DataContext> 
       <local:MyViewModel/> 
      </ListView.DataContext> 

      <ListView.ItemsPanel> 
       <ItemsPanelTemplate> 
        <ItemsStackPanel Orientation="Horizontal" 
           HorizontalAlignment="Stretch" 
           VerticalAlignment="Stretch"/> 
       </ItemsPanelTemplate> 
      </ListView.ItemsPanel> 

      <ListView.ItemContainerStyle> 
       <Style TargetType="ListViewItem"> 
        <Setter Property="Padding" Value="0"/> 
        <Setter Property="Margin" Value="0"/> 
        <Setter Property="HorizontalAlignment" Value="Center"/> 
        <Setter Property="VerticalAlignment" Value="Top"/> 
        <Setter Property="HorizontalContentAlignment" Value="Center"/> 
        <Setter Property="VerticalContentAlignment" Value="Stretch"/> 
        <Setter Property="BorderBrush" Value="Black"/> 
        <Setter Property="BorderThickness" Value="1"/> 
        <Setter Property="Background" Value="LightBlue"/> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="ListViewItem"> 
           <ListViewItemPresenter HorizontalAlignment="Center" 
            HorizontalContentAlignment="Center" 
            ListViewItemPresenterHorizontalContentAlignment="Center" 
            ListViewItemPresenterPadding="0" 
            Margin="0" 
            BorderThickness="1" BorderBrush="Black" 
            ListViewItemPresenterVerticalContentAlignment="Top" 
            Background="LightBlue"/> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </Style> 
      </ListView.ItemContainerStyle> 
     </ListView> 
    </Grid> 
</Page> 

Die XAML die folgende Ausgabe erzeugt (ich habe es mit Anmerkungen versehen mit dem, was ich hoffe, zu erreichen):

Frage: Ist es möglich, die Breite des Kastens, in dem die einzelnen Listenansicht Artikel gemacht werden, so dass die Verschachtelung zwischen den Symbolen reduziert kann zu reduzieren werden? Idealerweise würde ich bevorzugen, dass die Verschachtelung über eine benutzerdefinierte Breite gesteuert werden kann (in diesem Fall werde ich dies als UserControl implementieren). Wenn es keine Möglichkeit gibt, die Verschachtelung zu reduzieren, welche Alternativen gibt es dann, um das gleiche Ergebnis zu erzielen? Ich habe ContentMargin und Margin bereits mit sehr begrenztem Erfolg ausprobiert und festgestellt, dass es mein Problem nicht löst. Danke für Ihre Hilfe!

Answer 1

Sie müssen den Standardwert von MinWidth Eigenschaft ListViewItem ändern:

<ListView x:Name="theListView" ...> 
     ... 
     <ListView.ItemContainerStyle> 
      <Style TargetType="ListViewItem"> 
       ... 
       <Setter Property="MinWidth" Value="0"/> 
       ... 
      </Style> 
     </ListView.ItemContainerStyle> 
    </ListView> 

Allerdings kann ich nicht mit Sean O'Neil nicht einverstanden, dass Carousel XAML Control vom UWP Community Toolkit besser für die Aufgabe zu passen scheint. Sie können es in diesem offiziellen UWP Toolkit demo app ansehen.