如何使xaml ListView中的第一项不同？

这是通用Windows应用程序。

请你能告诉我如何修改一个ListView的第一个元素吗？我试图使用一个头文件模板，但我无法弄清楚如何将它绑定到我的步骤列表中的第一个元素。

第一个元素和其他元素唯一的区别是第一个边的形状将是直的。第一个元素不会有这样的样式：Data =“M0,0 10,0 10,30 0,30 10,15”

更新：我已经使用模板选择器（DataTemplateSelector）工作。这意味着我必须给每个项目一个位置号码。任何更好的解决方案非常感谢

这是我的XAML：

<Page 
    x:Class="CloserCrumbs.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:CloserCrumbs" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d"> 

    <Page.DataContext> 
     <local:SuperVM /> 
    </Page.DataContext> 

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
     <ListView ItemsSource="{Binding Steps}" SelectedItem="{Binding Steps.SelectedItem, Mode=TwoWay}" Height="40" FocusVisualPrimaryThickness="0" FocusVisualSecondaryThickness="0"> 
      <ListView.ItemsPanel> 
       <ItemsPanelTemplate> 
        <StackPanel Orientation="Horizontal" /> 
       </ItemsPanelTemplate> 
      </ListView.ItemsPanel> 

      <ListView.ItemTemplate> 
       <DataTemplate> 
        <StackPanel x:Name="t1" Orientation="Horizontal" Margin="-12" Height="30"> 

         <Grid Height="30"> 
          <Grid.ColumnDefinitions> 
           <ColumnDefinition/> 
          </Grid.ColumnDefinitions> 
          <StackPanel Orientation="Horizontal" Margin="0,0,-7,0" Height="30" > 
           <Path Data="M0,0 10,0 10,30 0,30 10,15" Fill="#d0d0d0" /> 
           <Grid> 
            <Rectangle Fill="#d0d0d0" /> 
            <TextBlock Text="{Binding ShortDescription}" Margin="10,5" VerticalAlignment="Center" Foreground="White" MinWidth="60"/> 
           </Grid> 
           <Path Data="M0,0 10,15 0,30" Fill="#d0d0d0" /> 
          </StackPanel> 
         </Grid> 
        </StackPanel> 
       </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView> 
    </Grid> 
</Page>

来源

2017-09-13 Gail Bowen

你最好在这里使用此选项DataTemplateSelector。您可以获取要应用模板的项目索引，并将特定的DataTemplate应用于该项目。

所以在这种情况下，你需要2 DataTemplates。首先没有箭头（对于第一个项目）和第二个对于所有其他项目。您可以在Page上的Page.Resources中添加它们。所以在这种情况下，就像下面这样。

<Page.Resources> 
    <DataTemplate x:Name="OtherItem"> 
     <StackPanel x:Name="t1" Orientation="Horizontal" Margin="-12" Height="30"> 
      <Grid Height="30"> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition/> 
       </Grid.ColumnDefinitions> 
       <StackPanel Orientation="Horizontal" Margin="0,0,-7,0" Height="30" > 
        <Path Data="M0,0 10,0 10,30 0,30 10,15" Fill="#d0d0d0" /> 
        <Grid> 
         <Rectangle Fill="#d0d0d0" /> 
         <TextBlock Text="{Binding }" Margin="10,5" VerticalAlignment="Center" Foreground="White" MinWidth="60"/> 
        </Grid> 
        <Path Data="M0,0 10,15 0,30" Fill="#d0d0d0" /> 
       </StackPanel> 
      </Grid> 
     </StackPanel> 
    </DataTemplate> 
    <DataTemplate x:Name="FirstItem"> 
     <StackPanel x:Name="t1" Orientation="Horizontal" Margin="-12" Height="30"> 
      <Grid Height="30"> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition/> 
       </Grid.ColumnDefinitions> 
       <StackPanel Orientation="Horizontal" Margin="0,0,-7,0" Height="30" > 
        <Grid> 
         <Rectangle Fill="#d0d0d0" /> 
         <TextBlock Text="{Binding }" Margin="10,5" VerticalAlignment="Center" Foreground="White" MinWidth="60"/> 
        </Grid> 
        <Path Data="M0,0 10,15 0,30" Fill="#d0d0d0" /> 
       </StackPanel> 
      </Grid> 
     </StackPanel> 
    </DataTemplate> 
</Page.Resources>

如果您发现FirstItemDataTemplate不包含第一个道路，使它看起来像一个开始箭头。

下面是DataTemplateSelector

public class ItemsDataTemplateSelector : DataTemplateSelector 
{ 
    public DataTemplate FirstItem { get; set; } 
    public DataTemplate OtherItem { get; set; } 

    protected override DataTemplate SelectTemplateCore(object item, DependencyObject container) 
    { 
     DataTemplate _returnTemplate = new DataTemplate(); 
     var itemsControl = ItemsControl.ItemsControlFromItemContainer(container); 
     _returnTemplate = (itemsControl.IndexFromContainer(container) == 0) ? FirstItem : OtherItem; 
     return _returnTemplate; 
    } 
}

的代码在上面的代码，我要说的是，如果该指数为0然后应用FirstItemDataTemplate其他OtherItem。

现在改变你的ListView Like下面。

<ListView x:Name="listView" VerticalAlignment="Top"> 
    <ListView.ItemsPanel> 
     <ItemsPanelTemplate> 
      <StackPanel Orientation="Horizontal" /> 
     </ItemsPanelTemplate> 
    </ListView.ItemsPanel> 
    <ListView.ItemTemplateSelector> 
     <local:ItemsDataTemplateSelector FirstItem="{StaticResource FirstItem}" 
             OtherItem="{StaticResource OtherItem}" /> 
    </ListView.ItemTemplateSelector> 
</ListView>

在这里，我在选择分配的DataTemplates分配FirstItem到第一个项目列表和其他人将得到OtherItem模板。

以下是临时数据的输出。

希望这有助于

好运。

来源

2017-09-13 15:44:32 AVK

如何使xaml ListView中的第一项不同？

回答

相关问题