Switch Case and NumericUpDown

VladislavAntonyuk · Jan 17, 2025 · c82e7f8 · c82e7f8
1 parent fb792bf
commit c82e7f8
Show file tree

Hide file tree

Showing 11 changed files with 372 additions and 200 deletions.
diff --git a/MauiConditionView/ConditionView.cs b/MauiConditionView/ConditionView.cs
@@ -4,7 +4,7 @@ public class ConditionView : ContentView
 {
 	public static readonly BindableProperty FalseProperty = BindableProperty.Create(nameof(False), typeof(View), typeof(ConditionView), default(View));
 	public static readonly BindableProperty TrueProperty = BindableProperty.Create(nameof(True), typeof(View), typeof(ConditionView), default(View));
-	public static readonly BindableProperty IfProperty = BindableProperty.Create(nameof(If), typeof(bool), typeof(ConditionView), default(bool), propertyChanged:ConditionChanged);
+	public static readonly BindableProperty IfProperty = BindableProperty.Create(nameof(If), typeof(bool), typeof(ConditionView), default(bool), propertyChanged: ConditionChanged);
 
 	private static void ConditionChanged(BindableObject bindable, object oldvalue, object newvalue)
 	{

diff --git a/MauiConditionView/MainPage.xaml b/MauiConditionView/MainPage.xaml
@@ -2,6 +2,7 @@
 <ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
              xmlns:mauiConditionView="using:MauiConditionView"
+             xmlns:system="clr-namespace:System;assembly=System.Runtime"
              x:Class="MauiConditionView.MainPage"
              x:DataType="mauiConditionView:MainPage">
 
@@ -13,10 +14,17 @@
             Padding="30,0"
             Spacing="25">
 
+			<mauiConditionView:NumericUpDown
+				Value="{Binding Count}" 
+				Minimum="0" 
+				Maximum="6" 
+				Increment="1" 
+                HorizontalOptions="Center" />
+
 			<mauiConditionView:ConditionView If="{Binding Count, Converter={StaticResource CountToBoolConverter}}">
 				<mauiConditionView:ConditionView.True>
 					<Label
-						Text="Hello, World!"
+						Text="If Condition is TRUE"
 						Style="{StaticResource Headline}"
 						SemanticProperties.HeadingLevel="Level1" />
 				</mauiConditionView:ConditionView.True>
@@ -29,20 +37,47 @@
 							SemanticProperties.Description="dot net bot in a hovercraft number nine" />
 
 						<Label
-							Text="Welcome to &#10;.NET Multi-platform App UI"
+							Text="IF Condition is False"
 							Style="{StaticResource SubHeadline}"
 							SemanticProperties.HeadingLevel="Level2"
 							SemanticProperties.Description="Welcome to dot net Multi platform App U I" />
 					</VerticalStackLayout>
 				</mauiConditionView:ConditionView.False>
 			</mauiConditionView:ConditionView>
 
-			<Button
-                x:Name="CounterBtn"
-                Text="Click me" 
-                SemanticProperties.Hint="Counts the number of times you click"
-                Clicked="OnCounterClicked"
-                HorizontalOptions="Fill" />
+			<mauiConditionView:SwitchCaseView x:TypeArguments="system:Int32" Switch="{Binding Count}">
+				<mauiConditionView:SwitchCaseView.Conditions>
+					<mauiConditionView:CaseView x:TypeArguments="system:Int32" Case="1">
+						<Label
+							Text="Case 1"
+							Style="{StaticResource Headline}"
+							SemanticProperties.HeadingLevel="Level1" />
+					</mauiConditionView:CaseView>
+					<mauiConditionView:CaseView x:TypeArguments="system:Int32" Case="3">
+						<VerticalStackLayout>
+							<Label
+								Text="Case 3"
+								Style="{StaticResource Headline}"
+								SemanticProperties.HeadingLevel="Level1" />
+							<Image
+								Source="dotnet_bot.png"
+								HeightRequest="185"
+								Aspect="AspectFit"
+								SemanticProperties.Description="dot net bot in a hovercraft number nine" />
+						</VerticalStackLayout>
+					</mauiConditionView:CaseView>
+				</mauiConditionView:SwitchCaseView.Conditions>
+				<mauiConditionView:SwitchCaseView.Default>
+					<VerticalStackLayout>
+						<Label
+							Text="Case Default"
+							Style="{StaticResource SubHeadline}"
+							SemanticProperties.HeadingLevel="Level2"
+							SemanticProperties.Description="Welcome to dot net Multi platform App U I" />
+					</VerticalStackLayout>
+				</mauiConditionView:SwitchCaseView.Default>
+			</mauiConditionView:SwitchCaseView>
+
 		</VerticalStackLayout>
 	</ScrollView>
 

diff --git a/MauiConditionView/MainPage.xaml.cs b/MauiConditionView/MainPage.xaml.cs
@@ -11,19 +11,9 @@ public int Count
 			OnPropertyChanged();
 		}
 	}
