Skip to content

Repository files navigation

Maui.NotificationBanner

A lightweight in-app popup / alert / notification banner library for .NET MAUI. Build top toast-style notifications with title, message, optional icon, configurable background, corner radius, duration, and tap-to-dismiss behavior without blocking your UI.

NuGet License: MIT

Demo

Recordings from Maui.NotificationBanner.Demo on simulator / emulator.

iOS

iOS notification banner demo 1   iOS notification banner demo 2

Android

Android notification banner demo 1   Android notification banner demo 2

Features

  • Works as an in-app popup, alert, notification, banner, or top toast UI
  • Title and message (title is optional)
  • Optional icon (ImageSource + optional IconResource for native iOS loading)
  • Solid or linear gradient background (Brush)
  • Corner radius, optional banner height and icon size
  • Message line limits and line break mode
  • Auto-dismiss after duration, or tap banner to dismiss
  • iOS: native window-level overlay (UIKit)
  • Android: window-level overlay by default (no host required)
  • Optional in-page rendering via NotificationBannerHost + AttachHost

Requirements

  • .NET MAUI (this repo targets .NET 10)
  • iOS 15+
  • Android 21+

Installation

NuGet

dotnet add package NotificationBanner.Maui

Or via Visual Studio: Manage NuGet Packages -> search NotificationBanner.Maui.

Project reference

dotnet add YourApp.csproj reference path/to/Maui.NotificationBanner/Maui.NotificationBanner.csproj

Quick start

1) Register the service

In MauiProgram.cs:

using Maui.NotificationBanner;

builder.Services.AddSingleton<NotificationBannerService>();
builder.Services.AddSingleton<INotificationBannerService>(sp => sp.GetRequiredService<NotificationBannerService>());

2) Show a banner

Use INotificationBannerService anywhere you need it:

await bannerService.ShowAsync(new BannerOptions
{
    Title = "Maui.NotificationBanner",
    Message = "In-app top banner - tap to dismiss.",
    Icon = ImageSource.FromFile("info.svg"),
    Duration = TimeSpan.FromSeconds(3),
    Background = new SolidColorBrush(Color.FromArgb("#2167d9")),
    CornerRadius = new CornerRadius(12),
    HorizontalMargin = 12,
    IconSize = 24
});

3) Dismiss programmatically

await bannerService.DismissAsync();

Platform behavior (popup/alert overlay)

  • iOS
    • Uses native UIKit window overlay.
    • No NotificationBannerHost needed.
  • Android
    • By default, uses a window overlay in the current activity.
    • No NotificationBannerHost needed.
    • Tap-to-dismiss works on overlay banners.

Optional: In-page host mode (Android)

If you want the banner to be rendered inside a page (instead of window overlay), add a host and attach it:

xmlns:nb="clr-namespace:Maui.NotificationBanner;assembly=Maui.NotificationBanner"

<nb:NotificationBannerHost x:Name="BannerHost">
    <!-- Your page content -->
</nb:NotificationBannerHost>
if (Handler?.MauiContext?.Services.GetService(typeof(NotificationBannerService)) is NotificationBannerService core)
    core.AttachHost(BannerHost);

You can also inherit BannerHostPage to reduce boilerplate when using host mode.

BannerOptions

Property Description
Title Banner title (empty = no title row)
Message Body text
Icon ImageSource for the leading icon
IconResource Optional bundle/resource name for native iOS overlay
Duration Auto-dismiss delay; null = no auto-dismiss
Background Brush (for example SolidColorBrush, LinearGradientBrush)
CornerRadius Outer corner radius
HorizontalMargin Left/right outer margin in device-independent units
IconSize Icon width/height in device-independent units
BannerHeight Optional fixed banner height
MessageMaxLines Max lines for message
MessageLineBreakMode Wrapping / truncation behavior

RGB / hex color examples

Background = new SolidColorBrush(Color.FromRgb(33, 150, 243));
Background = new SolidColorBrush(Color.FromArgb("#E63946"));

Gradient example

Background = new LinearGradientBrush(
    new GradientStopCollection
    {
        new GradientStop(Colors.Purple, 0f),
        new GradientStop(Colors.Orange, 1f)
    },
    new Point(0, 0),
    new Point(1, 0));

Sample app

The Maui.NotificationBanner.Demo project shows registration, page navigation (MainPage -> DetailPage), and ShowAsync usage.

Keywords

.NET MAUI, popup, alert, notification, banner, toast, in-app notification, ios, android

Run from the solution root:

dotnet build Maui.NotificationBanner.slnx
# Then deploy Maui.NotificationBanner.Demo to a simulator or device from your IDE.

Repository layout

Path Purpose
Maui.NotificationBanner/ Library (NuGet package)
Maui.NotificationBanner.Demo/ Demo app
docs/ Demo GIFs (ios-1/2, android-1/2) for this README

License

MIT - see LICENSE if present in the repo, or package metadata on NuGet.

About

A lightweight **in-app top notification banner** for **.NET MAUI**. Show title, message, and an optional leading icon with configurable background, corner radius, duration, and tap-to-dismiss — without blocking your UI.

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages