it-swarm.com.de

wpf Listbox, die Spalten eine Kopfzeile enthält

Ich habe das folgende Markup (xaml):

<ListBox Name="lbEurInsuredType" HorizontalContentAlignment="Stretch">
            <ListBox.ItemTemplate>
               <DataTemplate>
                    <Grid Margin="0,2">
                        <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="100"></ColumnDefinition>
                            <ColumnDefinition Width="30"></ColumnDefinition><ColumnDefinition Width="2"></ColumnDefinition>
                            <ColumnDefinition Width="30"></ColumnDefinition>
                   </Grid.ColumnDefinitions>
                   <TextBlock Text="{Binding Title}"></TextBlock>
                   <TextBox Text="{Binding Uw}" Grid.Column="1"></TextBox>
                   <TextBox Text="{Binding Partner}" Grid.Column="3"></TextBox>
                </Grid>
            </DataTemplate></ListBox.ItemTemplate>

        </ListBox>

Das sieht zwar alles gut aus, aber jetzt über den Spalten 1 und 3 möchte ich eine Überschrift platzieren. Kann mir jemand zeigen, wie ich meinen zwei Spalten Kopfzeilen hinzufüge.

8
bilpor

Listenansicht ist sicherlich die beste Option, aber wenn Sie eine Listbox verwenden müssen, können Sie die Vorlage der Listbox auf diese Weise ändern.

   <ListBox Name="lbEurInsuredType" HorizontalContentAlignment="Stretch">
        <ListBox.Template>
            <ControlTemplate>
                <DockPanel LastChildFill="True">
                    <Grid DockPanel.Dock="Top" Height="30">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="100"></ColumnDefinition>
                            <ColumnDefinition Width="30"></ColumnDefinition>
                            <ColumnDefinition Width="2"></ColumnDefinition>
                            <ColumnDefinition Width="30"></ColumnDefinition>
                        </Grid.ColumnDefinitions>
                        <Label Grid.Column="0">Column 1</Label>
                        <Label Grid.Column="1">Column 2</Label>
                        <Label Grid.Column="2">Column 3</Label>
                        <Label Grid.Column="3">Column 4</Label>
                    </Grid>
                    <ItemsPresenter></ItemsPresenter>
                </DockPanel>
            </ControlTemplate>
        </ListBox.Template>
        <ListBox.ItemTemplate>
            <DataTemplate>
                <Grid Margin="0,2">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="100"></ColumnDefinition>
                        <ColumnDefinition Width="30"></ColumnDefinition>
                        <ColumnDefinition Width="2"></ColumnDefinition>
                        <ColumnDefinition Width="30"></ColumnDefinition>
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="{Binding Title}"></TextBlock>
                    <TextBox Text="{Binding Uw}" Grid.Column="1"></TextBox>
                    <TextBox Text="{Binding Partner}" Grid.Column="3"></TextBox>
                </Grid>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>
11
Mattia Magosso

Ich empfehle, dass Sie stattdessen eine ListView verwenden, die für Ihren Fall besser geeignet ist. Sie könnten eine GridView im Inneren verwenden und die Spalten definieren, die Sie benötigen, um sie dann viel einfacher neu zu gestalten

 <ListView Name="lbEurInsuredType" HorizontalContentAlignment="Stretch" ItemsSource="{Binding Items}">
        <ListView.View>
            <GridView>
                <GridView.Columns>
                    <GridViewColumn>
                        <GridViewColumn.CellTemplate>
                            <DataTemplate>
                                <TextBlock Text="{Binding Title}"></TextBlock>
                            </DataTemplate>
                        </GridViewColumn.CellTemplate>
                        <GridViewColumn.Header>
                            <TextBlock Text="Column 1"></TextBlock>
                        </GridViewColumn.Header>
                    </GridViewColumn>
                    <GridViewColumn>
                        <GridViewColumn.CellTemplate>
                            <DataTemplate>
                                <TextBlock Text="{Binding Uw}"></TextBlock>
                            </DataTemplate>
                        </GridViewColumn.CellTemplate>                           
                    </GridViewColumn>
                    <GridViewColumn>
                        <GridViewColumn.CellTemplate>
                            <DataTemplate>
                                <TextBlock Text="{Binding Partner}"></TextBlock>
                            </DataTemplate>
                        </GridViewColumn.CellTemplate>
                        <GridViewColumn.Header>
                            <TextBlock Text="Column 3"></TextBlock>
                        </GridViewColumn.Header>
                    </GridViewColumn>
                </GridView.Columns>
            </GridView>
        </ListView.View>                      
    </ListView>
