I'm trying to create a music player app with a playlist.
Part of this exercise is that I want to use commands for my interface. I've made a playlist page that shows a list of playlists (now empty) and a create playlist button with a command property of my viewmodel wired to it.
When the user clicks the Create button, I want to prompt him for the playlist name. To do this I've made a PlaylistPropertiesPage, but it seems I have to navigate to this page in the PlaylistsPage and not the Playlists viewmodel.
How would a Xamarin expert set this up? I don't like how the viewmodel needs to know about any pages.
PlaylistsPage.xaml:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:vm="clr-namespace:MusicPlayer.ViewModels"
mc:Ignorable="d"
x:Class="MusicPlayer.Views.PlaylistsPage"
>
<ContentPage.Content>
<StackLayout Orientation="Vertical">
<ListView x:Name="_playlistLv"
Header="Playlists"
ItemsSource="{Binding Playlists}"
>
<ListView.HeaderTemplate>
<DataTemplate>
<StackLayout Orientation="Horizontal">
<Label Text="Playlists" />
<Button Text="Create"
Command="{Binding CreatePlaylistCmd}"
CommandParameter="{Binding}"
/>
</StackLayout>
</DataTemplate>
</ListView.HeaderTemplate>
<ListView.ItemTemplate>
<DataTemplate>
<StackLayout>
<Label Text="{Binding Name}" />
</StackLayout>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage.Content>
</ContentPage>
PlaylistsPage.xaml.cs:
using Xamarin.Forms;
using Xamarin.Forms.Xaml;
using MusicPlayer.ViewModels;
namespace MusicPlayer.Views
{
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class PlaylistsPage : ContentPage
{
public PlaylistsPage()
{
InitializeComponent();
BindingContext = new PlaylistsVm
{
PlaylistsPage = this
};
}
public async void CreatePlaylist()
{
await Navigation.PushAsync(new PlaylistPropertiesPage
{
});
}
}
}
PlaylistsVm.cs:
using System.Collections.Generic;
using System.Windows.Input;
using Xamarin.Forms;
using MusicPlayer.Data;
using MusicPlayer.Models;
using MusicPlayer.Views;
namespace MusicPlayer.ViewModels
{
internal class PlaylistsVm
{
public List<Playlist> Playlists { get; set; }
public PlaylistsPage PlaylistsPage { get; set; }
private PlaylistsTl _playlistsTl;
public PlaylistsVm()
{
_playlistsTl = new PlaylistsTl();
CreatePlaylistCmd = new Command(() => PlaylistsPage.CreatePlaylist());
}
public async void Fetch()
{
Playlists = await _playlistsTl.GetItemsAsync();
}
public ICommand CreatePlaylistCmd { get; private set; }
}
}