Merge pull request 'Vue des publications de l'utilisateur' (#20) from view-my-posts into dev-views

Reviewed-on: #20

MCTG/Views/App.xaml.cs

@@ -28,8 +28,10 @@ namespace Views
 #endif
             });
 
-            MainPage = new AppShell();
+
-            Application.Current.UserAppTheme = AppTheme.Light;
+            /* - Comment(ctrl-k + ctrl-c)/Uncomment(ctrl-k + ctrl-u) to change page  - */
+            MainPage = new Home();
+            //MainPage = new MyPosts();
         }
     }
 }

MCTG/Views/ContainerBase.xaml

@@ -16,7 +16,9 @@
         <local:ContainerFlyout
             Grid.RowSpan="2"
             MinimumWidthRequest="300"
-            HorizontalOptions="StartAndExpand">
+            HorizontalOptions="StartAndExpand"
+            IsNotConnected="{Binding IsNotConnected, Source={x:Reference root}}"
+            NeedReturn="{Binding NeedReturn, Source={x:Reference root}}">
             <local:ContainerFlyout.MyFlyoutContent>
                 <ContentView
                     Content="{Binding MyFlyoutContent, Source={x:Reference root}}"/>

MCTG/Views/ContainerBase.xaml.cs

@@ -7,7 +7,8 @@ public partial class ContainerBase : ContentView
 		InitializeComponent();
 	}
 
-	public static readonly BindableProperty MyContentProperty =
+    // Bind MyContent
+    public static readonly BindableProperty MyContentProperty =
 		BindableProperty.Create("MyContent", typeof(View), typeof(ContainerBase), new Grid());
 
 	public View MyContent
@@ -16,6 +17,7 @@ public partial class ContainerBase : ContentView
 		set => SetValue(MyContentProperty, value);
 	}
 
+    // Bind MyFlyoutContent
     public static readonly BindableProperty MyFlyoutContentProperty =
         BindableProperty.Create("MyFlyoutContent", typeof(View), typeof(ContainerBase), new Grid());
 
@@ -24,4 +26,24 @@ public partial class ContainerBase : ContentView
         get => (View)GetValue(MyFlyoutContentProperty);
         set => SetValue(MyFlyoutContentProperty, value);
     }
+
+    // Bind IsNotConnected
+    public static readonly BindableProperty IsNotConnectedProperty =
+        BindableProperty.Create("IsNotConnected", typeof(bool), typeof(Button), true);
+
+    public bool IsNotConnected
+    {
+        get => (bool)GetValue(IsNotConnectedProperty);
+        set => SetValue(IsNotConnectedProperty, value);
+    }
+
+    // bind NeedReturn
+    public static readonly BindableProperty NeedReturnProperty =
+        BindableProperty.Create("NeedReturn", typeof(bool), typeof(Border), false);
+
+    public bool NeedReturn
+    {
+        get => (bool)GetValue(NeedReturnProperty);
+        set => SetValue(NeedReturnProperty, value);
+    }
 }

MCTG/Views/ContainerFlyout.xaml

@@ -2,21 +2,38 @@
 <ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
              xmlns:local="clr-namespace:Views"
+             xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
              x:Class="Views.ContainerFlyout"
              x:Name="fl"
-             BackgroundColor="{StaticResource Secondary}">
+             BackgroundColor="{AppThemeBinding Light={StaticResource Secondary}, Dark={StaticResource Gray600}}">
 
     <Grid RowDefinitions="250, *, 100">
         <VerticalStackLayout Grid.Row="0">
-            <!-- Header -->
+
-            <ImageButton Source="person_default.png"
+            <Grid RowDefinitions="auto, *">
+                <!-- Return -->
+                <local:ReturnButton NeedReturn="{Binding NeedReturn, Source={x:Reference fl}}" Grid.Row="0"
+                                HorizontalOptions="Start" Padding="10, 10, 0, 0"/>
+                <!-- Header -->
+                <ImageButton Source="person_default.png" HorizontalOptions="Center"
                          BackgroundColor="{StaticResource Secondary}"
                          WidthRequest="100" HeightRequest="100"
                          CornerRadius="50" Margin="0, 30, 0, 10"
                          BorderWidth="5" BorderColor="Black"
-                         IsEnabled="False"/>
+                         IsEnabled="{Binding IsNotConnected, Source={x:Reference fl}}"
+                         Grid.RowSpan="2"/>
+            </Grid>
+            
             <Button Text="Connection" ImageSource="login_icon.png"
