Merge pull request 'xaml/my-list' (#34) from xaml/my-list into master

Reviewed-on: ShopNCook/ShopNCook#34

AppShell.xaml

@@ -54,6 +54,11 @@
             ContentTemplate="{DataTemplate pages:FavoritesPage}"
             Route="Favorites" />
         
+        <ShellContent
+            Title="MyList Page"
+            ContentTemplate="{DataTemplate pages:MyListPage}"
+            Route="MyList" />
+                
         <ShellContent
             Title="Confirm Email"
             ContentTemplate="{DataTemplate pages:ConfirmMail}"

Pages/MyListPage.xaml

@@ -0,0 +1,66 @@
+<?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"
+             x:Class="ShoopNCook.Pages.MyListPage"
+             Title="MyList"
+             BackgroundColor="{StaticResource BackgroundPrimary}"
+             xmlns:views="clr-namespace:ShoopNCook.Views">
+    <Grid
+         RowDefinitions="Auto, *, Auto">
+        <!-- Header label and return button -->
+        <Grid
+            Grid.Row="0"
+            Padding="20, 40, 0, 30"
+            ColumnDefinitions="*"
+            MaximumHeightRequest="60">
+
+            <ImageButton 
+                Grid.Column="0" 
+                HeightRequest="50"
+                WidthRequest="50"
+                Source="arrow_back.svg"
+                HorizontalOptions="Start"/>
+
+            <Label 
+                Grid.Column="0"
+                FontSize="24"
+                TextColor="{StaticResource TextColorPrimary}"
+                Text="My Weekly List"
+                MaximumHeightRequest="60"
+                FontFamily="PoppinsBold"
+                HorizontalOptions="Center"
+                VerticalOptions="Center"/>
+        </Grid>
+
+        <!-- Favorite items -->
+        <ScrollView
+            Grid.Row="1">
+            <VerticalStackLayout
+                Padding="30, 0, 30, 0"
+                Spacing="12">
+
+                <views:StoredRecipeView Note="4.5" Title="Spaghetti Bolognese"/>
+                <views:StoredRecipeView Note="3" Title="Chickend Curry"/>
+                <views:StoredRecipeView Note="0.2" Title="Beef Stroganoff"/>
+                <views:StoredRecipeView Note="1.6" Title="Fish And Ships" />
+                <views:StoredRecipeView Note="5" Title="Caesar Salad"/>
+                <views:StoredRecipeView Note="3.5" Title="Vegetables"/>
+                <views:StoredRecipeView Note="4.6" Title="Guacamole"/>
+                <views:StoredRecipeView Note="4" Title="Pad Thai"/>
+                <views:StoredRecipeView Note="3" Title="French Toast"/>
+                <views:StoredRecipeView Note="2" Title="Margherita Pizza"/>
+            </VerticalStackLayout>
+        </ScrollView>
+
+        <!-- Footer button -->
+        <Border 
+            Margin="20, 0, 20, 5"
+            Grid.Row="2"
+            Style="{StaticResource SecondaryBorder}">
+            <Button
+                Style="{StaticResource UserButton}"
+                BackgroundColor="{StaticResource Selected}"
+                Text="Show Ingredient List"/>
+        </Border>
+    </Grid>
+</ContentPage>

Pages/MyListPage.xaml.cs

@@ -0,0 +1,9 @@
+namespace ShoopNCook.Pages;
+
+public partial class MyListPage : ContentPage
+{
+	public MyListPage()
+	{
+		InitializeComponent();
+	}
+}

Pages/RecipePage.xaml

@@ -4,6 +4,7 @@
              x:Class="ShoopNCook.Pages.RecipePage"
              Title="RecipePage"
              x:Name="RecipeViewPage"
+             xmlns:views="clr-namespace:ShoopNCook.Views"
              BackgroundColor="{StaticResource BackgroundPrimary}">
     
     <Grid
@@ -152,51 +153,10 @@
             JustifyContent="SpaceBetween"
             AlignItems="Center"
             >
-            <Grid
+            <views:CounterView
-                ColumnDefinitions="*, Auto, *">
+                x:Name="Counter"
-
+                CounterText="pers"
-                <Border
+                Count="1"/>
-                    Grid.Column="0"
-                    Stroke="Transparent"
-                    StrokeShape="RoundRectangle 100"
-                    BackgroundColor="{StaticResource Selected}">
-                    <ImageButton
-                        Source="minus.svg"
-                        WidthRequest="40"
-                        HeightRequest="40"
-                        Clicked="OnMinus"/>
-                </Border>
-
-                <HorizontalStackLayout
-                    Grid.Column="1">
-                    <Label 
-                        x:Name="NbPersLabel"
-                        Text="1"
-                        Margin="10, 0, 0, 0"
-                        TextColor="{StaticResource TextColorPrimary}"
-                        VerticalTextAlignment="Center"
-                        FontFamily="PoppinsMedium"/>
-
-                    <Label 
-                        Text=" pers"
-                        Margin="0, 0, 10, 0"
-                        TextColor="{StaticResource TextColorPrimary}"
-                        VerticalTextAlignment="Center"
-                        FontFamily="PoppinsMedium"/>
-                </HorizontalStackLayout>
-
-                <Border
-                    Grid.Column="2"
-                    Stroke="Transparent"
-                    StrokeShape="RoundRectangle 100"
-                    BackgroundColor="{StaticResource Selected}">
-                    <ImageButton 
-                        Source="plus.svg"
-                        WidthRequest="40"
-                        HeightRequest="40"
-                        Clicked="OnPlus"/>
-                </Border>
-            </Grid>
 
             <Button
                 Grid.Column="1"

Pages/RecipePage.xaml.cs

@@ -7,7 +7,6 @@ public partial class RecipePage : ContentPage
 {
 
     private uint note;
-	private uint nbPers;
     private bool isFavorite;
 
     public ICommand StarCommand => new Command<string>(count =>
@@ -39,7 +38,7 @@ public partial class RecipePage : ContentPage
         )
     {
         InitializeComponent();
-        SetNbPers(nbPers);
+        Counter.Count = nbPers;
         SetFavorite(isFavorite);
         SetNote(note);
 
@@ -97,19 +96,4 @@ public partial class RecipePage : ContentPage
         }
     }
 
-    private void OnPlus(object o, EventArgs e)
-    {
-        SetNbPers(nbPers + 1);
-    }
-
-    private void OnMinus(object o, EventArgs e)
-    {
-        SetNbPers(nbPers - 1);
-    }
-
-    private void SetNbPers(uint nbPers)
-    {
-        this.nbPers = nbPers <= 1 ? 1 : nbPers;
-        NbPersLabel.Text = this.nbPers.ToString();
-    }
 }

