wpf 列表框和数据模板，里面有网格 [英] wpf listbox and datatemplate with grid inside

问题描述

我有以下问题.我想让 ListBox 和 DataTemplate 作为 Grid.该网格有 2 个两列.我想将第一个列宽设置为 3*，另一个设置为 *.这个怎么做?我将复制我的代码.

I have a following question. I want to have ListBox with DataTemplate as Grid. This grid has 2 two columns. I want to set first column width to 3* and another to *. How to do this? I will copy my code.

<ListBox x:Name="commandListbox" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" HorizontalAlignment="Stretch">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="3*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>

                <TextBlock Grid.Column="0" Text="{Binding}"/>
                <TextBlock Grid.Column="1" Text="icon" />
           </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>                
</ListBox>

推荐答案

最好将模板存储在资源中:

Better to store the template in resources:

<Window.Resources>
  <DataTemplate x:Key="DefaultTemplate">
    <Grid x:Name="GridItem" Width="200">
       <Grid.ColumnDefinitions>
           <ColumnDefinition Width="Auto" />
           <ColumnDefinition Width="Auto" />
       </Grid.ColumnDefinitions>

       <TextBlock x:Name="Parameter" Grid.Column="1" Text="{Binding Path=Name}" Margin="5,1,0,0" />
       <TextBlock x:Name="Value" Grid.Column="2" Text="{Binding Path=Age}" Margin="85,1,0,0" />

       <Line x:Name="Separator" X1="0" X2="0" Y1="0" Y2="20" SnapsToDevicePixels="True" Grid.Column="1" Stroke="Black" StrokeThickness="2" Margin="50,0,0,0" HorizontalAlignment="Left" />
   </Grid>
 </DataTemplate>
</Window.Resources>

列表框定义:

<ListBox Name="MyListBox" ItemTemplate="{StaticResource DefaultTemplate}" />

在 C# 代码中:

public class Person
{
  public string Name
  {
    get;
    set;
  }

 public int Age
 {
   get;
   set;
 }
}

定义 ObservableCollection:

Define ObservableCollection:

private ObservableCollection<Person> MyListBoxData = new ObservableCollection<Person>();

并在集合中添加项目:

MyListBoxData.Add(new Person()
{
  Name = "Nick",
  Age = 21,
});

MyListBoxData.Add(new Person()
{
  Name = "Adam",
  Age = 11,
});

MyListBox.ItemsSource = MyListBoxData;

已

然后设置第一个TextBlock的Width="3*"、Width="*"和Margin="-WidthGrid":

Then set Width="3*", Width="*" and Margin="-WidthGrid" of the first TextBlock:

<Grid x:Name="GridItem" Width="300">
 <Grid.ColumnDefinitions>
  <ColumnDefinition Width="3*" />
  <ColumnDefinition Width="*" />
 </Grid.ColumnDefinitions>

 <TextBlock x:Name="Parameter" Grid.Column="1" Text="{Binding Path=Name}" Margin="-220,0,0,0" />
 <TextBlock x:Name="Value" Grid.Column="2" Text="{Binding Path=Age}" Margin="0,0,0,0" />
</Grid>

这篇关于wpf 列表框和数据模板，里面有网格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！