https://github.com/vapolia/SegmentedViews
Powerful segmented view for MAUI
https://github.com/vapolia/SegmentedViews
Last synced: 2 months ago
JSON representation
Powerful segmented view for MAUI
- Host: GitHub
- URL: https://github.com/vapolia/SegmentedViews
- Owner: vapolia
- License: apache-2.0
- Created: 2024-02-03T09:01:41.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2025-08-03T07:46:39.000Z (3 months ago)
- Last Synced: 2025-08-03T08:19:58.726Z (3 months ago)
- Language: C#
- Homepage:
- Size: 247 KB
- Stars: 10
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
- awesome-dotnet-maui - SegmentedViews - square)](https://github.com/vapolia/SegmentedViews/stargazers)|[](https://github.com/vapolia/SegmentedViews/commits) (UI)
README
# Vapolia.SegmentedViews
[![NuGet][nuget-img]][nuget-link]
[](https://github.com/vapolia/SegmentedViews/actions/workflows/main.yaml)
```cs
dotnet add package Vapolia.SegmentedViews
builder.UseSegmentedView();
```
[nuget-link]: https://www.nuget.org/packages/Vapolia.SegmentedViews/
[nuget-img]: https://img.shields.io/nuget/v/Vapolia.SegmentedViews
Platforms:
- Android API 27+
- iOS 15+
- MacOS 14.0+
- Windows 10.0.19041.0+
Supports both static segments and `ItemsSource` to build segments dynamically.
# Quick start
Add the above nuget package to your Maui project
then add this line to your maui app builder:
```c#
using Vapolia.SegmentedViews;
...
builder.UseSegmentedView();
```
# Examples
See the SampleApp in this repo.
Declare the namespace:
```xaml
```
Add a static segment view:
```xaml
```
Or a dynamic segment view:
```xaml
```
## Width of segment items
The width of a segment can be set in the following 3 ways, in reverse order of priority:
* On the `ItemsDefaultWidth` property of `SegmentedView`
```xml
```
* On the `ItemsWidthDefinitions` property of `SegmentedView`
```xml
```
This width follow the format of a Grid's ColumnsDefinition, so it should be straightforward to use.
* Directly on the `Width` property of a `Segment`
```xml
```
# IsSelectionRequired feature
By default, the control requires a selected item. By setting `IsSelectionRequired` to `False`, it won't try to constraint the SelectedIndex between 0 and the number of segments. The visual result is no segment is selected.
TLDR: set `IsSelectionRequired="False"` and `SelectedIndex="-1"` to visually see no selection.
# Highlight color on Android
This is standard Material design on the native Android platform. Check the native doc for more info.
For quick ref:
# FAQ
## Cannot resolve type "https://vapolia.eu/Vapolia.SegmentedViews:segmented:Segment"
Make sure your SupportedOSPlatformVersion is at least these:
```xml
15.0
15.0
21.0
10.0.19041.0
10.0.19041.0
```
## (2) Cannot resolve type "https://vapolia.eu/Vapolia.SegmentedViews:segmented:Segment"
replace `xmlns:segmented="https://vapolia.eu/Vapolia.SegmentedViews"`
by
`xmlns:segmented="clr-namespace:Vapolia.SegmentedViews;assembly=Vapolia.SegmentedViews"`
This looks like a bug in the xamlc compiler.
## Windows
On windows, this control uses `CommunityToolkit.WinUI.Controls.Segmented`