-                    Style="{StaticResource button2}"/>
+                    Style="{StaticResource button2}"
+                    IsVisible="{Binding IsNotConnected, Source={x:Reference fl}}"
+                    IsEnabled="{Binding IsNotConnected, Source={x:Reference fl}}"/>
+            <Label Text="Jean-Baptiste De La Fontaine"
+                   HorizontalOptions="Center" Margin="15"
+                   FontSize="20" FontAttributes="Bold" HorizontalTextAlignment="Center"
+                   TextColor="{AppThemeBinding Light={StaticResource Black}, Dark={StaticResource White}}"
+                   IsVisible="{Binding IsNotConnected, Converter={toolkit:InvertedBoolConverter} ,Source={x:Reference fl}}"/>
+
         </VerticalStackLayout>
 
         <!-- Content -->
@@ -30,7 +47,7 @@
             <!-- Footer -->
             <Button Text="Déconnection" ImageSource="logout_icon.png"
                     Style="{StaticResource button2}"
-                    IsVisible="False"/>
+                    IsVisible="{Binding IsNotConnected, Converter={toolkit:InvertedBoolConverter}, Source={x:Reference fl}}"/>
         </VerticalStackLayout>
     </Grid>
 

MCTG/Views/ContainerFlyout.xaml.cs

@@ -7,6 +7,7 @@ public partial class ContainerFlyout : ContentView
 		InitializeComponent();
 	}
 
+    // Bind MyFlyoutContent
     public static readonly BindableProperty MyFlyoutContentProperty =
         BindableProperty.Create("MyFlyoutContent", typeof(View), typeof(ContainerFlyout), new Grid());
 
@@ -15,4 +16,24 @@ public partial class ContainerFlyout : ContentView
         get => (View)GetValue(MyFlyoutContentProperty);
         set => SetValue(MyFlyoutContentProperty, value);
     }
-}
+
+    // Bind IsNotConnected
+    public static readonly BindableProperty IsNotConnectedProperty =
+        BindableProperty.Create("IsNotConnected", typeof(bool), typeof(Button), true);
+
+    public bool IsNotConnected
+    {
+        get => (bool)GetValue(IsNotConnectedProperty);
+        set => SetValue(IsNotConnectedProperty, value);
+    }
+
+    // bind NeedReturn
+    public static readonly BindableProperty NeedReturnProperty =
+        BindableProperty.Create("NeedReturn", typeof(bool), typeof(Border), false);
+
+    public bool NeedReturn
+    {
+        get => (bool)GetValue(NeedReturnProperty);
+        set => SetValue(NeedReturnProperty, value);
+    }
+}

MCTG/Views/CustomHeader.xaml

@@ -2,13 +2,14 @@
 <ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
              x:Class="Views.CustomHeader"
-             BackgroundColor="{StaticResource Primary}">
+             BackgroundColor="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource Gray900}}">
 
     <Grid ColumnDefinitions="*">
 
         <Label Text="Ma cuisine trop géniale"
                FontAttributes="Bold" FontSize="30" FontFamily="Forte"
-               TextColor="Black" Margin="20, 10, 0, 0" 
+               TextColor="{AppThemeBinding Light={StaticResource Black}, Dark={StaticResource White}}"
+               Margin="20, 10, 0, 0" 
                VerticalOptions="Start" HorizontalOptions="Start"/>
 
     </Grid>

MCTG/Views/Home.xaml

@@ -5,7 +5,8 @@
              xmlns:local="clr-namespace:Views"
              x:Class="Views.Home">
 
-    <local:ContainerBase>
+    <local:ContainerBase
+        IsNotConnected="True">
 
         <!-- Flyout -->
         <local:ContainerBase.MyFlyoutContent>
@@ -14,8 +15,9 @@
                 <Button Text="Recherche" ImageSource="search_icon.png"
                     MaximumHeightRequest="20"
                     Style="{StaticResource button1}"/>
-                <SearchBar Placeholder="Mots-clés (ex.: rapide, fromage)" FontAttributes="Italic"
+                <SearchBar Placeholder="Mots-clés (ex.: rapide, fromage)" FontAttributes="Italic" TextColor="Black"
-                   BackgroundColor="White" Margin="15, 10, 15, 40"/>
+                           BackgroundColor="{AppThemeBinding Light={StaticResource White}, Dark={StaticResource Gray300}}"
+                           Margin="15, 10, 15, 40"/>
 
                 <!-- Direct research -->
                 <Button Text="Entrées" ImageSource="flatware_icon.png"
@@ -31,15 +33,16 @@
         <local:ContainerBase.MyContent>
             <ScrollView>
                 <StackLayout>
-                    <Label Text="Suggestions" TextColor="Black"
+                    <Label Text="Suggestions" TextColor="{AppThemeBinding Light={StaticResource Black}, Dark={StaticResource Gray100}}"
                            FontSize="24" Padding="15"/>
 
                     <FlexLayout
