Datatemplates while using theme does not work - WPF

Question

I am using the theme DarkExpression from WPF Futures. It does not seem to work well with datatemplates.

Scenario 1:

Here is how it looks like without datatemplates: Pic 1

Code:

<ListView Name="playlistListView"  ItemsSource="{Binding PlaylistList}" Margin="0" SelectionChanged="DatabindedPlaylistListView_SelectionChanged" Background="{x:Null}" Opacity="0.98">
        <ListView.View>
            <GridView>
                <GridViewColumn Width="Auto" DisplayMemberBinding="{Binding Name}">
                    <GridViewColumnHeader HorizontalContentAlignment="Left" Content="Playlist" Tag="Playlist"/>
                </GridViewColumn>
            </GridView>
        </ListView.View>
</ListView>

Scenario 2: Here is how it looks like trying to use datatemplates while using the theme: Pic 2

Code:

        <ListView Name="playlistListView"  ItemsSource="{Binding PlaylistList}" Margin="0" SelectionChanged="DatabindedPlaylistListView_SelectionChanged" Background="{x:Null}" Opacity="0.98">
        <ListView.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <UserControls:SongDataTemplate Margin="4" />
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
</ListView>

Scenario 3:

Here is how it looks like trying to use datatemplates while overriding the theme: Pic3

Code:

<UserControl.Resources>
    <Style x:Key="ListViewItemStretch" TargetType="{x:Type ListViewItem}">
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="Background" Value="Transparent" />
    </Style>
</UserControl.Resources>

<Grid x:Name="LayoutRoot">
    <ListView Name="playlistListView" ItemContainerStyle="{StaticResource ListViewItemStretch}" ItemsSource="{Binding PlaylistList}" Margin="0" SelectionChanged="DatabindedPlaylistListView_SelectionChanged" Background="{x:Null}" Opacity="0.98">
        <ListView.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <UserControls:SongDataTemplate Margin="4" />
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
</ListView>

I want to keep the theme style but I also want to use datatemplates to define how a playlist should look like. Any suggestions?

Note: In scenario 2 and 3 I had to remove

<ListView.View>
        <GridView>
            <GridViewColumn Width="Auto" DisplayMemberBinding="{Binding Name}">
                <GridViewColumnHeader HorizontalContentAlignment="Left" Content="Playlist" Tag="Playlist"/>
            </GridViewColumn>
        </GridView>
</ListView.View>

Before the datatemplate would be used.

Edit:

The solution given below, works if the type is changed to ListBox and I am using a TextBox instead. I can't however make it work with a ListView.

Answer 1

does it work if you substitute

<Grid>
   <UserControls:SongDataTemplate Margin="4" />
</Grid>

with a TextBox, for example?

The problem could be generated by your user control..

Answer 2

Try by using BasedOn

<Style BasedOn={StaticResource {x:Type ListViewItem}} x:Key="ListViewItemStretch" TargetType="{x:Type ListViewItem}"> 
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/> 
    <Setter Property="Background" Value="Transparent" /> 
</Style>

Answer 3

You are doing it wrong. When you want to customize ListView you need to work with the View property which is of type ViewBase. Derive a custom View from ViewBase, assign it to ListView.View and you're done. There's an example in ViewBase Class Documentation