UWP嵌套ListView没有伸展

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> 

而结果