MAUI-[185425]-Effortlessly Bind JSON and REST APIs in the Syncfusion .NET MAUI ComboBox

ComboBoxBindingSample/ComboBoxBindingSample.slnx

@@ -0,0 +1,3 @@
+<Solution>
+  <Project Path="ComboBoxBindingSample/ComboBoxBindingSample.csproj" />
+</Solution>

ComboBoxSample/ComboBoxSample/App.xaml → ComboBoxBindingSample/ComboBoxBindingSample/App.xaml

@@ -1,8 +1,8 @@
 <?xml version = "1.0" encoding = "UTF-8" ?>
 <Application xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             xmlns:local="clr-namespace:ComboBoxSample"
-             x:Class="ComboBoxSample.App">
+             xmlns:local="clr-namespace:ComboBoxBindingSample"
+             x:Class="ComboBoxBindingSample.App">
     <Application.Resources>
         <ResourceDictionary>
             <ResourceDictionary.MergedDictionaries>

ComboBoxSample/ComboBoxSample/App.xaml.cs → ComboBoxBindingSample/ComboBoxBindingSample/App.xaml.cs

@@ -1,6 +1,6 @@
 using Microsoft.Extensions.DependencyInjection;
 
-namespace ComboBoxSample
+namespace ComboBoxBindingSample
 {
     public partial class App : Application
     {

ComboBoxSample/ComboBoxSample/AppShell.xaml → ComboBoxBindingSample/ComboBoxBindingSample/AppShell.xaml

@@ -1,10 +1,10 @@
 <?xml version="1.0" encoding="UTF-8" ?>
 <Shell
-    x:Class="ComboBoxSample.AppShell"
+    x:Class="ComboBoxBindingSample.AppShell"
     xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
     xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-    xmlns:local="clr-namespace:ComboBoxSample"
-    Title="ComboBoxSample">
+    xmlns:local="clr-namespace:ComboBoxBindingSample"
+    Title="ComboBoxBindingSample">
 
     <ShellContent
         Title="Home"

ComboBoxSample/ComboBoxSample/AppShell.xaml.cs → ComboBoxBindingSample/ComboBoxBindingSample/AppShell.xaml.cs

@@ -1,4 +1,4 @@
-namespace ComboBoxSample
+namespace ComboBoxBindingSample
 {
     public partial class AppShell : Shell
     {

ComboBoxSample/ComboBoxSample/ComboBoxSample.csproj → ComboBoxBindingSample/ComboBoxBindingSample/ComboBoxBindingSample.csproj

@@ -12,17 +12,17 @@
 		<!-- For example: <RuntimeIdentifiers>maccatalyst-x64;maccatalyst-arm64</RuntimeIdentifiers> -->
 
 		<OutputType>Exe</OutputType>
-		<RootNamespace>ComboBoxSample</RootNamespace>
+		<RootNamespace>ComboBoxBindingSample</RootNamespace>
 		<UseMaui>true</UseMaui>
 		<SingleProject>true</SingleProject>
 		<ImplicitUsings>enable</ImplicitUsings>
 		<Nullable>enable</Nullable>
 
 		<!-- Display name -->
-		<ApplicationTitle>ComboBoxSample</ApplicationTitle>
+		<ApplicationTitle>ComboBoxBindingSample</ApplicationTitle>
 
 		<!-- App Identifier -->
-		<ApplicationId>com.companyname.comboboxsample</ApplicationId>
+		<ApplicationId>com.companyname.comboboxbindingsample</ApplicationId>
 
 		<!-- Versions -->
 		<ApplicationDisplayVersion>1.0</ApplicationDisplayVersion>
@@ -63,4 +63,8 @@
 		<PackageReference Include="Syncfusion.Maui.Inputs" Version="31.2.10" />
 	</ItemGroup>
 
+	<ItemGroup>
+	  <Folder Include="Pages\" />
+	</ItemGroup>
+
 </Project>

ComboBoxSample/ComboBoxSample/MainPage.xaml → ComboBoxBindingSample/ComboBoxBindingSample/MainPage.xaml

@@ -1,8 +1,7 @@
 <?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:inputs="clr-namespace:Syncfusion.Maui.Inputs;assembly=Syncfusion.Maui.Inputs"
-			 x:Class="ComboBoxSample.MainPage">
+             x:Class="ComboBoxBindingSample.MainPage">
 
 	<ContentPage.Content>
 

ComboBoxBindingSample/ComboBoxBindingSample/MainPage.xaml.cs

@@ -0,0 +1,37 @@
+
+namespace ComboBoxBindingSample
+{
+	/// <summary>
+	/// The main page of the application, providing navigation to different samples.
+	/// </summary>
+	public partial class MainPage : ContentPage
+    {
+		/// <summary>
+		/// Initializes a new instance of the <see cref="MainPage"/> class.
+		/// </summary>
+		public MainPage()
+        {
+            InitializeComponent();
+        }
+
+		/// <summary>
+		/// Handles the click event for the button that navigates to the REST APIs sample.
+		/// </summary>
+		/// <param name="sender">The object that raised the event.</param>
+		/// <param name="e">The event data.</param>
+		private void Button_Clicked_1(object sender, EventArgs e)
+		{
+			Navigation.PushAsync(new UsingRESTAPIs());
+		}
+
+		/// <summary>
+		/// Handles the click event for the button that navigates to the JSON sample.
+		/// </summary>
+		/// <param name="sender">The object that raised the event.</param>
+		/// <param name="e">The event data.</param>
+		private void Button_Clicked_2(object sender, EventArgs e)
+		{
+			Navigation.PushAsync(new UsingJSON());
+		}
+	}
+}

ComboBoxSample/ComboBoxSample/MauiProgram.cs → ComboBoxBindingSample/ComboBoxBindingSample/MauiProgram.cs

@@ -1,7 +1,7 @@
 using Microsoft.Extensions.Logging;
 using Syncfusion.Maui.Core.Hosting;
 
-namespace ComboBoxSample
+namespace ComboBoxBindingSample
 {
     public static class MauiProgram
     {

ComboBoxBindingSample/ComboBoxBindingSample/Model/BindingModel.cs

@@ -0,0 +1,36 @@
+using System;
+using System.Collections.Generic;
+using System.Text;
+
+namespace ComboBoxBindingSample.Model
+{
+	/// <summary>
+	/// Represents a country item used for ComboBox binding.
+	/// </summary>
+	public class Country
+	{
+		/// <summary>
+		/// Gets or sets the display name of the country.
+		/// </summary>
+		public string Name { get; set; }
+		/// <summary>
+		/// Gets or sets the country code (e.g., ISO code).
+		/// </summary>
+		public string Code { get; set; }
+	}
+
+	/// <summary>
+	/// Simple user data transfer object used in REST API sample.
+	/// </summary>
+	public class UserDto
+	{
+		/// <summary>
+		/// Gets or sets the unique identifier of the user.
+		/// </summary>
+		public int Id { get; set; }
+		/// <summary>
+		/// Gets or sets the user name.
+		/// </summary>
+		public string Name { get; set; }
+	}
+}

ComboBoxSample/ComboBoxSample/UsingJSON.xaml → ComboBoxBindingSample/ComboBoxBindingSample/Pages/UsingJSON.xaml

@@ -1,9 +1,9 @@
 <?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:ComboBoxSample"
+			 xmlns:local="clr-namespace:ComboBoxBindingSample.ViewModel"
 			 xmlns:inputs="clr-namespace:Syncfusion.Maui.Inputs;assembly=Syncfusion.Maui.Inputs"
-			 x:Class="ComboBoxSample.UsingJSON">
+			 x:Class="ComboBoxBindingSample.UsingJSON">
 
 	<ContentPage.BindingContext>
 		<local:JsonViewModel />
@@ -15,8 +15,9 @@
 		<VerticalStackLayout Padding="50"
 							 Spacing="12">
 			<Button Text="Load JSON"
+					WidthRequest="320"
 					Clicked="OnLoadClicked" />
-			<inputs:SfComboBox WidthRequest="300"
+			<inputs:SfComboBox WidthRequest="320"
 							   ItemsSource="{Binding Countries}"
 							   DisplayMemberPath="Name"
 							   TextMemberPath="Name"

ComboBoxBindingSample/ComboBoxBindingSample/Pages/UsingJSON.xaml.cs

@@ -0,0 +1,49 @@
+using ComboBoxBindingSample.ViewModel;
+using Microsoft.Maui.Controls;
+using System.Collections.ObjectModel;
+using System.ComponentModel;
+using System.Data;
+using System.Diagnostics.CodeAnalysis;
+using System.Globalization;
+using System.Net.Http.Json;
+using System.Reflection;
+using System.Runtime.CompilerServices;
+using System.Text.Json;
+
+namespace ComboBoxBindingSample
+{
+	/// <summary>
+	/// Represents the page for demonstrating JSON data loading and binding.
+	/// </summary>
+	public partial class UsingJSON : ContentPage
+    {
+        public UsingJSON()
+        {
+			/// <summary>
+			/// Initializes a new instance of the <see cref="UsingJSON"/> class.
+			/// </summary>
+			InitializeComponent();
+        }
+
+		/// <summary>
+		/// Handles the click event for the button that navigates back to the main page.
+		/// </summary>
+		/// <param name="sender">The object that raised the event.</param>
+		/// <param name="e">The event data.</param>
+		private void Button_Clicked(object sender, EventArgs e)
+		{
+			Navigation.PushAsync(new MainPage());
+		}
+
+		/// <summary>
+		/// Handles the click event for the button that initiates loading of JSON data.
+		/// </summary>
+		/// <param name="sender">The object that raised the event.</param>
+		/// <param name="e">The event data.</param>
+		private async void OnLoadClicked(object sender, EventArgs e)
+		{
+			if (BindingContext is JsonViewModel vm)
+				await vm.LoadAsync();
+		}
+	}
+}

ComboBoxBindingSample/ComboBoxBindingSample/Pages/UsingRESTAPIs.xaml

@@ -0,0 +1,68 @@
+<?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:ComboBoxBindingSample.ViewModel"
+			 xmlns:inputs="clr-namespace:Syncfusion.Maui.Inputs;assembly=Syncfusion.Maui.Inputs"
+			 x:Class="ComboBoxBindingSample.UsingRESTAPIs"
+			 Padding="{OnPlatform iOS='0,44,0,16', Android='16', WinUI='24'}">
+
+	<ContentPage.BindingContext>
+		<local:RestViewModel />
+	</ContentPage.BindingContext>
+
+	<ContentPage.Content>
+
+		<ScrollView>
+			<Grid Padding="0"
+				  RowSpacing="12"
+				  ColumnSpacing="12"
+				  RowDefinitions="Auto,Auto"
+				  ColumnDefinitions="*,*">
+
+				<Button Text="Load from API"
+						Grid.Row="0"
+						Grid.Column="0"
+						HeightRequest="{OnPlatform Android=56, iOS=52, WinUI=48}"
+						MinimumHeightRequest="48"
+						MaximumWidthRequest="320"
+						HorizontalOptions="Fill"
+						Clicked="OnLoadClicked" />
+
+				<Button Text="Create user (POST)"
+						Grid.Row="0"
+						Grid.Column="1"
+						HeightRequest="{OnPlatform Android=56, iOS=52, WinUI=48}"
+						MinimumHeightRequest="48"
+						HorizontalOptions="Fill"
+						MaximumWidthRequest="320"
+						Clicked="OnCreateClicked" />
+
+				<inputs:SfComboBox Grid.Row="1"
+								   Grid.Column="0"
+								   HeightRequest="{OnPlatform Android=56, iOS=52, WinUI=48}"
+								   MinimumHeightRequest="48"
+								   HorizontalOptions="Fill"
+								   MaximumWidthRequest="320"
+								   ItemsSource="{Binding Users}"
+								   DisplayMemberPath="Name"
+								   TextMemberPath="Name"
+								   Placeholder="Select a user"
+								   Margin="0,0,0,0" />
+
+				<Entry x:Name="NameEntry"
+					   Grid.Row="1"
+					   Grid.Column="1"
+					   HeightRequest="{OnPlatform Android=56, iOS=52, WinUI=48}"
+					   MinimumHeightRequest="48"
+					   HorizontalOptions="Fill"
+					   MaximumWidthRequest="320"
+					   Keyboard="Text"
+					   ReturnType="Done"
+					   ClearButtonVisibility="WhileEditing"
+					   Placeholder="Enter new user name to POST" />
+			</Grid>
+		</ScrollView>
+
+	</ContentPage.Content>
+
+</ContentPage>

ComboBoxBindingSample/ComboBoxBindingSample/Pages/UsingRESTAPIs.xaml.cs

@@ -0,0 +1,55 @@
+using ComboBoxBindingSample.ViewModel;
+using Microsoft.Maui.Controls;
+using System.Collections.ObjectModel;
+using System.ComponentModel;
+using System.Data;
+using System.Diagnostics.CodeAnalysis;
+using System.Globalization;
+using System.Net.Http.Json;
+using System.Reflection;
+using System.Runtime.CompilerServices;
+using System.Text.Json;
+
+namespace ComboBoxBindingSample
+{
+	/// <summary>
+	/// Represents the page for demonstrating REST API consumption and data binding.
+	/// </summary>
+	public partial class UsingRESTAPIs : ContentPage
+    {
+		/// <summary>
+		/// Initializes a new instance of the <see cref="UsingRESTAPIs"/> class.
+		/// </summary>
+		public UsingRESTAPIs()
+        {
+            InitializeComponent();
+        }
+
+		/// <summary>
+		/// Handles the click event for the button that initiates loading of user data from the REST API.
+		/// </summary>
+		/// <param name="sender">The object that raised the event.</param>
+		/// <param name="e">The event data.</param>
+		private async void OnLoadClicked(object sender, EventArgs e)
+		{
+			if (BindingContext is RestViewModel vm)
+				await vm.LoadAsync();
+		}
+
+		/// <summary>
+		/// Handles the click event for the button that creates a new user via the REST API.
+		/// </summary>
+		/// <param name="sender">The object that raised the event.</param>
+		/// <param name="e">The event data.</param>
+		private async void OnCreateClicked(object sender, EventArgs e)
+        {
+			if (BindingContext is RestViewModel vm)
+			{
+				var name = NameEntry?.Text?.Trim();
+				if (!string.IsNullOrWhiteSpace(name))
+					await vm.CreateAsync(name);
+			}
+		}
+	}
+
+}

ComboBoxSample/ComboBoxSample/Platforms/Android/MainActivity.cs → ComboBoxBindingSample/ComboBoxBindingSample/Platforms/Android/MainActivity.cs

@@ -2,7 +2,7 @@
 using Android.Content.PM;
 using Android.OS;
 
-namespace ComboBoxSample
+namespace ComboBoxBindingSample
 {
     [Activity(Theme = "@style/Maui.SplashTheme", MainLauncher = true, LaunchMode = LaunchMode.SingleTop, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation | ConfigChanges.UiMode | ConfigChanges.ScreenLayout | ConfigChanges.SmallestScreenSize | ConfigChanges.Density)]
     public class MainActivity : MauiAppCompatActivity

ComboBoxSample/ComboBoxSample/Platforms/Android/MainApplication.cs → ComboBoxBindingSample/ComboBoxBindingSample/Platforms/Android/MainApplication.cs

@@ -1,7 +1,7 @@
 using Android.App;
 using Android.Runtime;
 
-namespace ComboBoxSample
+namespace ComboBoxBindingSample
 {
     [Application]
     public class MainApplication : MauiApplication

ComboBoxSample/ComboBoxSample/Platforms/iOS/AppDelegate.cs → ComboBoxBindingSample/ComboBoxBindingSample/Platforms/MacCatalyst/AppDelegate.cs

@@ -1,6 +1,6 @@
 using Foundation;
 
-namespace ComboBoxSample
+namespace ComboBoxBindingSample
 {
     [Register("AppDelegate")]
     public class AppDelegate : MauiUIApplicationDelegate