Skip to content

Latest commit

 

History

625 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🌼 Flowery.NET

More than 100 themed controls for Avalonia UI on the desktop, in the browser, on Android and on iOS.

NuGet Downloads License Avalonia Docs X

Flowery.NET.Gallery Screenshot

iPhone 17 (iOS 26.5 simulator) Android 15 (emulator)
The Gallery home page on an iPhone in the Light theme The Gallery home page on Android in the Dark theme The Button page of the Gallery on Android in the Dark theme The Glass Interface page of the Gallery on Android

🌐 Localized in 12 languages including:

🇯🇵 日本語にローカライズ済み  •  🇰🇷 한국어로 현지화됨  •  🇨🇳 已本地化为简体中文

🇺🇦 Локалізовано українською  •  🇸🇦 مترجم للعربية  •  🇮🇱 מתורגם לעברית

Flowery.NET is a cross-platform control library for Avalonia UI, on Windows, Linux and macOS, in the browser (WebAssembly), on Android and on iOS. It offers more than 100 themed controls, 37 built-in themes that switch at runtime, global sizing, glass and neumorphic effects and twelve UI languages. The control set and 35 of the themes take their names and look from the DaisyUI design language, adapted to Avalonia rather than copied; many controls, the scheduler, the Kanban board and the effects have no DaisyUI counterpart. Optional packages add the Kanban board and the SkiaSharp effects: the live glass blur and the GL carousel effects.

Features

  • Themes. 37 built-in themes, switchable at runtime: the 35 DaisyUI themes and two of Flowery's own, Smooth and Glassy. 96 industry palettes and your own custom palettes can be registered as well. A base color set at run time gives any theme another base, with the other base colors and the text keeping their contrast, and a theme can bring a backdrop for the whole app. High contrast, from the system or the app, turns every theme into black and white with one strong accent. Theming guide
  • Design tokens. Colors, brushes, spacing and typography come from design tokens that an app can override in its resources. Design tokens
  • Sizing. Five size tiers from ExtraSmall to ExtraLarge, per control or for the whole app through FlowerySizeManager, which the user can change at runtime. Responsive scaling adapts the fonts to the window size.
  • Controls. Input, selection, navigation, popup, dialog, layout, data display and feedback controls with the DaisyUI variants (Primary, Secondary, Accent, Ghost and more), plus a color picker suite, weather widgets, a date timeline, and mask and numeric inputs.
  • Scheduler. Day, Week, Month, Agenda, Calendar, Planner and Timeline views with typed resources, collapsible groups, occupancy queries, regional date and time formats, zoomable columns and an appointment editor. Part of the core package. Usage guide
  • Kanban. Boards with a home screen, swimlanes, work limits, JSON storage with import and export, undo and redo, filtering, statistics, bulk editing and keyboard support. Assignees come from the host app as a list or through callbacks; the package does no sign-in and talks to no account service. Separate package. Feature overview
  • Touch. Scheduler and Kanban share one touch model for touch and pen: a tap opens, holding selects and then moves, resizes or drags, and a swipe only scrolls. Both are tested on Android phones and tablets.
  • Glass. Glass themes for the standard controls, a glass mode that puts every input control on glass, and a designer for glass looks. The optional Flowery.NET.Skia package adds the live backdrop blur with liquid-glass optics, refraction and animated shader backgrounds.
  • GL carousel effects. Flowery.NET.Skia also draws 51 carousel transitions and effects with SkSL shaders on every target, such as masks, flips, cubes, slides, dissolve, pixelate, pan and zoom and a text fill. The Gallery adds the 100 gl-transitions shaders. Guide
  • Neumorphic effect. Raised, Inset and Flat soft-UI shadows for about 50 controls, switchable globally or per control. Usage guide
  • Accessibility. Screen reader names and states for controls that show state visually, keyboard navigation, reduced motion and high contrast.
  • Localization. Twelve languages with runtime switching and localizable theme names. Guide
  • Demo apps. A Gallery with live examples of every control for desktop, browser, Android and iOS, Flowery Photos, a desktop photo viewer and editor, and Flowery Kiosk, a self-running slideshow of themed control demos.
  • Tests. Headless unit tests and runtime tests that run in a real desktop window.
  • Framework. The libraries target .NET 10 and Avalonia 12.