-                            Margin="0, 15"
+                        Margin="0, 15"
-                            Wrap="Wrap"
+                        Wrap="Wrap"
-                            JustifyContent="SpaceEvenly"
+                        JustifyContent="Start"
-                            AlignItems="Center"
+                        AlignItems="Center"
-                            AlignContent="SpaceEvenly">
+                        AlignContent="SpaceEvenly"
+                        HorizontalOptions="Center">
 
                         <local:RecipeCase CaseImageSource="room_service_icon.png"/>
                         <local:RecipeCase CaseImageSource="room_service_icon.png"/>
@@ -50,12 +53,14 @@
                         <local:RecipeCase CaseImageSource="room_service_icon.png"/>
                         <local:RecipeCase CaseImageSource="room_service_icon.png"/>
                         <local:RecipeCase CaseImageSource="room_service_icon.png"/>
+                        <local:RecipeCase CaseImageSource="room_service_icon.png"/>
+                        <local:RecipeCase CaseImageSource="room_service_icon.png"/>
 
                     </FlexLayout>
                 </StackLayout>
             </ScrollView>
         </local:ContainerBase.MyContent>
-        
+
     </local:ContainerBase>
 
 </ContentPage>

MCTG/Views/MyPosts.xaml

@@ -0,0 +1,55 @@
+<?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:local="clr-namespace:Views"
+             x:Class="Views.MyPosts"
+             Title="MyPosts">
+
+    <local:ContainerBase
+        IsNotConnected="False"
+        NeedReturn="True">
+
+        <local:ContainerBase.MyFlyoutContent>
+            
+            <Grid RowDefinitions="250, *, *" VerticalOptions="Fill">
+                <VerticalStackLayout Grid.Row="1">
+                    <Button Text="Mes informations" ImageSource="person_default.png" Style="{StaticResource button1}" Grid.Row="1"/>
+                    <Button Text="Modifier" ImageSource="settings_icon.png" Style="{StaticResource button1}" Grid.Row="2"/>
+                </VerticalStackLayout>
+            </Grid>
+            
+        </local:ContainerBase.MyFlyoutContent>
+
+        <local:ContainerBase.MyContent>
+
+            <ScrollView>
+                <StackLayout>
+                    <Label Text="Mon profil" TextColor="{AppThemeBinding Light={StaticResource Black}, Dark={StaticResource Gray100}}"
+                           FontAttributes="Bold"
+                           FontSize="24" Padding="15, 15, 20, 5"/>
+                    <Label Text="Mes publications" TextColor="{AppThemeBinding Light={StaticResource Black}, Dark={StaticResource Gray100}}"
+                           FontSize="20" Padding="15"/>
+
+                    <FlexLayout
+                            Margin="0, 15"
+                            Wrap="Wrap"
+                            JustifyContent="Start"
+                            AlignItems="Center"
+                            AlignContent="SpaceEvenly"
+                            HorizontalOptions="Center">
+
+                        <local:RecipeCase CaseImageSource="room_service_icon.png"/>
+                        <local:RecipeCase CaseImageSource="room_service_icon.png"/>
+                        <local:RecipeCase CaseImageSource="room_service_icon.png"/>
+                        <local:RecipeCase CaseImageSource="room_service_icon.png"/>
+                        <local:RecipeCase CaseImageSource="room_service_icon.png"/>
+
+                    </FlexLayout>
+                </StackLayout>
+            </ScrollView>
+
+        </local:ContainerBase.MyContent>
+        
+    </local:ContainerBase>
+    
+</ContentPage>

MCTG/Views/MyPosts.xaml.cs

@@ -0,0 +1,9 @@
+namespace Views;
+
+public partial class MyPosts : ContentPage
+{
+	public MyPosts()
+	{
+		InitializeComponent();
+	}
+}

MCTG/Views/Resources/Images/arrow_back_icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48"><path d="M480 896 160 576l320-320 42 42-248 248h526v60H274l248 248-42 42Z"/></svg>

MCTG/Views/Resources/Images/settings_icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48"><path d="m388 976-20-126q-19-7-40-19t-37-25l-118 54-93-164 108-79q-2-9-2.5-20.5T185 576q0-9 .5-20.5T188 535L80 456l93-164 118 54q16-13 37-25t40-18l20-127h184l20 126q19 7 40.5 18.5T669 346l118-54 93 164-108 77q2 10 2.5 21.5t.5 21.5q0 10-.5 21t-2.5 21l108 78-93 164-118-54q-16 13-36.5 25.5T592 850l-20 126H388Zm92-270q54 0 92-38t38-92q0-54-38-92t-92-38q-54 0-92 38t-38 92q0 54 38 92t92 38Zm0-60q-29 0-49.5-20.5T410 576q0-29 20.5-49.5T480 506q29 0 49.5 20.5T550 576q0 29-20.5 49.5T480 646Zm0-70Zm-44 340h88l14-112q33-8 62.5-25t53.5-41l106 46 40-72-94-69q4-17 6.5-33.5T715 576q0-17-2-33.5t-7-33.5l94-69-40-72-106 46q-23-26-52-43.5T538 348l-14-112h-88l-14 112q-34 7-63.5 24T306 414l-106-46-40 72 94 69q-4 17-6.5 33.5T245 576q0 17 2.5 33.5T254 643l-94 69 40 72 106-46q24 24 53.5 41t62.5 25l14 112Z"/></svg>

