在 WinRT 中使用 DataTemplate 添加 table header 到 Listview

Question

在我的 Xaml 中，我正在绑定来自 wcf 的一些数据。我不知道如何向列中添加一些 table headers。列中的数据也没有很好地对齐，我认为这是因为 ColumnDefinition Width="auto"。

我希望列像示例中那样对齐

示例：

我的Xaml

<ListView Margin="120,30,0,120" ItemsSource="{Binding MainViewModel}"
          Grid.Row="1">
    <ListView.ItemTemplate>
        <DataTemplate>
            <Grid Width="500" VerticalAlignment="Center">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="auto" />
                    <ColumnDefinition Width="auto" />
                    <ColumnDefinition Width="auto" />
                    <ColumnDefinition Width="auto" />
                    <ColumnDefinition Width="auto" />
                    <ColumnDefinition Width="auto" />
                    <ColumnDefinition Width="auto" />
                </Grid.ColumnDefinitions>
                <Grid.Resources>
                    <Style TargetType="TextBlock">
                        <Setter Property="Margin" Value="5,0" />
                    </Style>
                </Grid.Resources>                        
                <TextBlock Grid.Column="0" Text="{Binding Data, Mode=TwoWay}"/>
                <TextBlock Grid.Column="1" Text="{Binding Year, Mode=TwoWay}" />
                <TextBlock Grid.Column="2" Text="{Binding Month, Mode=TwoWay}" />
                <TextBlock Grid.Column="3" Text="{Binding Weekday, Mode=TwoWay}" />
                <TextBlock Grid.Column="4" Text="{Binding Day, Mode=TwoWay}" />
                <TextBlock Grid.Column="5" Text="{Binding Data2, Mode=TwoWay}"></TextBlock>
                <TextBlock Grid.Column="6" Text="{Binding Data3, Mode=TwoWay}"></TextBlock>
            </Grid>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

由于我的试错失败，非常感谢任何帮助！谢谢

Answer 1

为了能够完全设置 ListView 的样式，您应该修改 ListView.ItemContainerStyle、ListView.ItemTemplate 和 ListView.Template。这是一个例子：

    <ListView Margin="120,30,0,120" ItemsSource="{Binding MainViewModel}"
      Grid.Row="1">
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ListViewItem">
                            <Grid>
                                <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ListView.ItemContainerStyle>
        <ListView.ItemTemplate>
            <DataTemplate>
                <Grid Width="500" VerticalAlignment="Center">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="1*" />
                        <ColumnDefinition Width="1*" />
                        <ColumnDefinition Width="1*" />
                        <ColumnDefinition Width="1*" />
                        <ColumnDefinition Width="1*" />
                        <ColumnDefinition Width="1*" />
                        <ColumnDefinition Width="1*" />
                    </Grid.ColumnDefinitions>
                    <Grid.Resources>
                        <Style TargetType="TextBlock">
                            <Setter Property="Margin" Value="5,0" />
                            <Setter Property="Foreground" Value="White" />
                        </Style>
                        <Style TargetType="Border">
                            <Setter Property="BorderThickness" Value="1" />
                            <Setter Property="BorderBrush" Value="LightGray" />
                            <Setter Property="Background" Value="DarkGray" />
                        </Style>
                    </Grid.Resources>
                    <Border Grid.Column="0" >
                        <TextBlock Text="{Binding Data, Mode=TwoWay}" />
                    </Border>
                    <Border Grid.Column="1" >
                        <TextBlock Text="{Binding Year, Mode=TwoWay}" />
                    </Border>
                    <Border Grid.Column="2" >
                        <TextBlock Text="{Binding Month, Mode=TwoWay}" />
                    </Border>
                    <Border Grid.Column="3" >
                        <TextBlock Text="{Binding Weekday, Mode=TwoWay}" />
                    </Border>
                    <Border Grid.Column="4" >
                        <TextBlock Text="{Binding Day, Mode=TwoWay}" />
                    </Border>
                    <Border Grid.Column="5" >
                        <TextBlock Text="{Binding Data2, Mode=TwoWay}" />
                    </Border>
                    <Border Grid.Column="6" >
                        <TextBlock Text="{Binding Data3, Mode=TwoWay}" />
                    </Border>
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
        <ListView.Template>
            <ControlTemplate>
                <Grid HorizontalAlignment="Left">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid Grid.Row="0" Width="500" VerticalAlignment="Center">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="1*" />
                            <ColumnDefinition Width="1*" />
                            <ColumnDefinition Width="1*" />
                            <ColumnDefinition Width="1*" />
                            <ColumnDefinition Width="1*" />
                            <ColumnDefinition Width="1*" />
                            <ColumnDefinition Width="1*" />
                        </Grid.ColumnDefinitions>
                        <Grid.Resources>
                            <Style TargetType="TextBlock">
                                <Setter Property="Margin" Value="5,0" />
                                <Setter Property="Foreground" Value="White" />
                                <Setter Property="FontWeight" Value="Bold" />
                            </Style>
                            <Style TargetType="Border">
                                <Setter Property="BorderThickness" Value="1" />
                                <Setter Property="BorderBrush" Value="LightGray" />
                                <Setter Property="Background" Value="MidnightBlue" />
                            </Style>
                        </Grid.Resources>
                        <Border Grid.Column="0">
                            <TextBlock >Data</TextBlock>
                        </Border>
                        <Border Grid.Column="1">
                            <TextBlock >Year</TextBlock>
                        </Border>
                        <Border Grid.Column="2">
                            <TextBlock >Month</TextBlock>
                        </Border>
                        <Border Grid.Column="3">
                            <TextBlock >Weekday</TextBlock>
                        </Border>
                        <Border Grid.Column="4">
                            <TextBlock >Day</TextBlock>
                        </Border>
                        <Border Grid.Column="5">
                            <TextBlock >Data2</TextBlock>
                        </Border>
                        <Border Grid.Column="6">
                            <TextBlock >Data3</TextBlock>
                        </Border>
                    </Grid>
                    <ItemsPresenter Grid.Row="1"></ItemsPresenter>
                </Grid>
            </ControlTemplate>
        </ListView.Template>
    </ListView>

屏幕截图：

在 WinRT 中使用 DataTemplate 添加 table header 到 Listview

Adding table header to Listview with DataTemplate in WinRT

c#

xaml

listview

windows-runtime