Skip to content
Document DB 13 - MCP Server, REST API, Field Level Encryption, Transactional Outbox, & More!SHOW ME!!

Controls | Getting Started

A rich, ready-to-use UI controls library for both .NET MAUI and Blazor. One package per host covers TableView, DataGrid, TreeView, Scheduler, FloatingPanel, SheetView, DurationPicker, Fab/FabMenu, Toolbar/TabBar, PillView, BadgeView, SkeletonView, Toast, Dialogs, SecurityPin, SignaturePad, ImageViewer, ImageEditor, ChatView, ColorPicker, FontPicker, ProgressBar, Slider, Overlay/LoadingOverlay, AutoCompleteEntry, CountryPicker, AddressEntry, TextEntry, CarouselGallery, Carousel, ParallaxCollectionView, StaggeredGrid, and VirtualizedGrid. Barcodes & QR Codes, CameraView (with pluggable effects and barcode/face/motion/OCR/document/AI analyzers), Markdown, Mermaid Diagrams, and Speech Add-ins are available as separate add-on packages for each host, plus desktop add-ons (Tray Icon, Docking, On-Screen Keyboard).

GitHub GitHub stars for shinyorg/controls
MAUI NuGet downloads for Shiny.Maui.Controls
Blazor NuGet downloads for Shiny.Blazor.Controls
MAUI Barcodes NuGet downloads for Shiny.Maui.Controls.Barcodes
Blazor Barcodes NuGet downloads for Shiny.Blazor.Controls.Barcodes
MAUI Camera NuGet downloads for Shiny.Maui.Controls.Camera
Blazor Camera NuGet downloads for Shiny.Blazor.Controls.Camera
MAUI Markdown NuGet downloads for Shiny.Maui.Controls.Markdown
Blazor Markdown NuGet downloads for Shiny.Blazor.Controls.Markdown
MAUI Mermaid Diagrams NuGet downloads for Shiny.Maui.Controls.MermaidDiagrams
Blazor Mermaid Diagrams NuGet downloads for Shiny.Blazor.Controls.MermaidDiagrams
MAUI Speech Add-ins NuGet downloads for Shiny.Maui.Controls.SpeechAddins
Blazor Speech Add-ins NuGet downloads for Shiny.Blazor.Controls.SpeechAddins
Frameworks
.NET MAUI
Blazor
Control Description
TableView Settings-style table with 14 cell types, cascading styles, drag-to-sort, sections, and full MVVM support
DataGrid Feature-rich data grid modeled on MudBlazor — typed columns, sorting, filtering, grouping, aggregates, selection, inline editing, paging, virtualization, and column resize/reorder. A pure cross-platform composite on MAUI (no native handlers) and a generic DataGrid<TItem> rendering semantic HTML on Blazor
TreeView Hierarchical tree with lazy loading, configurable expand/collapse icons, single/multi-selection, CanExpand/CanSelect predicates, drag/drop reorder, and Blazor keyboard navigation
Scheduler Calendar grid, agenda timeline, and event list views with a shared ISchedulerEventProvider interface
FloatingPanel Draggable floating panel overlay (bottom, bottom with tabs, or top) with configurable detents, OverlayHost backdrop management, header peek, keyboard handling, and ShinyContentPage convenience base class
DurationPicker Standalone duration picker control that opens a FloatingPanel with hour/minute selection, min/max constraints, and configurable intervals
Fab & FabMenu Material-style floating action button and expanding multi-action menu with staggered animations, backdrop, and full color customization
PillView Status badge/label with 6 preset themes, custom colors, and WCAG-accessible contrast
SecurityPin PIN entry with individually rendered cells, optional character masking, and full styling control
ImageViewer Full-screen image overlay with pinch-to-zoom, pan, double-tap zoom, and animated transitions
ImageEditor Inline image editor with crop, rotate, draw, line/arrow, text annotations with font selection, undo/redo, and export to PNG/JPEG/WEBP
FontPicker Font family and font size picker controls with inline list and popup button variants, each font rendered in its own typeface
ChatView Modern chat UI with message bubbles, typing indicators, per-participant colors/avatars, load-more, and input bar
ColorPicker Full-featured color picker with spectrum view, hue bar, opacity slider, hex input, and preview swatch
AutoCompleteEntry Text input with debounced search, dropdown suggestions, busy indicator, and custom item templates
CountryPicker Country search with flag emoji, name, and dial code from full ISO 3166-1 list
AddressEntry Address search with geocoding (Nominatim by default) and structured address results
TextEntry Material Design-inspired text entry with animated floating placeholder, customizable border, tool slots, validation hints, and character count
SignaturePad Signature capture with canvas drawing, PNG export, and configurable panel overlay (requires OverlayHost or ShinyContentPage on MAUI)
ProgressBar Progress bar with gradient fill, Vista-style shimmer pulse, determinate/indeterminate modes, and text overlay
Slider Slider with a cold-to-hot two-color gradient track, blended thumb, tooltip, and full drag/tap interaction
SkeletonView Content-wrapping skeleton loader with animated shimmer placeholders for loading states
BadgeView Content-wrapping corner badge with text, dot, count overflow, and pulse animation
Toast Service-based toast notifications with auto-dismiss, stacking, spinner, progress bar, and full styling
Dialogs Service-first alert, confirm, and prompt dialogs — always library-rendered (never the native alert), identical across platforms with custom entry/exit animations and full template overrides. Inject IDialogService and await a result
Feedback Service Extensible feedback service — haptic, audio, text-to-speech, or any custom response to control events (MAUI)
Overlay & LoadingOverlay Full-screen overlay with configurable backdrop, custom content template, and built-in loading mode (spinner or progress bar)
SheetView Draggable sheet overlay (bottom or top) with configurable snap points — the Blazor equivalent of MAUI’s FloatingPanel (Blazor only)
Toolbar & TabBar Screen-docked navigation chrome — a docked action toolbar and a mobile-style tab bar, both with a frosted-glass option and scroll-under behavior (Blazor only)
CarouselGallery Netflix-style horizontal carousel with snap-to-center, scale transforms, peek insets, and position tracking (MAUI ↔ Blazor parity)
Carousel Embla-style, transform-based drag carousel for Blazor — alignment, slides-per-view, variable widths, seamless looping, scroll-linked effects, autoplay, and counter / progress / thumbnail chrome (Blazor only)
ParallaxCollectionView CollectionView with a hero header that translates (and optionally collapses or fades) at a configurable fraction of the scroll offset
StaggeredGrid Pinterest-style masonry/waterfall layout with variable-height items in configurable columns
VirtualizedGrid Full-featured grouped grid with sticky headers, virtualization, orientation-aware columns, and load-more
CameraView Cross-platform camera preview with zoom, torch, lens selection, photo + video capture and burn-in video overlays, a pluggable effects pipeline (colour grades, comic/sketch looks, face masks, AI stylization) and a pluggable frame-analysis pipeline — barcode, face, motion, OCR, structured documents, and AI document scanning (separate packages)
Barcodes & QR Codes Pure-managed 1D and 2D barcode + QR code rendering (separate package)
Markdown Read-only markdown renderer and full editor with formatting toolbar and live preview (separate package)
Mermaid Diagrams Native Mermaid flowchart rendering with Sugiyama layout, themes, and pan/zoom (separate package)
Tray Icon Cross-platform system tray / status-bar / menu-bar icon for MAUI desktop apps — Windows, macOS AppKit, MacCatalyst, and Linux. Context menus with per-item icons and OS-dispatched keyboard accelerators, click events, tooltips, badges, OS notifications, animated icons, dynamic visibility (ships in the Shiny.Maui.Controls.Desktop add-on, MAUI desktop only)
Docking Visual-Studio-style window docking for MAUI desktop and Blazor — dockable tool windows, tabbed groups, splitters, auto-hide rails, and tear-off floating windows on Windows / macOS AppKit / Linux GTK. Layout schema with JSON round-trip + forward-only migrations, IDockHost per-window controller, IDockableContentFactory panel registration by stable ID (MAUI: Shiny.Maui.Controls.Desktop package; Blazor: Shiny.Blazor.Controls.Kiosk package, namespace Shiny.Blazor.Controls.Kiosk.Docking — kiosk-shaped Blazor add-on combining docking and a forthcoming on-screen keyboard)
On-Screen Keyboard Touch / kiosk on-screen keyboard for MAUI desktop and Blazor — US-QWERTY with shift / numbers / symbols layers, bottom-docked auto-show on focus, dispatches into the focused Entry / Editor (MAUI) or <input> / <textarea> (Blazor) without stealing focus. Full AutomationPeer / ARIA tree for switch-input accessibility. Ships in Shiny.Maui.Controls.Desktop and Shiny.Blazor.Controls.Kiosk

