UWP Nested ListView no stretch

Question

Я пытаюсь вставить один ListView в другой, но проблема в том, что во втором ListView мне нужна сетка, чтобы использовать всю ширину окна, чтобы разделить его на 3 столбца одинакового размера. Но, как вы видите, это не так. Я уже все пробовал, какие-то идеи о том, как я могу заставить его работать?

<Grid Background="Pink"> 
    <ListView x:Name="MainListView" 
       ItemsSource="{x:Bind menu}" 
       HorizontalAlignment="Stretch" 
       Background="BlanchedAlmond" 
       HorizontalContentAlignment="Stretch"> 
     <ListView.ItemTemplate> 
      <DataTemplate x:DataType="data:MainCategories"> 
       <Grid Background="blue" HorizontalAlignment="Stretch" > 
        <Grid.RowDefinitions> 
         <RowDefinition Height="Auto" /> 
         <RowDefinition Height="Auto" /> 
        </Grid.RowDefinitions> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="*" /> 
        </Grid.ColumnDefinitions> 
        <TextBlock Text="{x:Bind CategoryName}" 
           HorizontalAlignment="Stretch"         
           FontSize="25"         
           Foreground="Yellow" /> 
        <ListView x:Name="SubListView" 
           Grid.Row="1" 
           Background="YellowGreen" 
           HorizontalAlignment="Stretch" 
           HorizontalContentAlignment="Stretch" 
           ItemsSource="{x:Bind SubMenuItems}"> 
         <ListView.ItemTemplate> 
          <DataTemplate x:DataType="data:Dishes">                    
           <Grid HorizontalAlignment="Stretch"> 
            <Grid.ColumnDefinitions> 
             <ColumnDefinition Width="1*" /> 
             <ColumnDefinition Width="1*" /> 
             <ColumnDefinition Width="1*" /> 
            </Grid.ColumnDefinitions> 
            <TextBlock Foreground="Red" 
               Text="{x:Bind dishName}" 
               Grid.Column="0" 
               HorizontalAlignment="Center" /> 
            <TextBlock Foreground="Red" 
               Grid.Column="1" 
               HorizontalAlignment="Center" 
               Text="{x:Bind dishPrice}" /> 
            <TextBlock Foreground="Red" 
               Grid.Column="2" 
               HorizontalAlignment="Center" 
               Text="{x:Bind dishPrice}" /> 

           </Grid> 
          </DataTemplate> 
         </ListView.ItemTemplate> 
        </ListView> 
       </Grid> 
      </DataTemplate> 
     </ListView.ItemTemplate> 
    </ListView> 
</Grid> 

app screenshot

public void FillMenu() 
    { 
     menu.Add(new MainCategories() { CategoryName = "tittle1" }); 
     menu[0].SubMenuItems.Add(new Dishes() { dishName = "dish1", dishPrice = 1 }); 
     menu[0].SubMenuItems.Add(new Dishes() { dishName = "dish2", dishPrice = 11 }); 
     menu[0].SubMenuItems.Add(new Dishes() { dishName = "dish3dish3dish3", dishPrice = 12 }); 
     menu.Add(new MainCategories() { CategoryName = "tittle2" }); 
     menu[1].SubMenuItems.Add(new Dishes() { dishName = "dishab", dishPrice = 13 }); 
     menu[1].SubMenuItems.Add(new Dishes() { dishName = "sishro", dishPrice = 14 }); 
    } 

Answer 1

Вы должны установить HorizontalAlignment="Stretch" для ListViewItem следующим образом.

<ListView.ItemContainerStyle> 
    <Style TargetType="ListViewItem"> 
     <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
    </Style> 
</ListView.ItemContainerStyle> 

Установите HorizontalAlignment свойство для элементов управления внутри ListViewItem шаблона не будет принимать эффекты для компоновки ListViewItem. Обновлен код завершения следующим образом.

<Grid Background="Pink"> 
    <ListView x:Name="MainListView" 
      ItemsSource="{x:Bind menu}" 
      HorizontalAlignment="Stretch" 
      Background="BlanchedAlmond" 
      HorizontalContentAlignment="Stretch"> 
     <ListView.ItemContainerStyle> 
      <Style TargetType="ListViewItem"> 
       <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
      </Style> 
     </ListView.ItemContainerStyle> 
     <ListView.ItemTemplate> 
      <DataTemplate x:DataType="local:MainCategories"> 
       <Grid Background="blue" > 
        <Grid.RowDefinitions> 
         <RowDefinition Height="Auto" /> 
         <RowDefinition Height="Auto" /> 
        </Grid.RowDefinitions> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="*" /> 
        </Grid.ColumnDefinitions> 
        <TextBlock Text="{x:Bind CategoryName}" 
          FontSize="25"         
          Foreground="Yellow" /> 
        <ListView x:Name="SubListView" 
          Grid.Row="1" 
          Background="YellowGreen" 
          ItemsSource="{x:Bind SubMenuItems}"> 
         <ListView.ItemContainerStyle> 
          <Style TargetType="ListViewItem"> 
           <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
          </Style> 
         </ListView.ItemContainerStyle> 
         <ListView.ItemTemplate> 
          <DataTemplate x:DataType="local:Dishes"> 
           <Grid HorizontalAlignment="Stretch"> 
            <Grid.ColumnDefinitions> 
             <ColumnDefinition Width="1*" /> 
             <ColumnDefinition Width="1*" /> 
             <ColumnDefinition Width="1*" /> 
            </Grid.ColumnDefinitions> 
            <TextBlock Foreground="Red" 
              Text="{x:Bind dishName}" 
              Grid.Column="0" 
              HorizontalAlignment="Center" /> 
            <TextBlock Foreground="Red" 
              Grid.Column="1" 
              HorizontalAlignment="Center" 
              Text="{x:Bind dishPrice}" /> 
            <TextBlock Foreground="Red" 
              Grid.Column="2" 
              HorizontalAlignment="Center" 
              Text="{x:Bind dishPrice}" /> 
           </Grid> 
          </DataTemplate> 
         </ListView.ItemTemplate> 
        </ListView> 
       </Grid> 
      </DataTemplate> 
     </ListView.ItemTemplate> 
    </ListView> 
</Grid> 

И результат