在数据模板中设置列表框的列宽

时间:2014-12-31 15:55:10

标签: c# wpf xaml .net-4.0

这是我的Employee类及其集合。

public class Employee
{
    public string LastName { get; set; }
    public string FirstName { get; set; }
    public bool IsHardWorking { get; set; }
    public string Description { get; set; }
}

List<Employee> Employees = new List<Employee>()
{
    new Employee() { IsHardWorking = false, LastName = "Silly", FirstName = "Dude", Description= "this due is a mess" },
    new Employee() { IsHardWorking = true, LastName = "Mean", FirstName = "Person", Description= "funny" },
    new Employee() { IsHardWorking = false, LastName = "New", FirstName = "Friend", Description= "let her go in next round of layoffs" },
    new Employee() { IsHardWorking = true, LastName = "My", FirstName = "Buddy", Description= "simply no comments" },
};

使用下面显示的数据模板显示数据。

<Grid Loaded="DataLoaded">
        <Grid.RowDefinitions>
            <RowDefinition Height="6*" />
            <RowDefinition  />
        </Grid.RowDefinitions>

        <ListBox x:Name="lst1"  Grid.Row="0"  >
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="9*" />
                            <ColumnDefinition />
                        </Grid.ColumnDefinitions>


                        <StackPanel Orientation="Vertical" Grid.Column="0" HorizontalAlignment="Left">
                            <StackPanel Orientation="Horizontal">
                                <Label FontFamily="Tahoma" FontSize="12" VerticalAlignment="Bottom" Content="Last Name" />
                                <Label FontFamily="Tahoma" FontSize="18" VerticalAlignment="Bottom" Content="{Binding LastName}" />
                            </StackPanel>
                            <StackPanel Orientation="Horizontal">
                                <Label FontFamily="Tahoma" FontSize="12" VerticalAlignment="Bottom" Content="First Name" />
                                <Label FontFamily="Tahoma" FontSize="18" VerticalAlignment="Bottom" Content="{Binding FirstName}" />
                            </StackPanel>
                            <StackPanel Orientation="Horizontal">
                                <Label FontFamily="Tahoma" FontSize="12" VerticalAlignment="Bottom" Content="Details" />
                                <Label FontFamily="Tahoma" FontSize="18" VerticalAlignment="Bottom" Content="{Binding Description}" />
                            </StackPanel>
                        </StackPanel>

                        <Image Source="{Binding IsHardWorking, Converter={StaticResource valueToImageConverter}}"  Height="50" Grid.Column="1" HorizontalAlignment="Right" />
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

        <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Margin="5" Grid.Row="1" >
            <Button x:Name="btnClose" Content="Close" Margin="5" Width="50"  />
        </StackPanel>

    </Grid>

这是它的外观。

enter image description here

我的问题是我希望图像列应该是固定宽度的右对齐。第一列被分配了大部分宽度(9 *),但我不知道如何使它看起来像一列。任何想法

更新
在实施@FlatEric建议后,下面是我得到的。 enter image description here
我的右侧仍有很多空白区域(标有黄色矩形)。我尝试将图像的边距设置为0,但这并没有改变任何东西。

2 个答案:

答案 0 :(得分:1)

要在一列中对齐所有图片,您可以在SharedSizeGroupColumnDefinitions的{​​{1}}设置Grid属性:

DataTemplate

然后在<Grid.ColumnDefinitions> <ColumnDefinition Width="9*" SharedSizeGroup="A" /> <ColumnDefinition Width="*" SharedSizeGroup="B" /> </Grid.ColumnDefinitions>

中设置Grid.IsSharedSizeScope="True"
ListBox

修改

删除右侧的空格:

  • 仅为第二列设置<ListBox x:Name="lst1" Grid.Row="0" Grid.IsSharedSizeScope="True" >
  • ShareSizeGroup添加到HorizontalContentAlignment="Stretch"

答案 1 :(得分:1)

只需将HorizontalContentAlignment='Stretch'添加到ListBox元素即可。除非你的valueToImageConverter中有异常的东西应该有用。没有必要使用SharedSizeGroup