Documentation

📖 View the full documentation - Browse all controls with properties, enum values, and XAML usage examples. Also consult the Gallery's extensive example collection for code examples and comments!

Quick Start

  1. Install the NuGet package:
dotnet add package Flowery.NET --version 4.0.0

For the optional Kanban board package, also install:

dotnet add package Flowery.NET.Kanban --version 4.0.0

For the live glass blur, liquid-glass optics and animated shader backgrounds of the DaisyGlass controls, also install the SkiaSharp effects package and register it at startup with FlowerySkia.Register() (or UseFlowerySkia() on the AppBuilder), both in the Flowery.Skia namespace. Without it, a glass with BlurMode="SkiaSharp" uses the bitmap capture blur:

dotnet add package Flowery.NET.Skia --version 4.0.0
using Flowery.Skia;

public static AppBuilder BuildAvaloniaApp()
    => AppBuilder.Configure<App>()
        .UsePlatformDetect()
        .UseFlowerySkia();

The same package contains the GL carousel effects (CarouselGlEffectHost in Flowery.Effects), which need no registration. See GL carousel effects.

It also has font collections for apps that run optimized code: published with ReadyToRun or NativeAOT, or with the font code made hot by the JIT. When a font has no face for a requested weight or style, such as italic Inter, Avalonia makes a bold or oblique stand-in by reading the font through a Skia stream that optimized code can free during the read, which ends the app with an access violation. Use WithSafeInterFont() in place of WithInterFont(), and SafeEmbeddedFontCollection in place of EmbeddedFontCollection for your own fonts:

AppBuilder.Configure<App>()
    .UsePlatformDetect()
    .WithSafeInterFont()
    .ConfigureFonts(fonts => fonts.AddFontCollection(
        new SafeEmbeddedFontCollection(new Uri("fonts:MyApp"), new Uri("avares://MyApp/Assets/Fonts"))));

Upgrading from 3.x: Flowery.NET 4.0 no longer references Avalonia.Skia. It references SkiaSharp only through Svg.Skia, which draws the SVG pattern assets of DaisyPatternedCard; build Flowery.NET from source with -p:FlowerySvgPatterns=false to leave it out.

  • DaisyPatternedCard shows its SVG pattern assets by default, in its Foreground as before; set PatternMode="Tiled" for the generated tiles of 3.x.
  • Apps that use the live glass blur (BlurMode="SkiaSharp", which the glass themes and DaisyGlassSurface use by default) add Flowery.NET.Skia and register it as above. Without it, the glass falls back to the bitmap capture blur and Avalonia logs a warning once.
  • Apps that use SkiaSharp themselves, which they got through Flowery.NET before, add their own Avalonia.Skia or SkiaSharp reference.
  • The public types SkiaBackdropBlurDrawOperation and SkiaBlurHelper are gone; nothing in Flowery.NET used them.
  1. Add to your App.axaml:
<Application.Styles>
    <FluentTheme />
    <daisy:DaisyUITheme />
</Application.Styles>
  1. Use controls in your views:
xmlns:controls="clr-namespace:Flowery.Controls;assembly=Flowery.NET"

<controls:DaisyButton Content="Primary Button" Variant="Primary" />
<controls:DaisyInput Watermark="Type here" Variant="Bordered" />
<controls:DaisyThemeDropdown Width="220" />

📖 Full Installation & Theming Guide - Detailed setup, theme switching, persistence, and custom theme loading.


Components

Actions

  • Button (DaisyButton): Buttons with variants (Primary, Secondary, Accent, Ghost, Link) and sizes (Large, Normal, Small, Tiny). Supports Outline and Active states.
  • Fab (DaisyFab): Floating Action Button (Speed Dial) with support for multiple actions.
  • Modal (DaisyModal): Dialog box with backdrop overlay.
  • Swap (DaisySwap): Toggle control that swaps between two content states with optional Rotate/Flip effects.