ShoopNCook.csproj

@@ -86,7 +86,13 @@
 	</ItemGroup>
 
 	<ItemGroup>
-	  <MauiXaml Update="Pages\ConfirmMail.xaml">
+	  <Compile Update="Pages\MyListPage.xaml.cs">
+	    <DependentUpon>MyListPage.xaml</DependentUpon>
+	  </Compile>
+	</ItemGroup>
+
+	<ItemGroup>
+	  <MauiXaml Update="Views\CounterView.xaml">
 	    <Generator>MSBuild:Compile</Generator>
 	  </MauiXaml>
 	  <MauiXaml Update="Views\HeadedButton.xaml">
@@ -122,6 +128,9 @@
 	  <MauiXaml Update="Views\SearchPage.xaml">
 	    <Generator>MSBuild:Compile</Generator>
 	  </MauiXaml>
+	  <MauiXaml Update="Views\StoredRecipeView.xaml">
+	    <Generator>MSBuild:Compile</Generator>
+	  </MauiXaml>
 	</ItemGroup>
 
 	<ProjectExtensions><VisualStudio><UserProperties XamarinHotReloadDebuggerTimeoutExceptionShoopNCookHideInfoBar="True" XamarinHotReloadUnhandledDeviceExceptionShoopNCookHideInfoBar="True" /></VisualStudio></ProjectExtensions>

Views/CounterView.xaml

@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+             x:Class="ShoopNCook.Views.CounterView"
+             x:Name="Counter">
+    <Grid
+        ColumnDefinitions="*, Auto, *">
+
+        <Border
+            Grid.Column="0"
+            Stroke="Transparent"
+            StrokeShape="RoundRectangle 100"
+            BackgroundColor="{StaticResource Selected}">
+            <ImageButton
+                Source="minus.svg"
+                WidthRequest="40"
+                HeightRequest="40"
+                Clicked="OnMinus"/>
+        </Border>
+
+        <HorizontalStackLayout
+            Grid.Column="1"
+            Spacing="3"
+            Margin="10, 0, 10, 0">
+            <Label 
+                x:Name="CountLabel"
+                Text="{Binding Count, Source={x:Reference Counter}}"
+                TextColor="{StaticResource TextColorPrimary}"
+                VerticalTextAlignment="Center"
+                FontFamily="PoppinsMedium"/>
+
+            <Label 
+                x:Name="CounterLabel"
+                Text="{Binding CounterText, Source={x:Reference Counter}}"
+                TextColor="{StaticResource TextColorPrimary}"
+                VerticalTextAlignment="Center"
+                FontFamily="PoppinsMedium"/>
+        </HorizontalStackLayout>
+
+        <Border
+            Grid.Column="2"
+            Stroke="Transparent"
+            StrokeShape="RoundRectangle 100"
+            BackgroundColor="{StaticResource Selected}">
+            <ImageButton 
+                Source="plus.svg"
+                WidthRequest="40"
+                HeightRequest="40"
+                Clicked="OnPlus"/>
+        </Border>
+    </Grid>
+</ContentView>

Views/CounterView.xaml.cs

