2016-06-25 11 views
1

ListViewをUWP 10で水平に伸ばしたいと思います。HorizontalContentAlignmentStretchに設定しました。それはちょっとうまくいくが、それは私が欲しかった結果ではない。ListViewItem水平ストレッチUWP 10

ListViewの背景がAquaに設定されているので、ListView自体が100%になっています。 コンテンツもストレッチしていますが、このスペースは左側と右側にあります。

私の質問は次のとおりです。どうすればこれらの「余白」を左右に削除できますか?ここで

は結果である:

Screenshot

そして、ここでは、XAMLです:

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto" /> 
      <RowDefinition Height="*" /> 
     </Grid.RowDefinitions> 
     <AutoSuggestBox x:Name="SalonSearchBox" 
         Grid.Row="0" 
         QueryIcon="Find" 
         PlaceholderText="Suchen..." 
         Margin="8" /> 
     <ListView x:Name="SalonsListView" 
        Grid.Row="1" 
        Background="Aqua" 
        ItemsSource="{x:Bind ViewModel.Salons, Mode=OneWay}" 
        HorizontalAlignment="Stretch" 
        Margin="0"> 
      <ListView.ItemContainerStyle> 
       <Style TargetType="ListViewItem"> 
        <Setter Property="HorizontalContentAlignment" 
          Value="Stretch" /> 
       </Style> 
      </ListView.ItemContainerStyle> 
      <ListView.ItemTemplate> 
       <DataTemplate x:DataType="salon:Salon"> 
        <Grid Height="110" 
          Padding="8"> 
         <Grid.RowDefinitions> 
          <RowDefinition Height="*" /> 
          <RowDefinition Height="Auto" /> 
          <RowDefinition Height="Auto" /> 
          <RowDefinition Height="Auto" /> 
         </Grid.RowDefinitions> 
         <Grid.Background> 
          <ImageBrush ImageSource="{x:Bind ListingImage}" 
             Stretch="UniformToFill" /> 
         </Grid.Background> 

         <TextBlock x:Name="TitleTextBlock" 
            Grid.Row="1" 
            Text="{x:Bind Name}" 
            FontSize="20" 
            Foreground="White" 
            FontWeight="SemiBold" /> 
         <TextBlock x:Name="LocationTextBlock" 
            Grid.Row="2" 
            Foreground="White" 
            FontWeight="SemiLight"> 
          <Run Text="{x:Bind Place.PLZ}" /> 
          <Run Text="{x:Bind Place.Address}" /> 
         </TextBlock> 
         <TextBlock x:Name="DescriptionTextBlock" 
            FontWeight="SemiLight" 
            Grid.Row="3" 
            x:Phase="1" 
            Text="{x:Bind Info}" 
            Foreground="Gray" /> 
        </Grid> 
       </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView> 
    </Grid> 
</Grid> 

答えて

1

あなたがItemContainerStyleのパディングとマージンを変更する必要があります

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

あなたは定義済みグリッドのを8にすると、アイテムの周囲にアクアバックグラウンドが発生します。

+0

ありがとうございます!グリッドのパディングがなければ、テキストはエッジに張り付きます。また、グリッドのパディングも使用できます。 – DanyX23