Data Display

  • Accordion (DaisyAccordion): Group of collapse items that ensures only one item is expanded at a time.
  • Alert (DaisyAlert): Feedback messages (Info, Success, Warning, Error).
  • Avatar (DaisyAvatar): User profile image container (Circle, Square) with online/offline status indicators.
  • Avatar Group (DaisyAvatarGroup): Groups multiple avatars with automatic overflow into "+N" placeholder.
  • Badge (DaisyBadge): Small status indicators (Primary, Secondary, Outline, etc.).
  • Card (DaisyCard): Content container with padding and shadow.
  • Clock (DaisyClock): Multi-mode time control with Clock, Timer, and Stopwatch modes.
  • Carousel (DaisyCarousel): Scrollable container for items.
  • Chat Bubble (DaisyChatBubble): Message bubbles with header, footer, and alignment (Start/End).
  • Collapse (DaisyCollapse): Accordion/Expander with animated arrow or plus/minus icon.
  • Countdown (DaisyCountdown): Monospace digit display.
  • Diff (DaisyDiff): Image comparison slider (Before/After).
  • Hover Gallery (DaisyHoverGallery): Image/Content gallery driven by mouse hover position.
  • Kbd (DaisyKbd): Keyboard key visual style.
  • List (DaisyList, DaisyListRow, DaisyListColumn): Vertical list layout with flexible row structure. Supports grow columns and wrapped content.
  • Number Flow (DaisyNumberFlow): High-quality numeric display with individual digit scrolling animations. Inspired by SmoothUI.
  • Stat (DaisyStat): Statistics block with Title, Value, and Description.
  • Table (DaisyTable): Styled items control for tabular data.
  • Text Rotate (DaisyTextRotate): Animated text that cycles through items with configurable duration and pause-on-hover.
  • Timeline (DaisyTimeline): Vertical list of events with connecting lines.

Data Input

  • Checkbox (DaisyCheckBox): Checkbox with themed colors.
  • File Input (DaisyFileInput): Styled button/label for file selection.
  • Input (DaisyInput): Text input field with variants (Bordered, Ghost, Primary, etc.).
  • PasswordBox (DaisyPasswordBox): Themed password input with reveal toggle, labels, helper text, and icon slots.
  • Radio (DaisyRadio): Radio button with themed colors.
  • Range (DaisyRange): Slider control.
  • Rating (DaisyRating): Star rating control with interactivity and partial fill support.
  • Select (DaisySelect): ComboBox with themed styles.
  • Textarea (DaisyTextArea): Multiline text input.
  • Toggle (DaisyToggle): Switch toggle control.
  • Slide to Confirm (DaisySlideToConfirm): Drag-to-confirm interaction control with variants and auto-reset support.

Layout

  • Divider (DaisyDivider): Separation line with optional text.
  • Drawer (DaisyDrawer): Sidebar navigation with overlay (inherits SplitView).
  • Hero (DaisyHero): Large banner component.
  • Join (DaisyJoin): container that groups children (buttons/inputs) by merging their borders.
  • Patterned Card (DaisyPatternedCard): Decorative card with pattern backgrounds and corner ornaments.
  • Stack (DaisyStack): container that stacks children visually with offsets.

Navigation

  • Breadcrumbs (DaisyBreadcrumbs): Navigation path with separators.
  • Dock (DaisyDock): Bottom navigation bar (macOS-style dock) with item selection events.
  • Menu (DaisyMenu): Vertical or horizontal list of links/actions.
  • Navbar (DaisyNavbar): Top navigation bar container.
  • Pagination (DaisyPagination): Group of buttons for page navigation.
  • Steps (DaisySteps): Progress tracker steps.
  • Tabs (DaisyTabs): Tabbed navigation (Bordered, Lifted, Boxed).

