web-dev-qa-db-ja.com

ListBoxItemのヘッダーを作成するにはどうすればよいですか？

アプリケーションでListBoxを使用しています。 ListBoxには2つの列があります。列のタイトルを作りたい。レイアウトです

  <Window.Resources>
    <Style x:Key="borderBase" TargetType="Border">
        <Setter Property="BorderBrush" Value="Black" />
        <Setter Property="BorderThickness" Value="1" />
    </Style>
</Window.Resources>
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="1*" />
        <RowDefinition Height="7*" />
    </Grid.RowDefinitions>
    <!--  Title  -->
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>

        <Border Style="{StaticResource borderBase}">
            <TextBlock Text="FirstName" />
        </Border>

        <Border Grid.Column="1" Style="{StaticResource borderBase}">
            <TextBlock Text="SecondName" />
        </Border>

    </Grid>

    <!-- Data -->
    <ListBox Grid.Row="1">
        <ListBox.ItemTemplate>
            <DataTemplate>

                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition />
                        <ColumnDefinition />
                    </Grid.ColumnDefinitions>

                    <Border Style="{StaticResource borderBase}">
                        <TextBlock Style="{StaticResource textBlockBase}" Text="{Binding FirstName}" />
                    </Border>

                    <Border Grid.Column="1" Style="{StaticResource borderRigth}">
                        <TextBlock Style="{StaticResource textBlockBase}" Text="{Binding SecondName}" />
                    </Border>
                </Grid>

            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

</Grid>

ListBox内のいくつかの項目がすべてOKと表示されたら。しかし、リストに多数の要素がある場合-ListBoxの垂直スクロールバーが表示されます。次に、タイトルと列の幅を横切って移動します。

a busy cat

列とヘッダーの幅を揃える方法は？

c#wpfxamllistboxalignment
13
FetFrumos

WPFは、この目的のためにいくつかのプロパティjustを提供します。 SharedSizeGroupおよびGrid.IsSharedSizeScopeプロパティを使用する必要があります。

<Grid Grid.IsSharedSizeScope="True"><!-- Look HERE -->
    <Grid.RowDefinitions>
        <RowDefinition Height="1*" />
        <RowDefinition Height="7*" />
    </Grid.RowDefinitions>
    <!--  Title  -->
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition SharedSizeGroup="FirstNameColumn" /><!-- Look HERE -->
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Border Style="{StaticResource borderBase}">
            <TextBlock Text="FirstName" />
        </Border>
        <Border Grid.Column="1" Style="{StaticResource borderBase}">
            <TextBlock Text="SecondName" />
        </Border>
    </Grid>
    <!-- Data -->
    <ListBox Grid.Row="1">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="FirstNameColumn" />
                        <ColumnDefinition /><!--  Look Above HERE  -->
                    </Grid.ColumnDefinitions>
                    <Border Style="{StaticResource borderBase}">
                        <TextBlock Style="{StaticResource textBlockBase}" Text="{Binding FirstName}" />
                    </Border>
                    <Border Grid.Column="1" Style="{StaticResource borderRigth}">
                        <TextBlock Style="{StaticResource textBlockBase}" Text="{Binding SecondName}" />
                    </Border>
                </Grid>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

</Grid>

詳細については、MSDNの Grid.IsSharedSizeScope添付プロパティ ページをご覧ください。

12
Sheridan

なぜそんなに複雑なのですか？ GridViewColumnの "Header"属性を使用するだけです...

 <ListView >
            <ListView.View>
                <GridView>
                    <GridViewColumn  Header="Id"/>
                    <GridViewColumn  Header="Name"/>
                </GridView>
            </ListView.View>
        </ListView>
6
Dave

ListViewを使用することをお勧めします。そこでは、各列のヘッダーを定義およびスタイルでき、配置を気にする必要はありません。

    <ListView>
        <ListView.View>
            <GridView>
                <GridViewColumn>
                    <GridViewColumn.CellTemplate>
                         <Border Style="{StaticResource borderBase}">
                             <TextBlock Style="{StaticResource textBlockBase}" Text="{Binding FirstName}" />
                         </Border>
                    </GridViewColumn.CellTemplate>
                    <GridViewColumn.HeaderTemplate>
                        <!--your header template-->
                    </GridViewColumn.HeaderTemplate>
                </GridViewColumn>
                <GridViewColumn>
                    <GridViewColumn.CellTemplate>
                         <Border Style="{StaticResource borderBase}">
                             <TextBlock Style="{StaticResource textBlockBase}" Text="{Binding SecondName}" />
                         </Border>
                    </GridViewColumn.CellTemplate>
                    <GridViewColumn.HeaderTemplate>
                        <!--your header template-->
                    </GridViewColumn.HeaderTemplate>
                </GridViewColumn>
            </GridView>
        </ListView.View>
    </ListView>
3
Florian Gl
    <Grid Style="{StaticResource TableHeader}">
        <Grid.Resources>
            <Style TargetType="{x:Type Border}" BasedOn="{StaticResource TableBorder}"/>
            <Style TargetType="{x:Type TextBlock}" BasedOn="{StaticResource TextTableHeader}">
                <Setter Property="TextWrapping" Value="Wrap"/>
            </Style>
        </Grid.Resources>

        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <Border BorderThickness="1">
            <TextBlock Text="Card"/>
        </Border>

        <Border Grid.Column="1" BorderThickness="0 1 1 1">
            <TextBlock Text="Type"/>
        </Border>

        <Border Grid.Column="2" BorderThickness="0 1 1 1">
            <TextBlock Text="Limit"/>
        </Border>

        <Border Grid.Column="3" BorderThickness="0 1 1 1">
            <TextBlock Text="Amount"/>
        </Border>

        <Border Grid.Column="4" BorderThickness="0 1 1 1">
            <TextBlock Text="Payment Due"/>
        </Border>

    </Grid>

    <ListBox Style="{StaticResource ListBoxStyle}"
             ItemsSource="{Binding Source}"
             SelectedItem="{Binding SelectedItem}"
             IsHitTestVisible="{Binding IsSelectionActive}"
             ItemTemplate="{Binding ItemTemplate}" />
</Grid>
0
dnxit
   <ListView ItemsSource="{Binding Source={StaticResource  Locator},Path=EtudiantVM.ListEtudiants}">
       <ListView.View>
      <GridView>
          <GridViewColumn  Header="Nom" Width="100">
              <GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding Nom}"></TextBlock>
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>
          </GridViewColumn>
            <GridViewColumn  Header="Prénom" Width="100">
                <GridViewColumn.CellTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Prenom}"></TextBlock>
                    </DataTemplate>
                </GridViewColumn.CellTemplate>
                </GridViewColumn>
                <GridViewColumn  Header="Note" Width="100">
                <GridViewColumn.CellTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Note}"></TextBlock>
                    </DataTemplate>
                </GridViewColumn.CellTemplate>
                </GridViewColumn>
            </GridView>
        </ListView.View>
0
Mohamed