Sharpnado.Tabs

The library uses a decoupled architecture where the tab navigation and the content display are separate components. They are connected via two-way binding on the SelectedIndex property.

• TabHostView: The container for the tab controls. It manages the layout (Fixed or Scrollable), orientation (Horizontal or Vertical), and visual style (e.g., IsSegmented).
• ViewSwitcher: The container for the actual content. It switches views based on the SelectedIndex provided by the TabHostView.

This separation allows you to place the TabHostView and ViewSwitcher in different parts of your UI layout while maintaining synchronized navigation.

If the built-in tab items do not meet your design requirements, you can create custom tabs by extending the abstract TabItem class.

// In your C# code
public class MyCustomTab : TabItem
{
    // Implement custom logic or properties here
}

<!-- In your XAML -->
<tabs:TabHostView>
    <tabs:TabHostView.Tabs>
        <local:MyCustomTab Label="Custom" />
    </tabs:TabHostView.Tabs>
</tabs:TabHostView>

To improve app startup time and reduce UI construction overhead, the library provides components to defer view creation:

• LazyView: Delays the creation of a view until it is actually needed.
• DelayedView: An evolution of LazyView that allows for configurable delay timing and includes built-in support for an activity indicator during the loading process.

Install the library via NuGet: Sharpnado.Tabs.Maui.

Supported platforms include Android, iOS, Windows, and MacCatalyst.

dotnet add package Sharpnado.Tabs.Maui

The repository includes sample projects to demonstrate library features. You can build the main sample app, specific platform versions, or the Shell sample using the following commands.

# Build the main sample app in Debug mode
dotnet build MauiSample/MauiSample.csproj -c Debug

# Build for specific platforms
dotnet build MauiSample/MauiSample.csproj -f net9.0-android -c Debug
dotnet build MauiSample/MauiSample.csproj -f net9.0-ios -c Debug
dotnet build MauiSample/MauiSample.csproj -f net9.0-maccatalyst -c Debug

# Restore dependencies for the sample solution
dotnet restore MauiSample/MauiSample.sln

# Build the Shell sample
dotnet build MauiShellSample/MauiShellSample.csproj -c Debug

Use the following commands to build the library from the root directory. Note that running a Release build automatically creates a NuGet package because PackOnBuild=true is enabled.

# Build the main library in Release mode (also creates NuGet package)
dotnet build Maui.Tabs/Maui.Tabs.csproj -c Release

# Build the main library in Debug mode
dotnet build Maui.Tabs/Maui.Tabs.csproj -c Debug

# Explicitly create NuGet package
dotnet pack Maui.Tabs/Maui.Tabs.csproj -c Release

To reduce application startup time, wrap your views inside a ViewSwitcher with DelayedView. This defers the UI building of components by a configurable number of milliseconds.

DelayedView can be used anywhere in your app, not just within the Tabs context.

<tabs:ViewSwitcher SelectedIndex="{Binding SelectedIndex}">
    <tabs:DelayedView x:TypeArguments="views:MyView"
                      AccentColor="Red"
                      Animate="True"
                      UseActivityIndicator="True" />
    <tabs:LazyView x:TypeArguments="views:OtherView" />
</tabs:ViewSwitcher>

To use the library, you must initialize it in your MauiProgram.cs using the .UseSharpnadoTabs() extension method on the MauiAppBuilder.

public static class MauiProgram
{
    public static MauiApp CreateMauiApp()
    {
        var builder = MauiApp.CreateBuilder();
        builder
            .UseMauiApp<App>()
            .UseSharpnadoTabs(loggerEnable: false);

        return builder.Build();
    }
}

The following resources are available for using and supporting the library:

• NuGet Package: Install via NuGet using the package name Sharpnado.Tabs.Maui.
• Sample Project: View the source code for the demonstration app in the MauiSample directory.
• Issues & Support: Report bugs or request features on the GitHub Issues page.

To use the library in your .NET MAUI project, you must call .UseSharpnadoTabs() during the application builder initialization in your MauiProgram.cs file. This enables the library's core functionality.

Set loggerEnable to true if you need internal library logging, or false for production environments.

public static MauiApp CreateMauiApp()
{
    var builder = MauiApp.CreateBuilder();
    builder
        .UseMauiApp<App>()
        .UseSharpnadoTabs(loggerEnable: false);

    return builder.Build();
}