Feedback & Utils

  • Indicator (DaisyIndicator): Utility to place a badge on the corner of another element.

  • Status Indicator (DaisyStatusIndicator): Status indicator with 33 variants including animation and glyph modes (battery, traffic lights, WiFi, cellular). Supports all theme colors and 5 sizes.

  • Loading (DaisyLoading): Animated loading indicators with 48 variants (extended from DaisyUI's original 6) across 6 categories:

    • Classic: Spinner, Dots, Ring, Ball, Bars, Infinity
    • Terminal-inspired: Orbit, Snake, Pulse, Wave, Bounce
    • Matrix/Colon-dot: Matrix, MatrixInward, MatrixOutward, MatrixVertical
    • Special effects: MatrixRain, Hourglass, SignalSweep, BitFlip, PacketBurst, CometTrail, Heartbeat, TunnelZoom, GlitchReveal, RippleMatrix, CursorBlink, CountdownSpinner
    • Business: DocumentFlipOn, DocumentFlipOff, MailSend, CloudUpload, CloudDownload, DocumentStamp, DocumentReject, ChartPulse, CalendarTick, ApprovalFlow, BriefcaseSpin, BatteryCharging, BatteryEmptying, TrafficLightUp, TrafficLightRight, TrafficLightDown, TrafficLightLeft
    • Win95 retro: Win95FileCopy, Win95Delete, Win95Search, Win95EmptyRecycle
  • Mask (DaisyMask): Applies shapes (Squircle, Heart, Hexagon, etc.) to content.

  • Mockup (DaisyMockup): Frames for Code, Window, or Browser.

  • Progress (DaisyProgress): Linear progress bar.

  • Radial Progress (DaisyRadialProgress): Circular progress indicator.

  • Skeleton (DaisySkeleton): Animated placeholder for loading states.

  • Toast (DaisyToast): Container for stacking alerts (fixed positioning).

  • Tooltip: Themed standard Avalonia ToolTip.

Theme Controls

  • Size Dropdown (DaisySizeDropdown): Global size selector with localized size names and customizable options.
  • Theme Controller (DaisyThemeController): Flexible toggle with multiple modes (Toggle, Checkbox, Swap, ToggleWithText, ToggleWithIcons).
  • Theme Dropdown (DaisyThemeDropdown): Dropdown to select from all 37 built-in themes.
  • Theme Manager (DaisyThemeManager): Static class for programmatic theme control, with a base color that changes the base of any theme at run time (BaseOverride) and a run-time backdrop (BackdropOverride).
  • Theme Backdrop (DaisyBackdrop): The backdrop of the theme as the lowest layer of a window: a color, gradient, drawing or image and an optional animated effect, which switch with the theme.
  • Product Theme Dropdown (DaisyProductThemeDropdown): Dropdown for selecting product-specific theme palettes.
  • Theme Radio (DaisyThemeRadio): Radio button for theme selection.
  • Theme Swap (DaisyThemeSwap): Toggle button with animated sun/moon icons.

✨ Flowery.NET Exclusives

Beyond DaisyUI - The following features and controls are not part of the original DaisyUI CSS specification. They are unique to Flowery.NET, built natively for Avalonia, inspired by other great open source projects.

Accessibility

Controls that convey state visually include built-in screen reader support via AccessibleText:

<daisy:DaisyLoading Variant="Spinner" AccessibleText="Loading your profile" />
<daisy:DaisyStatusIndicator Color="Success" />
<daisy:DaisyProgress Value="45" AccessibleText="Upload progress" />

Supported custom peers: DaisyLoading, DaisyProgress, DaisyRadialProgress, DaisyStatusIndicator, DaisyCountdown, DaisySkeleton, DaisyRating, and DaisyNumberFlow.

Composite inputs such as DaisyPasswordBox, DaisyNumericUpDown, and DaisyOtpInput forward UI Automation names, help text, labels, required state, and caller-provided automation IDs to their focusable template children. Icon-only navigation and value-action buttons also expose explicit accessible names.

Utility Controls

  • Animated Number (DaisyAnimatedNumber): Animated numeric display with slide transitions on value changes.
  • Button Group (DaisyButtonGroup): new segmented button-group container for joined buttons and non-clickable parts.
  • Component Sidebar (FloweryComponentSidebar): Pre-built documentation/admin sidebar with categories and search.
  • Contribution Graph (DaisyContributionGraph): A yearly contribution heatmap with seven weekday rows and enough week columns for every date, plus labels, tooltips, and a legend.
  • Copy Button (DaisyCopyButton): Copy-to-clipboard button with temporary success state feedback.
  • Dropdown (DaisyDropdown): Menu-style dropdown (Popup + DaisyMenu) for action menus.
  • Expandable Card (DaisyExpandableCard): Card that expands to reveal secondary content with smooth width animation.
  • Expander (DaisyExpander): Section with a clickable header, a chevron and separate header and content padding.
  • Icon Text (DaisyIconText): Reusable icon + text composition control with placement, sizing, and spacing options.
  • Modifier Keys (DaisyModifierKeys): Visualizes keyboard modifiers (Shift, Ctrl, Alt) and locks.
  • Number Flow (DaisyNumberFlow): High-quality numeric display with individual digit scrolling animations. Inspired by SmoothUI.
  • OTP Input (DaisyOtpInput): Multi-slot verification-code/OTP input with animated focus transitions and auto-advance.
  • Popover (DaisyPopover): Popup-based popover control for rich hover/click content.
  • Scheduler (DaisyScheduler): Calendar and resource planning with seven views, appointment editing requests, tooltips, and data tiles. Documentation
  • Tag Picker (DaisyTagPicker): Multi-select chip/tag picker with add/remove icons.
  • Tour (DaisyTour): Guided tour over the live controls of a window, with highlights, annotations, a step card and a style editor (DaisyTourEditor). Documentation

Kanban Board

Flowery.NET.Kanban is a separate companion package containing the complete native Avalonia Kanban project. It includes board, home, archive, statistics, filtering, swimlane, WIP-limit, bulk-edit, JSON-persistence, keyboard, zoom, and drag-and-drop workflows. Board landmarks, cards, columns, form fields, and icon-only tool buttons expose localized UI Automation names and stable IDs where the element has a durable identity.

The complete Kanban feature overview describes all board features and gives plain guidance for the assignee API.

Add its styles after DaisyUITheme:

<Application.Styles>
    <daisy:DaisyUITheme />
    <StyleInclude Source="avares://Flowery.NET.Kanban/Themes/Generic.axaml" />
</Application.Styles>

Then use the board control in a view:

xmlns:kanban="clr-namespace:Flowery.NET.Kanban.Controls;assembly=Flowery.NET.Kanban"

<kanban:FlowKanban Board="{Binding Board}" />

Glass Effect

  • Glass (DaisyGlass): Glassmorphism/frosted effect container with multiple blur modes (Simulated, BitmapCapture, SkiaSharp GPU-accelerated).
  • Glass on the standard controls: glass themes for DaisyButton, DaisyBadge, DaisyInput, DaisyNavbar, DaisyModal, DaisyButtonGroup (a segmented control with a sliding pill), DaisyRange (a thumb that turns into a lens), DaisyToggle and DaisyMenu, and DaisyGlassSurface, which puts any input control on the same live glass. The dark Glassy theme tints them navy.

GL Carousel Effects

  • Effect host (CarouselGlEffectHost, Flowery.NET.Skia): 51 carousel transitions and effects drawn with SkSL shaders on Windows, Linux, macOS, in the browser, on Android and on iOS: masks, blinds, slices, checkerboard, spiral, matrix rain, wormhole, dissolve, pixelate, flips and cubes, fades, slides, pushes, zooms, covers, reveals and wipes, pan, zoom, drift, pulse, breath and throw effects, and a text fill. Documentation
  • Custom engines: CarouselGlNativeHost and CarouselGlEngine host your own SkSL programs and images, with frame read-back for tests.
  • Gallery: the Carousel GL page previews the effects in manual, slideshow, random and kiosk modes; the Carousel GL Transitions page plays the 100 gl-transitions shaders, ported to SkSL.

Neumorphic Effect

DaisyNeumorphic gives controls a soft-UI look: surfaces appear raised from, or pressed into, the background. It is drawn with Border.BoxShadow and works the same on every platform.

  • Modes: Raised, Inset and Flat, set globally (DaisyNeumorphic.GlobalMode) or per control.
  • Composite controls such as DaisyTable, DaisyList and DaisyButtonGroup draw one surface; their rows, cells and segments stay flat.
  • Theme-aware: shadow colors follow the current theme; high contrast turns the effect off.
  • Gallery: the sidebar's Neumorphic selector switches the mode for all controls, and Effects > Neumorphic Effect shows the controls side by side with their own mode and intensity selector.
<controls:DaisyCard controls:DaisyNeumorphic.Mode="Inset">
    <TextBlock Text="Pressed-in card" />
</controls:DaisyCard>
DaisyNeumorphic.GlobalMode = DaisyNeumorphicMode.Raised;

See the Neumorphic guide for scopes, colors and how to add the effect to custom controls.

Color Picker Suite

A complete suite rebuilt natively for Avalonia with DaisyUI styling, inspired by Cyotek's ColorPicker:

  • Color Wheel (DaisyColorWheel): Circular HSL color wheel.
  • Color Grid (DaisyColorGrid): Grid-based palette selector.
  • Color Slider (DaisyColorSlider): Channel-specific sliders (R/G/B/A/H/S/L).
  • Color Editor (DaisyColorEditor): Comprehensive RGB/HSL editor.
  • Screen Color Picker (DaisyScreenColorPicker): Eyedropper tool (Windows only).
  • Color Picker Dialog (DaisyColorPickerDialog): Full-featured modal dialog with Undo and Redo for the latest 50 color values.

Date Timeline

A horizontal scrollable date picker inspired by FadyFayezYounan's easy_date_timeline:

  • Date Timeline (DaisyDateTimeline): Scrollable date picker with selectable date items. Supports multiple header types (MonthYear, Switcher, None), sizes, disable strategies, and marked dates with tooltips.
  • Date Timeline Item (DaisyDateTimelineItem): Individual date cell with day name, date number, and month. Supports selection, disable states, and marker highlights.

Scheduler

DaisyScheduler provides Day, Week, Month, Agenda, resource Planner, horizontal Timeline, and Calendar views with Flowery themes and size tiers. Calendar combines a month navigator with week numbers and a scrollable daily list filtered by resource kind. The control reports move, resize, creation, and deletion requests to the host. The Gallery demo is available under Custom Controls → Scheduler. Navigation, settings, empty states, and accessible names follow the selected language at runtime. Typed resources support occupancy queries by week or time range. The Timeline supports named, collapsible groups with kind filters and host-defined criteria such as departments. The editor supports continuous or daily spans, overlap confirmation, and an optional color palette. Week rules, editor time intervals, regional conventions, and 12/24-hour clocks are configurable.

<controls:DaisyScheduler CurrentView="Month" Size="Medium" />
<controls:DaisyScheduler CurrentView="Planner"
                         Appointments="{Binding Appointments}"
                         SchedulerResources="{Binding Resources}" />

See DaisyScheduler for usage and the MIT source attribution.

DaisyTabs Color Features

  • Per-tab palette colors: DaisyTabs supports a theme-independent color palette (12 fixed colors) via TabPaletteColor, designed for end users (Purple, Indigo, Pink, SkyBlue, Blue, Lime, Green, Yellow, Orange, Red, Gray, Default).
  • Inline color picker: Optional tab context menu shows a two-row dot grid for quick color changes and reset (hollow dot), without leaving the tab strip.
  • Semantic colors (optional): For apps that want colors to follow the active theme, TabColor exposes the semantic Daisy colors (Primary, Success, etc.) as an alternative API.

Mask Input

  • Mask Input (DaisyMaskInput): Masked input for structured values (time, expiry date, card number, CVC) with Mode presets and localized auto-watermarks.

Numeric Input

  • Numeric Up/Down (DaisyNumericUpDown): Advanced numeric input with 6 number bases (Decimal, Hex, Binary, Octal, ColorHex, IPv4). Features real-time filtering, thousand separators, prefix/suffix display.

Responsive Scaling

Automatic font scaling system for responsive UIs that adapt to window size:

  • FloweryScaleManager: Opt-in automatic font scaling for all Daisy controls within a container.
  • ScaleExtension: XAML markup extension for manual scaling of individual properties.
  • IScalableControl: Interface for custom controls to support auto-scaling.
xmlns:services="clr-namespace:Flowery.Services;assembly=Flowery.NET"

<!-- Opt-in: All child Daisy controls auto-scale their fonts -->
<UserControl services:FloweryScaleManager.EnableScaling="True">
    <controls:DaisyInput Label="Street" />  <!-- Scales automatically! -->
    <controls:DaisyButton Content="Save" /> <!-- Scales automatically! -->
</UserControl>

<!-- Manual scaling for individual properties -->
<TextBlock FontSize="{services:Scale FontTitle}" />

Visual Effects

Cross-platform visual effects collection (WASM-compatible). See Effects for full documentation.

  • CursorFollowBehavior: Spring-physics cursor follower element.
  • RevealBehavior: Fade-in + slide animation on element attach.
  • ScrambleHoverBehavior: Random character scramble on hover, resolves left-to-right.
  • ScrollRevealBehavior: Viewport-aware reveal animations (triggers RevealBehavior when element enters scroll viewport).
  • TypewriterBehavior: Sequential character reveal animation (typewriter effect).
  • WaveTextBehavior: Infinite sine wave animation on text (supports per-character ripple).
xmlns:fx="clr-namespace:Flowery.Effects;assembly=Flowery.NET"

<Border fx:RevealBehavior.IsEnabled="True" fx:RevealBehavior.Direction="Bottom"/>
<TextBlock fx:ScrambleHoverBehavior.IsEnabled="True" Text="Hover Me!"/>
<TextBlock fx:TypewriterBehavior.IsEnabled="True" Text="Hello World"/>

Weather Widgets

Weather display widgets with animated condition icons:

  • Weather Icon (DaisyWeatherIcon): Animated weather condition icon.
  • Weather Card (DaisyWeatherCard): Composite widget with current, forecast, and metrics.
  • Weather Current (DaisyWeatherCurrent): Current temperature and conditions.
  • Weather Forecast (DaisyWeatherForecast): Daily forecast strip.
  • Weather Metrics (DaisyWeatherMetrics): UV, wind, humidity display.

Control Template Guidelines

For contributors creating or modifying control templates:

Background Border Architecture

Background borders should be siblings of content, not parents:

<!-- ✅ Correct: Border and content are siblings -->
<Panel>
    <Border x:Name="PART_Background" Background="{TemplateBinding Background}" />
    <ContentPresenter Content="{TemplateBinding Content}" />
</Panel>

<!-- ❌ Avoid: Content nested inside border -->
<Border Background="{TemplateBinding Background}">
    <ContentPresenter Content="{TemplateBinding Content}" />
</Border>

Opacity Guidelines

  • Never set Opacity on containers holding text
  • Use separate background layers for disabled/hover states
  • For disabled states, reduce opacity on PART_Background only

Gallery App Architecture

The Gallery demo application uses a multi-platform architecture to showcase Flowery.NET controls across different platforms:

Project Description
Flowery.NET.Kanban Reusable Kanban controls, models, dialogs, localization, and persistence
Flowery.NET.Gallery Shared library containing all UI, views, and examples
Flowery.NET.Gallery.Desktop Desktop host for Windows, Linux, and macOS
Flowery.NET.Gallery.Browser WebAssembly host for running in browsers
Flowery.NET.Gallery.Android Android mobile app
Flowery.NET.Gallery.iOS iOS mobile app (requires macOS to build)

The shared library contains the MainView UserControl with all the demo content, while each platform host provides the entry point and platform-specific configuration. This architecture ensures the same UI runs consistently across all supported platforms.

Running the Gallery:

# Desktop (Windows/Linux/macOS)
dotnet run --project Flowery.NET.Gallery.Desktop

# Browser (WebAssembly)
dotnet run --project Flowery.NET.Gallery.Browser

# Android (requires Android SDK)
dotnet build Flowery.NET.Gallery.Android -f net10.0-android36.0

Flowery Photos

Flowery Photos is a desktop photo viewer and editor built with Avalonia 12, Daisy controls, and SkiaSharp. It includes a folder library, albums, favorites, a virtualized gallery, and non-destructive image edits. Themes, control sizes, and all twelve languages change at runtime.

dotnet run --project Flowery.NET.Photos.Desktop

Flowery Kiosk

Flowery Kiosk is a desktop demo for Windows, Linux and macOS that cycles through six themed slides of Daisy controls every eight seconds. The arrow keys move between the slides; --manual turns autoplay off.

dotnet run --project Flowery.NET.Kiosk.Desktop

Build & Run Scripts (PowerShell)

The scripts/ folder contains PowerShell helpers for common build and run workflows:

  • Build scripts:
    • scripts/build_all.ps1: Builds the full solution/projects
    • scripts/build_desktop.ps1: Builds the Desktop gallery host
    • scripts/build_android_apks.ps1: Publishes ABI-specific Android Gallery APKs
    • scripts/build_nuget.ps1: Builds/packaging workflow for NuGet output
  • Run scripts:
    • scripts/run-desktop.ps1: Runs the Desktop gallery host
    • scripts/run-browser.ps1: Runs the Browser (WASM) gallery host
    • scripts/run-android.ps1: Runs/builds the Android gallery host (requires Android SDK and running emulator!)
  • Test scripts:
    • scripts/test_runtime.ps1: Runs the runtime UI tests on Windows, Linux or macOS (Linux needs a display, such as xvfb-run). They render every control and Gallery page in a real desktop window and check the pixels, for example that shadows and theme colors reach the screen. Photosensitivity warning: the test window flashes rapidly while the tests run; see scripts/README.md.
    • scripts/test_kiosk.ps1: Runs the smoke run of the Kiosk app in its desktop window on Windows, Linux or macOS and checks its report.

For details and parameters, see scripts/README.md.

Technical Requirements

To use the library:

  • .NET 10.0 or later
  • Avalonia UI 12.0 or later

To build from source:

  • .NET 10.0 SDK or later
  • Visual Studio 2022, JetBrains Rider, or VS Code
  • Windows, macOS, or Linux

Windows SmartScreen Warning

When running the Gallery app for the first time, you may see a SmartScreen warning (app is not code-signed).

To run: Click "More info" → "Run anyway"

Or: Right-click .exe → Properties → Check "Unblock" → OK

License

MIT

Support

If you find this library useful, consider supporting its development:

Buy Me A Coffee Ko-Fi

Changelog

See CHANGELOG.md for version history and release notes.

Credits & References

  • Avalonia UI - The cross-platform UI framework.
  • DaisyUI - The original Tailwind CSS component library.
  • Avalonia.Fonts.Inter - The font used in the gallery.
  • Cyotek ColorPicker - Inspiration for color picker controls.
  • Easy Date Timeline - Inspiration for date timeline controls.
  • XtremeCRM/Xtreme.Components by russshumate - MIT-licensed source of the scheduler adapted as DaisyScheduler.
  • smoothui - Inspiration for visual effects (React/Tailwind/Framer Motion).
  • liquid-glass - Kudos to Sam Asante for the Liquid Glass optics reference that inspired the DaisyGlass SkiaSharp lens parameters.
  • gl-transitions - The transition shaders that the Gallery's Carousel GL Transitions page plays, ported to SkSL; each shader names its author and license (MIT or BSD).
  • @frandelfo - Multi-platform Gallery architecture (Desktop, Browser, Android, iOS).

Disclaimer: This project is not affiliated with, endorsed by, or sponsored by any of the above.

Releases

Sponsor this project

Used by

Contributors

Languages