📕 Documentation 👈
Replace native controls with a Skia Canvas! 🤩 On iOS, MacCatalyst, Android, Windows with hardware acceleration.
Rendering engine with an enhanced layout system, gestures and animations powered by SkiaSharp.
- To use inside a usual MAUI app, consume drawn controls by wrapping inside
Canvasviews. - To create a totally drawn app with just one
Canvasas root view, useSkiaShell+SkiaViewSwitcherfor navigation between screens with modals, popups, toasts etc. - Drawn controls are totally virtual, no native views/handlers.
- Design in XAML or code-behind
- Free to use under the MIT license, a nuget package is available.
Current development state is ALPHA for prod.
This is a rendering engine for creating and rendering your own controls, pre-shipped are here for a quick start.
- Draw with helpers using SkiaSharp with hardware acceleration
- Create your own animated pixel-perfect controls
- Port existing native controls to be drawn
- Design in XAML or code-behind
- 2D and 3D Transforms
- Visual effects for every control, filters and shaders
- Animations targeting max FPS
- Caching system for faster re-drawing
- Optimized for performance, rendering only visible elements, recycling templates etc
- Gestures support for anything, panning, scrolling, zooming etc
- Keyboard support, track any key
- Navigate on canvas with familiar MAUI Shell techniques
- The nuget package
DrawnUi.Mauireplaces the old package Id, you can still use the old one kept for compatibility for some time. - Docs, first appearence inside
/docs! To teach LMs use/aidocssubfolder. - Windows x64 doesn't require MSIX mode anymore, thanks to Tommi Gustafsson
SkiaCamerainside DrawnUi.Maui.Camera: iOS, MacCatalyst, Windows, Android implementations.SkiaShapenow can contain manyChildreninstead of oneContent. Plus fixes for stroke and other for pixel-perfect rendering.SkiaImagerescaling quality fix after for skia v3.SkiaScrolladded additional mouse wheel support for scrolling on windows, added FirstVisibleIndex, LastVisibleIndex props- Stack and absolute layouts now correctly apply one-directional
Fillof children, might break some legacy UIs (or might not).MarginsandPaddingnow work properly everywhere. - Can override virtual
OnMeasuring, whileMeasureis not virtual anymore to assure faster screen creation and avoid re-measurements when initializing for the first time. - Performance and safety optimizations for accelerated rendering handlers (
SkiaViewAccelerated:SKGLView) on all platforms. - Windows accelerated handler is now synched with display when its refresh rate is >=120.
- Frame time interpolator adjustments for DrawnUi.Maui.Game.< 8000 /li>
- Many other silent fixes and new properties/features.
- Example apps updated to align with changes.
Please star ⭐ if you like it!
-
Base drawn controls
- SkiaControl Your lego brick to create anything
- SkiaShape Path, Rectangle, Circle, Ellipse, Gauge etc, can wrap other elements to be clipped inside
- SkiaLabel, multiline with many options like dropshadow, gradients etc
- SkiaImage with many options and filters
- SkiaSvg with many options
- SkiaLayout (Absolute, Grid, Vertical stack, Horizontal stack, todo Masonry) with templates support
- SkiaScroll (Horizontal, Vertical, Both) with header, footer, zoom support and adjustable inertia, bounce, snap and much more. Can act like a collectionview with custom refresh indicator, load more etc
- SkiaHotspot to handle gestures in a lazy way
- SkiaBackdrop to apply effects to background below, like blur etc
- SkiaMauiElement to embed maui controls in your canvas
-
Custom controls derived from base ones
- SkiaRichLabel, will find an installed font for any unicode text and auto-create spans for markdown
- SkiaButton include anything inside, text, images etc
- SkiaRadioButton select something unique from options
- SkiaSwitch to be able to toggle anything
- SkiaProgress to show that your are actually doing something
- SkiaSlider incuding range selection capability
- SkiaLottie with tint customization
- SkiaGif a dedicated lightweight GIF-player with playback properties
- SkiaMediaImage a subclassed
SkiaImagefor displaying any kind of images (image/animated gif/more..) - SkiaCamera that day we draw it on the canvas has finally come
- SkiaScrollLooped a subclassed
SkiaScrollfor neverending scrolls - SkiaDecoratedGrid to draw shapes between rows and columns
- RefreshIndicator can use Lottie and anything as ActivityIndicator or for your scroll RefreshView
- SkiaDrawer to swipe in and out your controls
- SkiaCarousel swipe and slide controls inside a carousel
- SkiaWheelPicker your iOS-look picker wheel
- SkiaSpinner to test your luck
- SkiaHoverMask to overlay a clipping shape
- SkiaShell for navigation inside a drawn app
- SkiaViewSwitcher switch your views, pop, push and slide
- SkiaTabsSelector create top and bottom tabs
- SkiaLabelFps for developement
- Other we hidden deep but still public
- Create your own!
-
Animated Effects
- Ripple
- Shimmer
- BlinkColors
- Commit yours!
-
Transforms
- TranslationX
- TranslationY
- TranslationZ (none-affine)
- ScaleX
- ScaleY
- Rotation
- RotationX (none-affine)
- RotationY (none-affine)
- RotationZ (none-affine)
- SkewX
- SkewY
- Perspective1
- Perspective2
-
Keyboard support for desktop platforms.
- Not just accelerators, but full keyboard support, usage example inside SpaceShooter game below. :)
- .NET 9 only, Maui.Controls 9.0.70 minimum.
- All files to be consumed (images etc) must be placed inside the MAUI app Resources/Raw folder, subfolders allowed. If you need to load from the native app folder use prefix "file://".
- By default the main branch should be targeting NET 9 and use SkiaSharp v3.
- Accessibility support is compatible and is on the roadmap.
Click here ☝️☝️☝️