1. ホーム
  2. 質問と答え
  3. Windows 8 XAML ListViewのヘッダーテンプレートとアイテムテンプレート列の幅が同じである必要があります

Windows 8 XAML ListViewのヘッダーテンプレートとアイテムテンプレート列の幅が同じである必要があります

2012-12-12 17 views
5

ItemtemplateとHeadertemplateでListviewを使用しています。 両方のテンプレートには6つの列が含まれています。図1のようにテンプレートの固定幅を設定するとすべてが問題ありません。
しかし、私はアイテムのために "自動"に幅を設定したい - しかし、私は図2を取得...Windows 8 XAML ListViewのヘッダーテンプレートとアイテムテンプレート列の幅が同じである必要があります

これを処理する方法？ c＃でヘッダー列の幅を設定することはできますか？ - または他の解決策？

図1：

http://i.stack.imgur.com/8Ew3g.png

図2：

http://i.stack.imgur.com/mPX4U.png

コードリストビュー：

<ListView x:Name="DayanalyseListView" 
         HorizontalAlignment="Center" 
         VerticalAlignment="Top" 
         ItemTemplate="{StaticResource DataTemplate}" 
         HeaderTemplate="{StaticResource HeaderTemplate}"> 
      </ListView>

Headertemplate：

<DataTemplate x:Key="HeaderTemplate" > 
     <Grid Height="36" Background="DarkGray" > 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="95"/> 
       <ColumnDefinition Width="85"/> 
       <ColumnDefinition Width="85"/> 
       <ColumnDefinition Width="85"/> 
       <ColumnDefinition Width="85"/> 
       <ColumnDefinition Width="*" MinWidth="900"/> 
      </Grid.ColumnDefinitions> 
      <TextBlock x:Uid="DayProject" TextWrapping="Wrap" Text="Project" Grid.Column="0" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" Style="{StaticResource BodyTextStyle}" /> 
      <TextBlock x:Uid="DayTask" TextWrapping="Wrap" Text="Task" Grid.Column="1" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" Style="{StaticResource BodyTextStyle}" /> 
      <TextBlock x:Uid="DayFrom" TextWrapping="Wrap" Text="From" Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" Style="{StaticResource BodyTextStyle}" /> 
      <TextBlock x:Uid="DayTill" TextWrapping="Wrap" Text="Till" Grid.Column="3" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" Style="{StaticResource BodyTextStyle}" /> 
      <TextBlock x:Uid="DaySum" TextWrapping="Wrap" Text="Sum" Grid.Column="4" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" Style="{StaticResource BodyTextStyle}" /> 
      <TextBlock x:Uid="DayNote" TextWrapping="Wrap" Text="Note" Grid.Column="5" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" Style="{StaticResource BodyTextStyle}" /> 
     </Grid> 
    </DataTemplate>

ItemTemplateに：

<DataTemplate x:Key="DataTemplate"> 
     <Grid d:DesignHeight="50" Margin="0,5,0,0" > 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="95"/> 
       <ColumnDefinition Width="85"/> 
       <ColumnDefinition Width="85"/> 
       <ColumnDefinition Width="85"/> 
       <ColumnDefinition Width="85"/> 
       <ColumnDefinition Width="*"/> 
      </Grid.ColumnDefinitions> 
      <TextBlock HorizontalAlignment="Left" TextWrapping="NoWrap" Text="{Binding ProjectName}" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource ItemTextStyle_sf}" Grid.Column="0" ToolTipService.ToolTip="{Binding ProjectName}"/> 
      <TextBlock HorizontalAlignment="Left" TextWrapping="NoWrap" Text="{Binding TaskName}" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource ItemTextStyle_sf}" Grid.Column="1" ToolTipService.ToolTip="{Binding TaskName}"/> 
      <TextBlock HorizontalAlignment="Left" TextWrapping="NoWrap" Text="{Binding StartTimeString}" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource ItemTextStyle_sf}" Grid.Column="2"/> 
      <TextBlock HorizontalAlignment="Left" TextWrapping="NoWrap" Text="{Binding StopTimeString}" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource ItemTextStyle_sf}" Grid.Column="3"/> 
      <TextBlock HorizontalAlignment="Left" TextWrapping="NoWrap" Text="{Binding Sum}" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource ItemTextStyle_sf}" Grid.Column="4"/> 
      <TextBlock HorizontalAlignment="Left" TextWrapping="NoWrap" Text="{Binding Note}" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource ItemTextStyle_sf}" ToolTipService.ToolTip="{Binding Note}" Grid.Column="5"/> 
     </Grid> 
    </DataTemplate>

出典

2012-12-12 user1525243

答えて

4

ListViewコントロールは、DataGridのように動作しません。 ListViewは行を認識し、列を理解しません。グリッドを使用しているように列をシミュレートできますが、項目とヘッダーは完全に別個の2つのUI要素であることを理解することが重要です。

これは、項目の列のサイズを持つことは容易ではないことを意味し、ヘッダーの列のサイズを変更します。たとえ名前を付けても、それらはテンプレートの一部なので、名前は使用されません（複数のアイテムが作成されることに注意してください）。

固定幅のまま、*幅を使用するか、実際のDataGridコントロールを使用することをお勧めします。

出典

2013-01-22 19:15:00

4

