Show selected ListView item in Content presenter - xaml

Question

I am trying to display an selected listview item in a ContentPresenter.
The ListView is populated from the PlayersViewModel. The items presenting a PlayerViewModel.
Now I want to display the selected PlayerViewModel outside the ListView in an ContentPresenter. In the design view only the Content binded type is shown. Like: PlayersViewModel.CurrentPlayer.
How can I make the ContentPresenter work the same way as the ListView.ItemTemplate?
Thanks in advance.
<ListView ItemsSource="{x:Bind PlayersViewModel.Players}" SelectedIndex="{x:Bind PlayersViewModel.Index}" Grid.Row="0" Grid.Column="0" Grid.RowSpan="2">
<ListView.ItemTemplate>
<DataTemplate x:DataType="viewModels:PlayerViewModel">
<Viewbox>
<StackPanel BorderBrush="Black" BorderThickness="1">
<TextBlock Text="{x:Bind Name}" />
<TextBlock Text="{x:Bind Score, Mode=TwoWay}" />
</StackPanel>
</Viewbox>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<ContentPresenter Grid.Row="0" Grid.Column="1" Content="{x:Bind PlayersViewModel.CurrentPlayer}">
<ContentPresenter.Resources>
<DataTemplate x:Key="dataTemplateCurrentPlayer" x:DataType="viewModels:PlayerViewModel">
<StackPanel BorderBrush="Black" BorderThickness="1">
<TextBlock Text="{x:Bind Name}" />
<TextBlock Text="{x:Bind Score, Mode=TwoWay}" />
</StackPanel>
</DataTemplate>
</ContentPresenter.Resources>
</ContentPresenter>

Answer 1

<UserControl x:Class="App1.MyUserControl1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App1"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="400">
<UserControl.Resources>
<DataTemplate x:DataType="viewModels:PlayerViewModel"
x:Key="PlayerTemplate">
<Viewbox>
<StackPanel BorderBrush="Black"
BorderThickness="1">
<TextBlock Text="{x:Bind Name}" />
<TextBlock Text="{x:Bind Score, Mode=TwoWay}" />
</StackPanel>
</Viewbox>
</DataTemplate>
</UserControl.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.5*" />
<ColumnDefinition Width="0.5*" />
</Grid.ColumnDefinitions>
<ListView ItemsSource="{x:Bind PlayersViewModel.Players}"
SelectedIndex="{x:Bind PlayersViewModel.Index}"
ItemTemplate="{StaticResource PlayerTemplate}" />
<ContentControl Grid.Column="1"
Content="{x:Bind PlayersViewModel.CurrentPlayer}"
ContentTemplate="{StaticResource PlayerTemplate}" />
</Grid>
</UserControl>

Answer 2

You can use ListView Footer Template to show detailed information of selected item
<ListView ItemsSource="{x:Bind PlayersViewModel.Players}" SelectedIndex="{x:Bind PlayersViewModel.Index}" Grid.Row="0" Grid.Column="0" Grid.RowSpan="2">
<ListView.ItemTemplate>
<DataTemplate x:DataType="viewModels:PlayerViewModel">
<Viewbox>
<StackPanel BorderBrush="Black" BorderThickness="1">
<TextBlock Text="{x:Bind Name}" />
<TextBlock Text="{x:Bind Score, Mode=TwoWay}" />
</StackPanel>
</Viewbox>
</DataTemplate>
</ListView.ItemTemplate>
<ListView.FooterTemplate>
<DataTemplatex:DataType="viewModels:PlayerViewModel">
<StackPanel BorderBrush="Black" BorderThickness="1">
<TextBlock Text="{x:Bind PlayersViewModel.CurrentPlayer.Name}" />
<TextBlock Text="{x:Bind PlayersViewModel.CurrentPlayer.Score, Mode=TwoWay}" />
</StackPanel>
</DataTemplate>
</ListView.FooterTemplate>
</ListView>
Or other way is you can use just Stackpanel
<StackPanel BorderBrush="Black" BorderThickness="1">
<TextBlock Text="{x:Bind PlayersViewModel.CurrentPlayer.Name}" />
<TextBlock Text="{x:Bind PlayersViewModel.CurrentPlayer.Score, Mode=TwoWay}" />
</StackPanel>
Hope this works..