Add a page for displaying Todo details

Tasks/Lab12/TodoDetails/AppShell.xaml.cs

@@ -1,10 +1,13 @@
-namespace TodoDetails
+using TodoDetails.View;
+
+namespace TodoDetails
 {
     public partial class AppShell : Shell
     {
         public AppShell()
         {
             InitializeComponent();
+            Routing.RegisterRoute(nameof(TodoDetailsPage), typeof(TodoDetailsPage));
         }
     }
 }

Tasks/Lab12/TodoDetails/MainPage.xaml

@@ -23,6 +23,10 @@
                 <DataTemplate x:DataType="model:Todo">
                     <Grid Padding="10">
                         <Border HeightRequest="125">
+                            <Border.GestureRecognizers>
+                                <TapGestureRecognizer Command="{Binding Source={RelativeSource AncestorType={x:Type viewmodel:TodosViewModel}}, Path=GoToDetailsCommand}"
+                                                      CommandParameter="{Binding .}"/>
+                            </Border.GestureRecognizers>
                             <Grid Padding="0">
                                 <Grid.ColumnDefinitions>
                                     <ColumnDefinition/>

Tasks/Lab12/TodoDetails/MauiProgram.cs

@@ -1,5 +1,6 @@
 using Microsoft.Extensions.Logging;
 using TodoDetails.Services;
+using TodoDetails.View;
 using TodoDetails.ViewModel;
 
 namespace TodoDetails
@@ -23,6 +24,8 @@ namespace TodoDetails
             builder.Services.AddSingleton<TodoService>();
             builder.Services.AddSingleton<TodosViewModel>();
             builder.Services.AddSingleton<MainPage>();
+            builder.Services.AddTransient<TodoDetailsViewModel>();
+            builder.Services.AddTransient<TodoDetailsPage>();
 
             return builder.Build();
         }

Tasks/Lab12/TodoDetails/TodoDetails.csproj

@@ -67,4 +67,10 @@
 		<PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="8.0.0" />
 	</ItemGroup>
 
+	<ItemGroup>
+	  <MauiXaml Update="View\TodoDetailsPage.xaml">
+	    <Generator>MSBuild:Compile</Generator>
+	  </MauiXaml>
+	</ItemGroup>
+
 </Project>

Tasks/Lab12/TodoDetails/View/TodoDetailsPage.xaml

@@ -0,0 +1,50 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+             xmlns:viewmodel="clr-namespace:TodoDetails.ViewModel"
+             x:Class="TodoDetails.View.TodoDetailsPage"
+             x:DataType="viewmodel:TodoDetailsViewModel"
+             Title="{Binding Todo.Title}">
+    <ScrollView>
+        <Grid Padding="10">
+            <Grid.RowDefinitions>
+                <RowDefinition Height="Auto"/>
+                <RowDefinition Height="Auto"/>
+                <RowDefinition Height="Auto"/>
+                <RowDefinition/>
+            </Grid.RowDefinitions>
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition/>
+                <ColumnDefinition/>
+            </Grid.ColumnDefinitions>
+            <Entry Text="{Binding Todo.Title}"
+                   FontSize="20"
+                   Grid.ColumnSpan="2"/>
+            <Picker Grid.Row="1"
+                    Grid.ColumnSpan="2"
+                    SelectedIndex="0">
+                <Picker.ItemsSource>
+                    <x:Array Type="{x:Type x:String}">
+                        <x:String>Default</x:String>
+                        <x:String>XAML</x:String>
+                        <x:String>MVVM</x:String>
+                        <x:String>Database</x:String>
+                    </x:Array>
+                </Picker.ItemsSource>
+            </Picker>
+            <HorizontalStackLayout Grid.Row="2"
+                                   VerticalOptions="Center"
+                                   Spacing="20">
+                <Label Text="Is Done"
+                       VerticalTextAlignment="Center"/>
+                <CheckBox IsChecked="{Binding Todo.IsDone}"/>
+            </HorizontalStackLayout>
+            <DatePicker Date="{Binding Todo.DueDate}"
+                        Grid.Row="2"
+                        Grid.Column="1"/>
+            <Editor Text="{Binding Todo.Description}"
+                    Grid.Row="3"
+                    Grid.ColumnSpan="2"/>
+        </Grid>
+    </ScrollView>
+</ContentPage>

Tasks/Lab12/TodoDetails/View/TodoDetailsPage.xaml.cs

@@ -0,0 +1,12 @@
+using TodoDetails.ViewModel;
+
+namespace TodoDetails.View;
+
+public partial class TodoDetailsPage : ContentPage
+{
+	public TodoDetailsPage(TodoDetailsViewModel viewModel)
+	{
+		InitializeComponent();
+		BindingContext = viewModel;
+	}
+}

Tasks/Lab12/TodoDetails/ViewModel/TodoDetailsViewModel.cs

@@ -0,0 +1,20 @@
+using CommunityToolkit.Mvvm.ComponentModel;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using TodoDetails.Model;
+
+namespace TodoDetails.ViewModel
+{
+    [QueryProperty(nameof(Model.Todo), nameof(Todo))]
+    public partial class TodoDetailsViewModel : BaseViewModel
+    {
+        [ObservableProperty]
+        Todo todo;
+
+        public TodoDetailsViewModel()
+        { }
+    }
+}

Tasks/Lab12/TodoDetails/ViewModel/TodosViewModel.cs

@@ -8,6 +8,7 @@ using System.Text;
 using System.Threading.Tasks;
 using TodoDetails.Model;
 using TodoDetails.Services;
+using TodoDetails.View;
 
 namespace TodoDetails.ViewModel
 {
@@ -63,6 +64,14 @@ namespace TodoDetails.ViewModel
             {
                 return;
             }
+
+            await Shell.Current.GoToAsync(
+                nameof(TodoDetailsPage),
+                true,
+                new Dictionary<string, object>()
+                {
+                    { nameof(Todo), todo }
+                });
         }
     }
 }