owned recipe et recipe view databinding

Views/Components/OwnedRecipeView.xaml

@@ -28,7 +28,7 @@
                 StrokeShape="RoundRectangle 20"
                 BackgroundColor="{StaticResource ImageBackground}">
                 <Grid>
-                    <Image x:Name="RecipeImage" 
+                    <Image Source="{Binding Image}"
                            MinimumHeightRequest="175"
                            MinimumWidthRequest="150"
                            MaximumHeightRequest="175"
@@ -61,7 +61,7 @@
             <VerticalStackLayout Grid.Row="1">
                 <Label
                     TextColor="{StaticResource TextColorPrimary}"
-                    x:Name="TitleLabel"/>
+                    Text="{Binding Name}"/>
                 <Border
                     BackgroundColor="{StaticResource Selected}"
                     Stroke="Transparent"

Views/Components/OwnedRecipeView.xaml.cs

@@ -13,12 +13,9 @@ public partial class OwnedRecipeView : ContentView
     {
         InitializeComponent();
 
-        if (info.Image != null)
-            RecipeImage.Source = ImageSource.FromUri(info.Image);
         Note = info.AverageNote;
-        Title = info.Name;
 
-        this.recipeInfo = info;
+        BindingContext = info;
         this.clickCallback = onClickCallback;
         this.removeCallback = onRemoveCallback;
     }
@@ -32,10 +29,6 @@ public partial class OwnedRecipeView : ContentView
         set => SetNote(value);
     }
 
-    public string Title
-    {
-        set => TitleLabel.Text = value;
-    }
    
     private void SetNote(float note)
     {

Views/Components/RecipeView.xaml

@@ -4,7 +4,6 @@
              x:Class="ShoopNCook.Views.RecipeView"
              Margin="4,2">
 
-
     <Border
         Style="{StaticResource SecondaryBorderShadow}"
         StrokeShape="RoundRectangle 30">
@@ -21,21 +20,23 @@
             <Grid.GestureRecognizers>
                 <TapGestureRecognizer Tapped="OnRecipeTapped"/>
             </Grid.GestureRecognizers>
+
             <Border
                 Grid.Row="0"
                 Stroke="Transparent"
                 StrokeShape="RoundRectangle 20"
                 BackgroundColor="{StaticResource ImageBackground}">
                 <Grid>
-                    <Image x:Name="RecipeImage"
+                    <Image 
+                        Source="{Binding Image}"
                         Aspect="AspectFill"
                         MinimumHeightRequest="155"
                         MinimumWidthRequest="130"
                         MaximumHeightRequest="155"
                         MaximumWidthRequest="130"/>
                     <HorizontalStackLayout
-                        x:Name="Stars"
                         VerticalOptions="End"
+                        x:Name="Stars"
                         HorizontalOptions="End"
                         Margin="0, 0, 15, 2">
                         <Image
@@ -60,10 +61,10 @@
             <VerticalStackLayout Grid.Row="1">
                 <Label
                     TextColor="{StaticResource TextColorPrimary}"
-                    x:Name="TitleLabel"/>
+                    Text="{Binding Name}"/>
                 <Label
                     TextColor="{StaticResource TextColorSecondary}"
-                    x:Name="SubtitleLabel"/>
+                    Text="{Binding CookTimeMins, StringFormat='{0} mins'}"/>
             </VerticalStackLayout>
         </Grid>
     </Border>

Views/Components/RecipeView.xaml.cs

@@ -1,4 +1,4 @@
-using ShoopNCook.Pages;
+/*using ShoopNCook.Pages;
 using Models;
 namespace ShoopNCook.Views;
 
@@ -56,4 +56,52 @@ public partial class RecipeView : ContentView
     {
         callback();
     }
+}*/
+
+
+
+using ShoopNCook.Pages;
+using Models;
+namespace ShoopNCook.Views
+{
+    public partial class RecipeView : ContentView
+    {
+
+        private readonly Action callback;
+
+
+        public RecipeView(RecipeInfo info, Action callback)
+        {
+            this.callback = callback;
+            BindingContext = info;
+            InitializeComponent();
+            Note = info.AverageNote;
+        }
+
+        public float Note
+        {
+            set => SetNote(value);
+        }
+
+
+        private void SetNote(float note)
+        {
+            note = (uint)note; //truncate integer as we currently do not handle semi stars
+            foreach (Image img in Stars.Children.Reverse())
+            {
+                if (note > 0)
+                {
+                    img.Opacity = 1;
+                    note--;
+                }
+                else img.Opacity = 0;
+            }
+        }
+
+        private void OnRecipeTapped(object sender, EventArgs e)
+        {
+            callback();
+        }
+    }
 }
+

Views/Components/StoredRecipeView.xaml

@@ -26,7 +26,7 @@
                 MaximumHeightRequest="300"
                 BackgroundColor="{StaticResource ImageBackground}">
                 <Grid>
-                    <Image x:Name="RecipeImage"
+                    <Image Source="{Binding Image}"
                            Aspect="AspectFill"/>
                     <HorizontalStackLayout
                         x:Name="Stars"
@@ -57,7 +57,7 @@
                 Grid.Row="1">
                 <Label
                     TextColor="{StaticResource TextColorPrimary}"
-                    x:Name="TitleLabel"/>
+                    Text="{Binding Name}"/>
                 <views:CounterView 
                     CounterText="pers"
                     x:Name="Counter"/>

Views/Components/StoredRecipeView.xaml.cs

@@ -12,11 +12,8 @@ public partial class StoredRecipeView : ContentView
     {
         InitializeComponent();
 
-        if (info.Image != null)
-            RecipeImage.Source = ImageSource.FromUri(info.Image);
-
         Note = info.AverageNote;
-        Title = info.Name;
+        BindingContext = info;
         clickCallback = onClickCallback;
         Counter.Count = personCount;
     }
@@ -26,10 +23,6 @@ public partial class StoredRecipeView : ContentView
         set => SetNote(value);
     }
 
-    public string Title
-    {
-        set => TitleLabel.Text = value;
-    }
     
     private void SetNote(float note)
     {