Segmetned Control for .NET MAUI apps Android | iOS | Maccatalyst
$ dotnet add package SegmentedControl.MauiThis plugin provides a customizable segmented control for .NET MAUI, supporting Android, iOS, and MacCatalyst platforms. It allows users to switch between different segments, useful in scenarios where multiple views or actions can be toggled.
Install the plugin via NuGet:
dotnet add package SegmentedControl.Maui
Or use the NuGet package manager to search for SegmentedControl.Maui and install it into your .NET MAUI project.
using SegmentedControl.Maui; // Add the necessary using directive
public static class MauiProgram
{
public static MauiApp CreateMauiApp()
{
var builder = MauiApp.CreateBuilder();
builder
.UseMauiApp<App>()
.UseSegmentedControl() // Register the segmented control here
....
return builder.Build();
}
}
You can add the segmented control in your XAML or C# code.
Example XAML
<?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:controls="clr-namespace:SegmentedControl.Maui;assembly=SegmentedControl.Maui"
x:Class="YourAppNamespace.MainPage">
<ContentPage.Content>
<VerticalStackLayout Padding="20">
<Label Text="Choose an option:"
FontSize="18"
HorizontalOptions="Center"
VerticalOptions="Start" />
<controls:SegmentedControl x:Name="red" Margin="10"
SelectedSegmentIndex="0"
BorderColor="Blue" BorderThickness="2"
BackgroundColor="lime" HorizontalOptions="Fill"
TextColor="Black" SegmentSelectedCommandParameter="{Binding .}"
SelectedItemBackgroundColor="Yellow"
SegmentSelectedCommand="{Binding MyCommand}">
<controls:Segment Text="Item 1" />
<controls:Segment Text="Itme 2" />
<controls:Segment Text="Itme 3" />
</controls:SegmentedControl>
</VerticalStackLayout>
</ContentPage.Content>
</ContentPage>
Same can be done using C# if required.
This project is licensed under the MIT License - see the LICENSE file for details.