Question

I have a ListBox which is bound to my custom class

ObservableCollection<FieldPropertyItem> _fieldOrderCollection`;

internal struct FieldPropertyItem
{
  public string Name { get; set; }
  public string AliasName { get; set; }
}

Code for ListBox:

<ListBox x:Name="FieldOrderListBox" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" HorizontalAlignment="Stretch" 
         VerticalAlignment="Stretch" HorizontalContentAlignment="Stretch" SelectedIndex="0"
         ScrollViewer.VerticalScrollBarVisibility="Auto" SelectionChanged="FieldOrderListBox_SelectionChanged">
    <ListBox.Resources>
        <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="#FF479EF3"></SolidColorBrush>
    </ListBox.Resources>

       <ListBox.ItemTemplate>
        <DataTemplate x:Name="MyTemplate">
            <Grid  Margin="-5,-1,0,0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" SharedSizeGroup="FieldName" MinWidth="5" MaxWidth="300"/>
                    <ColumnDefinition Width="2" />
                    <ColumnDefinition Width="*" MaxWidth="350"/>
                </Grid.ColumnDefinitions>                                

                <Border  BorderBrush="Black" Grid.Column="0" BorderThickness="0.5,0.0,0.5,0.5" IsHitTestVisible="False">
                    <TextBlock Text="{Binding Name}" Grid.Column="0" ToolTip="{Binding Name}" Margin="2,0,2,0" VerticalAlignment="Center"/>
                </Border>
                <GridSplitter Grid.Column="1" Width="2" HorizontalAlignment="Left" Background="Black" Margin="-2,0,-1,0"/>
                <Border BorderBrush="Black" BorderThickness="0,0.0,0.5,0.5" Margin="-2,0,0,0" Padding="0,5,0,0" Grid.Column="2">
                    <TextBlock Text="{Binding AliasName}" Grid.Column="1" ToolTip="{Binding AliasName}" Margin="2,0,2,0" VerticalAlignment="Center" HorizontalAlignment="Stretch"/>
                </Border>
            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

Now i want that my ListBox first item should look like header. The remaining ones should have a light dim background.

Answer 1

You can check if the previous item is null using a RelativeSource binding in a trigger, e.g. this DataTemplate makes the first element bold:

<DataTemplate>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition SharedSizeGroup="A" />
            <ColumnDefinition SharedSizeGroup="B" />
        </Grid.ColumnDefinitions>
        <Grid.Style>
            <Style TargetType="{x:Type Grid}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding RelativeSource={RelativeSource PreviousData}}" Value="{x:Null}">
                        <Setter Property="TextElement.FontWeight" Value="Bold" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Grid.Style>
        <TextBlock Grid.Column="0" Text="{Binding Name}" />
        <TextBlock Grid.Column="1" Text="{Binding AliasName}" />
    </Grid>
</DataTemplate>

(Use shared size groups as shown above to align the grids with one-another, set Grid.IsSharedSizeGroup to true on the ListBox element)

I would not recommend doing this by the way, if your item collection contains the header there is definitely something wrong with your data-design.