Speech add-ins are available as separate packages (Shiny.Maui.Controls.SpeechAddins and Shiny.Blazor.Controls.SpeechAddins) that extend controls with voice capabilities.

Control Description
SpeechToTextTool Speech recognition tool for the ChatView input bar — listens for voice input and backfills chat messages with configurable auto-send, silence timeout, culture/language selection, and customizable listening appearance
TextToSpeechBubbleTool Text-to-speech tool for ChatView message bubbles — reads message text aloud with configurable speech rate, pitch, volume, voice, and culture
TextEntrySpeechToTextTool Speech recognition tool for any TextEntry control — appends recognized speech to the input field with listening state indicator and customizable appearance
Shiny.Maui.ControlsNuGet package Shiny.Maui.Controls

Add the XAML namespace to your pages:

xmlns:shiny="http://shiny.net/maui/controls"

For Markdown controls (separate package: Shiny.Maui.Controls.Markdown):

xmlns:md="http://shiny.net/maui/markdown"

For Mermaid Diagrams (separate package: Shiny.Maui.Controls.MermaidDiagrams):

xmlns:diagram="http://shiny.net/maui/diagrams"

For Speech Add-ins (separate package: Shiny.Maui.Controls.SpeechAddins), no additional XML namespace is needed — speech controls use the same shiny namespace as the core controls.

Install Shiny.Blazor.Controls (plus Shiny.Blazor.Controls.Markdown, Shiny.Blazor.Controls.MermaidDiagrams, or Shiny.Blazor.Controls.SpeechAddins as needed) and add the @using directives — typically in _Imports.razor:

@using Shiny.Blazor.Controls
@using Shiny.Blazor.Controls.Cells
@using Shiny.Blazor.Controls.Sections
@using Shiny.Blazor.Controls.Scheduler
@using Shiny.Blazor.Controls.Chat
@using Shiny.Blazor.Controls.Markdown
@using Shiny.Blazor.Controls.MermaidDiagrams
@using Shiny.Blazor.Controls.SpeechAddins

No DI registration is required — drop the components into any .razor page.

claude plugin marketplace add shinyorg/skills
claude plugin install controls@shiny
copilot plugin marketplace add https://github.com/shinyorg/skills
copilot plugin install controls@shiny
View controls Plugin