次は、私の場合には完璧に動作します：

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition /> 
    </Grid.RowDefinitions> 
    <Grid x:Name="ListViewHeaders" > 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition /> 
      <ColumnDefinition /> 
      <ColumnDefinition /> 
      <ColumnDefinition /> 
      <ColumnDefinition /> 
     </Grid.ColumnDefinitions> 
     <TextBlock Grid.Column="0" Text="Title Col 1" /> 
     <TextBlock Grid.Column="1" Text="Title Col 2" /> 
     <TextBlock Grid.Column="2" Text="Title Col 3" /> 
     <TextBlock Grid.Column="3" Text="Title Col 4" /> 
     <TextBlock Grid.Column="4" Text="Title Col 5" /> 
    </Grid> 
    <ListView x:Name="myTable" Grid.Row="1" ItemsSource="{Binding SomeCollection}" > 
     <ListView.ItemTemplate> 
      <DataTemplate> 
       <Grid Width="{Binding ElementName=myTable, Path=ActualWidth}" > 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition /> 
         <ColumnDefinition /> 
         <ColumnDefinition /> 
         <ColumnDefinition /> 
         <ColumnDefinition /> 
        </Grid.ColumnDefinitions> 
        <TextBlock Grid.Column="0" Text="{Binding ItemProperty1}" /> 
        <TextBlock Grid.Column="1" Text="{Binding ItemProperty2}" /> 
        <TextBlock Grid.Column="2" Text="{Binding ItemProperty3}" /> 
        <TextBlock Grid.Column="3" Text="{Binding ItemProperty4}" /> 
        <TextBlock Grid.Column="4" Text="{Binding ItemProperty5}" /> 
       </Grid> 
      </DataTemplate> 
     </ListView.ItemTemplate> 
    </ListView> 
</Grid>

出典

2013-03-03 23:08:00 Magiel

0

あなたが列ごとに幅を算出し、プロパティを使用して独自のユーザーコントロールを作成して、テンプレート内でこのプロパティにバインドしようとすることができます。この助けかもしれない。

出典

2013-09-20 07:02:42 ad1Dima

1

UserControlを追加すると、私のために働きました。

<ListView x:Name="listView" ItemsSource="{Binding SomeCollection}" > 
    <ListView.ItemTemplate> 
     <DataTemplate> 
      <UserControl Width="{Binding ElementName=listView, Path=ActualWidth}"> 
       <Grid> 
       .... 
       </Grid> 
      </UserControl> 
     </DataTemplate> 
    </ListView.ItemTemplate> 
</ListView>`

出典

2013-11-04 12:19:57

1

フルListViewの幅にアイテムを伸ばすためにこれを試してみてください。

<ListView> 
    <ListView.ItemContainerStyle> 
     <Style TargetType="ListViewItem"> 
      <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
     </Style> 
    </ListView.ItemContainerStyle> 
    <ListView.ItemTemplate> 
     <DataTemplate> 
      <Grid> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="80" /> 
        <ColumnDefinition Width="*" /> 
       </Grid.ColumnDefinitions> 
       <TextBlock Grid.Column="0" Text="{Binding Number}" /> 
       <TextBlock Grid.Column="1" Text="{Binding Text}" /> 
      </Grid> 
     </DataTemplate> 
    </ListView.ItemTemplate> 
</ListView>

出典

2014-09-17 22:27:59

2

私のために働い以下。キーは、Horizo​​ntalContentAlignmentプロパティをStretchに設定することでした。

<ListView Grid.Row="6" Name="lvMembersSearchResults" Background="LightGray" ItemClick="lvMembersSearchResults_ItemClick" IsItemClickEnabled="True" Margin="5,5,5,5"> 
      <ListView.ItemContainerStyle> 
       <Style TargetType="ListViewItem"> 
        <Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter> 
       </Style> 
      </ListView.ItemContainerStyle> 
      <ListView.Header> 
       <Style TargetType="ListViewHeaderItem"> 
        <Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter> 
       </Style> 
      </ListView.Header> 
      <ListView.HeaderTemplate> 
       <DataTemplate> 
        <Grid Height="30" Background="DarkGray"> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="60"/> 
          <ColumnDefinition Width="*"/> 
          <ColumnDefinition Width="70"/> 
          <ColumnDefinition Width="50"/> 
         </Grid.ColumnDefinitions> 
         <TextBlock x:Uid="tbRank" TextWrapping="Wrap" Text="Rank" Grid.Column="0" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="ExtraBold" FontSize="18" /> 
         <TextBlock x:Uid="tbName" TextWrapping="Wrap" Text="Name" Grid.Column="1" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="ExtraBold" FontSize="18" /> 
         <TextBlock x:Uid="tbTaxId" TextWrapping="Wrap" Text="Tax ID" Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="ExtraBold" FontSize="18" /> 
         <TextBlock x:Uid="tbCommand" TextWrapping="Wrap" Text="Cmd" Grid.Column="3" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="ExtraBold" FontSize="18" /> 
        </Grid> 
       </DataTemplate> 
      </ListView.HeaderTemplate> 
      <ListView.ItemTemplate> 
       <DataTemplate> 
        <Grid Height="30" Background="DarkBlue"> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="60"/> 
          <ColumnDefinition Width="*"/> 
          <ColumnDefinition Width="70"/> 
          <ColumnDefinition Width="50"/> 
         </Grid.ColumnDefinitions> 
         <TextBlock TextWrapping="NoWrap" Text="{Binding Rank}" Grid.Column="0" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18" /> 
         <TextBlock TextWrapping="NoWrap" Text="{Binding Name}" Grid.Column="1" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18"/> 
         <TextBlock TextWrapping="NoWrap" Text="{Binding TaxId}" Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18"/> 
         <TextBlock TextWrapping="NoWrap" Text="{Binding Command}" Grid.Column="3" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18"/> 
        </Grid> 
       </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView>

出典

2016-03-02 13:58:29 Paul

+0

これは私が終わったところであり、完璧に機能しました。ありがとう！ – Bugs

関連する問題

 関連する問題