4
SamTheDev

Sogar die Listbox kann sich innerhalb einer Benutzersteuerung mit dynamischer Datenvorlage befinden 

    <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

Ich habe das nicht ausgeführt, daher gibt es möglicherweise ein Problem mit dem Code, aber dies gibt Ihnen die Idee, der ListBox Kopfzeilen hinzuzufügen 

<ListBox Name="lbEurInsuredType" HorizontalContentAlignment="Stretch">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Grid Margin="0,2">
                <Grid.RowDefinitions>
                    <RowDefinition  />
                    <RowDefinition  />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="100"></ColumnDefinition>
                    <ColumnDefinition Width="30"></ColumnDefinition>
                    <ColumnDefinition Width="2"></ColumnDefinition>
                    <ColumnDefinition Width="30"></ColumnDefinition>
                </Grid.ColumnDefinitions>

                <TextBlock Text="Title" ></TextBlock>
                <TextBlock Text="Uw" Grid.Column="1" ></TextBox>
                <TextBlock Text="Partner" Grid.Column="3" ></TextBox>

                <TextBlock Text="{Binding Title}" Grid.Row="1"></TextBlock>
                <TextBox Text="{Binding Uw}" Grid.Column="1" Grid.Row="1"></TextBox>
                <TextBox Text="{Binding Partner}" Grid.Column="3" Grid.Row="1"></TextBox>
            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>
0

ListBox hat keine HeaderTemplate. ListView ist nicht die beste Option, da Width="*" nicht unterstützt wird. Wenn Sie verzweifelt werden und zu DataGrid gehen, erhalten Sie möglicherweise viel mehr als Sie benötigen. Die Lösung ist die Verwendung einer HeaderedItemsControl 

Ändern Sie einfach den Namen der Sammlung, an die Sie binden, und ändern Sie die Bindungseigenschaften. 

<!-- actual XAML -->
       <HeaderedItemsControl 

                                                    ItemTemplate="{DynamicResource CorrugationItemTemplate}" 
                                                    ItemsSource="{Binding CorrugationItemCollection}"
                                                    Style="{DynamicResource CorrugationStyle}"/>


    <!-- this goes in the resource dict --> 

        <DataTemplate x:Key="CorrugationItemTemplate">
            <Grid Width="Auto" Background="#e1e1e1">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="60"/>
                    <ColumnDefinition Width="60"/>
                    <ColumnDefinition Width="60"/>
                    <ColumnDefinition Width="60"/>
                </Grid.ColumnDefinitions>
                <Border Grid.Column="0"  Background="Lime" >
                    <Label Content="{Binding RangeLabel}" />
                </Border>
                <Border Grid.Column="1"   Background="Orange" >
                    <Label Content="{Binding LeftPreGrind}" />
                </Border>
                <Border Grid.Column="2"  Background="Lime" >
                    <Label Content="{Binding RightPreGrind}" />
                </Border>
                <Border Grid.Column="3"  Background="Orange" >
                    <Label Content="{Binding LeftPostGrind}" />
                </Border>
                <Border Grid.Column="4"  Background="Lime" >
                    <Label  Content="{Binding RightPostGrind}" />
                </Border>
            </Grid>
        </DataTemplate>

        <Style TargetType="{x:Type HeaderedItemsControl}" x:Key="CorrugationStyle">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type HeaderedItemsControl}">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="60"/>
                                <ColumnDefinition Width="60"/>
                                <ColumnDefinition Width="60"/>
                                <ColumnDefinition Width="60"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="20pt"/>
                                <RowDefinition Height="4*"/>
                            </Grid.RowDefinitions>

                            <Border Grid.Column="0"  Background="Orange" >
                                <Label Content="Range" />
                            </Border>
                            <Border Grid.Column="1"   Background="Lime" >
                                <Label Content="LeftPreGrind" />
                            </Border>
                            <Border Grid.Column="2"  Background="Orange" >
                                <Label Content="RightPreGrind" />
                            </Border>
                            <Border Grid.Column="3"  Background="Lime" >
                                <Label Content="LeftPostGrind" />
                            </Border>
                            <Border Grid.Column="4"  Background="Orange" >
                                <Label  Content="RightPostGrind" />
                            </Border>




                            <Grid Grid.Row="1" Grid.ColumnSpan="5" Width="Auto" Height="Auto" Background="White">
                                <ItemsPresenter/>
                            </Grid>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
0