added play list into right column with GridSplitter

HarmonyWinUI/HarmonyWinUI.csproj

@@ -44,6 +44,8 @@
   </ItemGroup>
 
   <ItemGroup>
+    <PackageReference Include="CommunityToolkit.WinUI.Controls.Sizers" Version="8.2.251219" />
+
     <PackageReference Include="Microsoft.Windows.SDK.BuildTools" Version="10.0.28000.2526" />
 
     <PackageReference Include="Microsoft.WindowsAppSDK" Version="2.3.1" />
@@ -79,4 +81,4 @@
     </Page>
   </ItemGroup>
 
-</Project>
+</Project>

HarmonyWinUI/HarmonyWinUI.csproj.user

@@ -5,6 +5,7 @@
   </PropertyGroup>
   <PropertyGroup>
     <ActiveDebugProfile>HarmonyWinUI (Unpackaged)</ActiveDebugProfile>
+    <_LastSelectedProfileId>D:\work\Harmony\HarmonyWinUI\Properties\PublishProfiles\FolderProfile.pubxml</_LastSelectedProfileId>
   </PropertyGroup>
   <ItemGroup>
     <None Update="App.xaml">

HarmonyWinUI/MainWindow.xaml

@@ -4,6 +4,7 @@
 	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 	xmlns:local="using:HarmonyWinUI"
+	xmlns:controls="using:CommunityToolkit.WinUI.Controls"
 	xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
 	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
 	mc:Ignorable="d"
@@ -14,7 +15,19 @@
 	</Window.SystemBackdrop>
 
 	<Grid>
+
+		<Grid.ColumnDefinitions>
+			<!-- NavigationView: navigácia + stredný Frame -->
+			<ColumnDefinition Width="*" MinWidth="300" />
+			<ColumnDefinition Width="8" />
+
+			<!-- Pravý panel -->
+			<ColumnDefinition Width="320" MinWidth="180" MaxWidth="600" />
+		</Grid.ColumnDefinitions>
+		
 		<NavigationView
+			Grid.Column="0"
+			PaneDisplayMode="Left"
 			x:Name="MainNavigation"
 			SelectionChanged="MainNavigation_SelectionChanged">
 			<NavigationView.MenuItems>
@@ -29,7 +42,7 @@
 
 			</NavigationView.MenuItems>
 			<NavigationView.FooterMenuItems>
-				<NavigationViewItem Content="Donate" Tag="PageDonate" >					
+				<NavigationViewItem Content="Donate" Tag="PageDonate" >
 					<NavigationViewItem.Icon>
 						<FontIcon Glyph="&#xEB51;" />
 					</NavigationViewItem.Icon>
@@ -38,6 +51,58 @@
 			</NavigationView.FooterMenuItems>
 
 			<Frame x:Name="MainNavigationContentFrame" />
+
 		</NavigationView>
+
+		<controls:GridSplitter
+			Grid.Column="1"
+			HorizontalAlignment="Stretch"
+			ResizeDirection="Columns"
+			ResizeBehavior="PreviousAndNext" />
+
+		<ListView
+			Grid.Column="2"
+			SelectionMode="Single"
+			ItemsSource="{x:Bind Items}">
+			<ListView.ItemTemplate>
+				<DataTemplate x:DataType="local:PlayListItem">
+					<Grid>
+						<Grid.RowDefinitions>
+							<RowDefinition Height="*"/>
+							<RowDefinition Height="*"/>
+						</Grid.RowDefinitions>
+						<Grid.ColumnDefinitions>
+							<ColumnDefinition Width="Auto"/>
+							<ColumnDefinition Width="*"/>
+						</Grid.ColumnDefinitions>
+						<Ellipse x:Name="Ellipse"
+							Grid.RowSpan="2"
+							Width ="32"
+							Height="32"
+							Margin="6"
+							VerticalAlignment="Center"
+							HorizontalAlignment="Center"
+							Fill="{ThemeResource SystemControlBackgroundBaseMediumBrush}"/>
+						<TextBlock Grid.Column="1"
+							Text="{x:Bind TrackName}"
+							x:Phase="1"
+							Style="{ThemeResource BaseTextBlockStyle}"
+							Margin="12,6,0,0"/>
+						<TextBlock  Grid.Column="1"
+							Grid.Row="1"
+							Text="{x:Bind ArtistName}"
+							x:Phase="2"
+							Style="{ThemeResource BodyTextBlockStyle}"
+							Margin="12,0,0,6"/>
+					</Grid>
+				</DataTemplate>
+			</ListView.ItemTemplate>
+		</ListView>
+
+
+
 	</Grid>
+
+
+
 </Window>

HarmonyWinUI/MainWindow.xaml.cs

@@ -2,7 +2,8 @@ using HarmonyWinUI.Pages;
 using Microsoft.UI.Xaml;
 using Microsoft.UI.Xaml.Controls;
 using System;
-using Windows.System; // added
+using System.Collections.ObjectModel;
+using Windows.System;
 
 // To learn more about WinUI, the WinUI project structure,
 // and more about our project templates, see: http://aka.ms/winui-project-info.
@@ -14,12 +15,17 @@ namespace HarmonyWinUI
 	/// </summary>
 	public sealed partial class MainWindow : Window
 	{
+		public ObservableCollection<PlayListItem> Items { get; } = new();
+
 		public MainWindow()
 		{
 			InitializeComponent();
 
 			// default
 			MainNavigationContentFrame.Navigate(typeof(Dashboard));
+			this.Items.Add(new PlayListItem("Dodo", "Stromae"));
+			this.Items.Add(new PlayListItem("La Danza", "John Summit"));
+			this.Items.Add(new PlayListItem("Trapny vietor", "Horkyze Slize"));
 		}
 
 		private async void MainNavigation_SelectionChanged(NavigationView sender, NavigationViewSelectionChangedEventArgs args)
@@ -65,4 +71,18 @@ namespace HarmonyWinUI
 		}
 	}
 
+	public class PlayListItem
+	{
+		public string? TrackName { get; set; }
+		public string? ArtistName { get; set; }
+
+		public PlayListItem() { }
+
+		public PlayListItem(string? trackName, string? artistName)
+		{
+			TrackName = trackName;
+			ArtistName = artistName;
+		}
+	}
+
 }