MCTG/Views/Resources/Styles/Styles.xaml

@@ -7,24 +7,24 @@
     <!-- Personal styles -->
     
     <Style x:Key="recipeCase" TargetType="Border">
-        <Setter Property="BackgroundColor" Value="LightGray"/>
+        <Setter Property="BackgroundColor" Value="{AppThemeBinding Light={StaticResource Gray300}, Dark={StaticResource Gray600}}"/>
-        <Setter Property="WidthRequest" Value="300"/>
+        <Setter Property="WidthRequest" Value="250"/>
         <Setter Property="HeightRequest" Value="200"/>
         <Setter Property="StrokeShape" Value="{RoundRectangle CornerRadius='10'}"/>
         <Setter Property="Margin" Value="10"/>
     </Style>
 
     <Style x:Key="button1" TargetType="Button">
-        <Setter Property="TextColor" Value="{StaticResource Black}"/>
+        <Setter Property="TextColor" Value="{AppThemeBinding Light={StaticResource Black}, Dark={StaticResource White}}"/>
-        <Setter Property="BackgroundColor" Value="{StaticResource Tertiary}"/>
+        <Setter Property="BackgroundColor" Value="{AppThemeBinding Light={StaticResource Tertiary}, Dark={StaticResource Gray500}}"/>
         <Setter Property="CornerRadius" Value="5"/>
         <Setter Property="MaximumHeightRequest" Value="20"/>
         <Setter Property="Margin" Value="15, 5"/>
     </Style>
 
     <Style x:Key="button2" TargetType="Button">
-        <Setter Property="TextColor" Value="{StaticResource White}"/>
+        <Setter Property="TextColor" Value="{AppThemeBinding Light={StaticResource White}, Dark={StaticResource White}}"/>
-        <Setter Property="BackgroundColor" Value="{StaticResource Primary}"/>
+        <Setter Property="BackgroundColor" Value="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource Gray400}}"/>
         <Setter Property="CornerRadius" Value="5"/>
         <Setter Property="MaximumHeightRequest" Value="20"/>
         <Setter Property="Margin" Value="15, 5"/>

MCTG/Views/ReturnButton.xaml

@@ -0,0 +1,22 @@
+<?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="Views.ReturnButton"
+             x:Name="rb">
+
+    <Border
+        MaximumWidthRequest="100"
+        MaximumHeightRequest="45"
+        BackgroundColor="{AppThemeBinding Light={StaticResource Tertiary}, Dark={StaticResource Gray400}}"
+        IsEnabled="{Binding NeedReturn, Source={x:Reference rb}}"
+        IsVisible="{Binding NeedReturn, Source={x:Reference rb}}">
+        <Border.StrokeShape>
+            <RoundRectangle CornerRadius="10"/>
+        </Border.StrokeShape>
+
+        <ImageButton Source="arrow_back_icon.png"
+                     HorizontalOptions="Center" VerticalOptions="Center"
+                     Aspect="Center" Scale="0.7"/>
+    </Border>
+    
+</ContentView>

MCTG/Views/ReturnButton.xaml.cs

@@ -0,0 +1,19 @@
+namespace Views;
+
+public partial class ReturnButton : ContentView
+{
+	public ReturnButton()
+	{
+		InitializeComponent();
+	}
+
+    // bind NeedReturn
+    public static readonly BindableProperty NeedReturnProperty =
+		BindableProperty.Create("NeedReturn", typeof(bool), typeof(Border), false);
+
+	public bool NeedReturn
+	{
+		get => (bool)GetValue(NeedReturnProperty);
+		set => SetValue(NeedReturnProperty, value);
+	}
+}

MCTG/Views/Views.csproj

@@ -63,9 +63,15 @@
 	  <MauiXaml Update="CustomHeader.xaml">
 	    <Generator>MSBuild:Compile</Generator>
 	  </MauiXaml>
+	  <MauiXaml Update="MyPosts.xaml">
+	    <Generator>MSBuild:Compile</Generator>
+	  </MauiXaml>
 	  <MauiXaml Update="RecipeCase.xaml">
 	    <Generator>MSBuild:Compile</Generator>
 	  </MauiXaml>
+	  <MauiXaml Update="ReturnButton.xaml">
+	    <Generator>MSBuild:Compile</Generator>
+	  </MauiXaml>
 	</ItemGroup>
 
 </Project>