@@ -0,0 +1,51 @@
+namespace ShoopNCook.Views;
+
+public partial class CounterView : ContentView
+{
+
+    private readonly BindableProperty CountProperty =
+        BindableProperty.Create(nameof(CountLabel), typeof(uint), typeof(CounterView), default(uint) + 1);
+
+    private readonly BindableProperty CounterLabelProperty =
+        BindableProperty.Create(nameof(CounterLabel), typeof(string), typeof(CounterView), default(string));
+
+    public CounterView()
+	{
+        InitializeComponent();
+        CountLabel.BindingContext = this;
+        CountLabel.SetBinding(Label.TextProperty, nameof(Count));
+
+        CounterLabel.BindingContext = this;
+        CounterLabel.SetBinding(Label.TextProperty, nameof(CounterText));
+    }
+
+    public uint Count
+    {
+        get => (uint)GetValue(CountProperty);
+        set
+        {
+            SetValue(CountProperty, value <= 1 ? 1 : uint.Parse(value.ToString()));
+            OnPropertyChanged(nameof(Count));
+        }
+    }
+
+    public string CounterText
+    {
+        get => (string)GetValue(CounterLabelProperty);
+        set
+        {
+            SetValue(CounterLabelProperty, value);
+            OnPropertyChanged(nameof(CounterText));
+        }
+    }
+
+    private void OnPlus(object o, EventArgs e)
+    {
+        Count += 1;
+    }
+
+    private void OnMinus(object o, EventArgs e)
+    {
+        Count -= 1;
+    }
+}

Views/HeadedButton.xaml.cs

@@ -4,13 +4,13 @@ public partial class HeadedButton : ContentView
 {
 
     private readonly BindableProperty TextProperty =
-        BindableProperty.Create("Text", typeof(string), typeof(HeadedButton), "No Text Defined.");
+        BindableProperty.Create(nameof(BtnLabel), typeof(string), typeof(HeadedButton), "No Text Defined.");
 
     private readonly BindableProperty HeadColorProperty =
-        BindableProperty.Create("HeadColor", typeof(string), typeof(HeadedButton), "#FFFFFF");
+        BindableProperty.Create(nameof(PrefixBorder), typeof(string), typeof(HeadedButton), "#FFFFFF");
 
     private readonly BindableProperty HeadSourceProperty =
-        BindableProperty.Create("HeadSource", typeof(string), typeof(HeadedButton), default(string));
+        BindableProperty.Create(nameof(PrefixImage), typeof(string), typeof(HeadedButton), default(string));
 
     public string Text
     {

Views/StoredRecipeView.xaml

@@ -0,0 +1,59 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+             x:Class="ShoopNCook.Views.StoredRecipeView"
+             xmlns:views="clr-namespace:ShoopNCook.Views">
+
+    <Border
+        Style="{StaticResource SecondaryBorderShadow}"
+        StrokeShape="RoundRectangle 30">
+
+        <Grid
+            BackgroundColor="{StaticResource BackgroundSecondary}"
+            Padding="10"
+            MinimumHeightRequest="250"
+            MinimumWidthRequest="150"
+            RowDefinitions="*, Auto">
+            <Border
+                Grid.Row="0"
+                Stroke="Transparent"
+                StrokeShape="RoundRectangle 20"
+                BackgroundColor="AliceBlue">
+                <Grid>
+                    <Image />
+                    <HorizontalStackLayout
+                        x:Name="Stars"
+                        VerticalOptions="End"
+                        HorizontalOptions="End"
+                        Margin="0, 0, 15, 2">
+                        <Image
+                            WidthRequest="15"
+                            Source="star_full.svg"/>
+                        <Image
+                            WidthRequest="15"
+                            Source="star_full.svg"/>
+                        <Image
+                            WidthRequest="15"
+                            Source="star_full.svg"/>
+                        <Image
+                            WidthRequest="15"
+                            Source="star_full.svg"/>
+                        <Image
+                            WidthRequest="15"
+                            Source="star_full.svg"/>
+                    </HorizontalStackLayout>
+                </Grid>
+            </Border>
+
+            <VerticalStackLayout
+                HorizontalOptions="Start"
+                Grid.Row="1">
+                <Label
+                    TextColor="{StaticResource TextColorPrimary}"
+                    x:Name="TitleLabel"/>
+                <Grid></Grid>
+                <views:CounterView CounterText="pers"/>
+            </VerticalStackLayout>
+        </Grid>
+    </Border>
+</ContentView>

Views/StoredRecipeView.xaml.cs

@@ -0,0 +1,41 @@
+namespace ShoopNCook.Views;
+
+public partial class StoredRecipeView : ContentView
+{
+
+    public StoredRecipeView() : this(5, "Title")
+    { }
+
+    public StoredRecipeView(float note, string title)
+    {
+        InitializeComponent();
+        Note = note;
+        Title = title;
+    }
+
+    public float Note
+    {
+        set => SetNote(value);
+    }
+
+    public string Title
+    {
+        set => TitleLabel.Text = value;
+    }
+
+
+
+    private void SetNote(float note)
+    {
+        int i = 1;
+        foreach (Image img in Stars.Children)
+        {
+            if (i <= note)
+            {
+                img.Opacity = 0;
+                i++;
+            }
+            else img.Opacity = 1;
+        }
+    }
+}