-
 	public MainPage()
 	{
 		InitializeComponent();
 		BindingContext = this;
 	}
-
-	private void OnCounterClicked(object sender, EventArgs e)
-	{
-		Count++;
-
-		CounterBtn.Text = Count == 1 ? $"Clicked {Count} time" : $"Clicked {Count} times";
-
-		SemanticScreenReader.Announce(CounterBtn.Text);
-	}
 }
diff --git a/MauiConditionView/NumericUpDown.xaml b/MauiConditionView/NumericUpDown.xaml
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<HorizontalStackLayout xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+                       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+                       x:Class="MauiConditionView.NumericUpDown">
+	<Button Text="-"
+	        Clicked="DecrementClicked"
+	        Margin="0,0,5,0"
+	        HeightRequest="40"
+	        WidthRequest="40" />
+
+	<Label x:Name="ValueControl"
+	       VerticalOptions="Center"
+	       HorizontalOptions="Center"/>
+
+	<Button Text="+"
+	        Clicked="IncrementClicked"
+	        Margin="5,0,0,0"
+	        HeightRequest="40"
+	        WidthRequest="40" />
+</HorizontalStackLayout>
diff --git a/MauiConditionView/NumericUpDown.xaml.cs b/MauiConditionView/NumericUpDown.xaml.cs
@@ -0,0 +1,59 @@
+namespace MauiConditionView;
+
+using System.Globalization;
+
+public partial class NumericUpDown
+{
+	public NumericUpDown()
+	{
+		InitializeComponent();
+		ValueControl.Text = Value.ToString(CultureInfo.CurrentCulture);
+	}
+
+	public static readonly BindableProperty ValueProperty = BindableProperty.Create(nameof(Value), typeof(double), typeof(NumericUpDown), 0.0, BindingMode.TwoWay);
+	public static readonly BindableProperty MinimumProperty = BindableProperty.Create(nameof(Minimum), typeof(double), typeof(NumericUpDown), 0.0);
+	public static readonly BindableProperty MaximumProperty = BindableProperty.Create(nameof(Maximum), typeof(double), typeof(NumericUpDown), 100.0);
+	public static readonly BindableProperty IncrementProperty = BindableProperty.Create(nameof(Increment), typeof(double), typeof(NumericUpDown), 1.0);
+
+	public double Value
+	{
+		get => (double)GetValue(ValueProperty);
+		set
+		{
+			var newValue = Math.Clamp(value, Minimum, Maximum);
+			if (!newValue.Equals((double)GetValue(ValueProperty)))
+			{
+				SetValue(ValueProperty, newValue);
+				ValueControl.Text = newValue.ToString(CultureInfo.CurrentCulture);
+			}
+		}
+	}
+
+	public double Minimum
+	{
+		get => (double)GetValue(MinimumProperty);
+		set => SetValue(MinimumProperty, value);
+	}
+
+	public double Maximum
+	{
+		get => (double)GetValue(MaximumProperty);
+		set => SetValue(MaximumProperty, value);
+	}
+
+	public double Increment
+	{
+		get => (double)GetValue(IncrementProperty);
+		set => SetValue(IncrementProperty, value);
+	}
+
+	private void IncrementClicked(object sender, EventArgs e)
+	{
+		Value += Increment;
+	}
+
+	private void DecrementClicked(object sender, EventArgs e)
+	{
+		Value -= Increment;
+	}
+}
diff --git a/MauiConditionView/README.md b/MauiConditionView/README.md
@@ -0,0 +1,7 @@
+# .NET MAUI ConditionView
+
+[![Buy Me A Coffee](https://ik.imagekit.io/VladislavAntonyuk/vladislavantonyuk/misc/bmc-button.png)](https://www.buymeacoffee.com/vlad.antonyuk)
+
+Article: https://vladislavantonyuk.github.io/articles/Building-Dynamic-UI-with-Decision-Logic-in-.NET-MAUI-XAML
+
+[![Stand With Ukraine](https://img.shields.io/badge/made_in-ukraine-ffd700.svg?labelColor=0057b7)](https://stand-with-ukraine.pp.ua)
diff --git a/MauiConditionView/README.mdpp b/MauiConditionView/README.mdpp
@@ -0,0 +1,7 @@
+# .NET MAUI ConditionView
+
+!INCLUDE "./md/header.mdpp"
+
+Article: https://vladislavantonyuk.github.io/articles/Building-Dynamic-UI-with-Decision-Logic-in-.NET-MAUI-XAML
+
+!INCLUDE "./md/footer.mdpp"
diff --git a/MauiConditionView/SwitchCaseView.cs b/MauiConditionView/SwitchCaseView.cs
@@ -0,0 +1,46 @@
+namespace MauiConditionView;
+
+public class SwitchCaseView<T> : ContentView
+	where T : notnull
+{
+	public static readonly BindableProperty ConditionsProperty = BindableProperty.Create(nameof(Conditions), typeof(ICollection<CaseView<T>>), typeof(ConditionView), new List<CaseView<T>>(), propertyChanged:SwitchChanged);
+	public static readonly BindableProperty DefaultProperty = BindableProperty.Create(nameof(Default), typeof(View), typeof(ConditionView), propertyChanged: SwitchChanged);
+	public static readonly BindableProperty SwitchProperty = BindableProperty.Create(nameof(Switch), typeof(T), typeof(ConditionView), propertyChanged: SwitchChanged);
+
+	private static void SwitchChanged(BindableObject bindable, object oldvalue, object newvalue)
+	{
+		var switchCaseView = (SwitchCaseView<T>)bindable;
+		switchCaseView.Content = switchCaseView.Conditions
+		                                     .Where(x => x.Case.Equals(switchCaseView.Switch))
+		                                     .Select(x => x.Content)
+		                                     .SingleOrDefault(switchCaseView.Default);
+	}
+
+	public T Switch
+	{
+		get => (T)GetValue(SwitchProperty);
+		set => SetValue(SwitchProperty, value);
+	}
+
+	public View? Default
+	{
+		get => (View?)GetValue(DefaultProperty);
+		set => SetValue(DefaultProperty, value);
+	}
+
+	public ICollection<CaseView<T>> Conditions
+	{
+		get => (ICollection<CaseView<T>>)GetValue(ConditionsProperty);
+		set => SetValue(ConditionsProperty, value);
+	}
+}
+
+public class CaseView<T> : ContentView
+{
+	public static readonly BindableProperty CaseProperty = BindableProperty.Create(nameof(Case), typeof(T), typeof(CaseView<T>));
+	public T Case
+	{
+		get => (T)GetValue(CaseProperty);
+		set => SetValue(CaseProperty, value);
+	}
+}