Show Off: Crossplatform UI Framework + Thank You to SkiaSharp

BrettBarrettBrettBarrett USMember ✭✭
edited November 2017 in SkiaSharp

After almost a years worth of part time work, I now have my cross platform, react native like UI framework in a state where I could "Show Off". There is likely another years worth of polish and feature additions needed before I could publish my work. Still fun to show off at this stage.

Thank you to the SkiaSharp team for making it a reality since the libraries availability is what started the dream which is becoming reality.

The Dream:

  • Ability to write applications in .NET Standard 2.0 C# code which could run cross platform on Android, iOS(powered by Xamarin) and Windows, Mac, Linux (powered by .NET core).
  • Tired of MvvM and bindings.... Drinking the "React style functional composition based component architecture" koolaid.
  • Tired of coding UI's in different languages. (XAML/CS) or (HTML/JS)
  • Developer first KISS/'cut the fat' based principles and design.

The Progress:

  • Scheduler for Building, Layout, and Rendering Components.
  • Component based build process. Similar to 'flutter' Build or how 'React' uses the Render function.
  • Facebook YOGA based flexbox component layout.
  • SkiaSharp Renderer and Compositor. (Rendering, Clipping)
  • Full SVG Rendering Capability
  • Bubble and Tunnel Events (Click/Touch, Keyboard, mousewheel) and 'focus'
  • Basic Components (Checkbox, ToggleBox, TextBlock, TextBox, ScrollBox, Rows, Columns)
  • Interface projects for routing Xamarin.Forms and Winforms host to the UI Framework.
  • Theme Support

The Todo List:

  • Animation
  • Gestures
  • Some more basic component implementation and fleshing out ones I have.
  • Advanced text layout concepts. This is a big problem for me right now since proper text layout engine is tough to build and cant find an existing engine in c# or cross-platform implementation with c# bindings.
  • Complete interface wrappers for additional functionality.

The Pictures:

Customer View:

Developer View:


  • BrettBarrettBrettBarrett USMember ✭✭

    Here is a tiny video for a debug test bed as well:

  • Very nice!

  • voidvoid DKBeta ✭✭✭
  • AndyDentAndyDent AUMember ✭✭

    Firstly, massive congratulations - I've written a cross-platform framework before, actually more of a port, where I escaped some of the heavy lifting by using the internals of MFC underneath. (Yes it was that long ago!).

    I'm very interested in your progress, not just because of my decades of cross-platform framework use but also a big fan of SkiaSharp - I used it for our RealmDraw sample and since in my other projects.

    I'm not a believer in following heavy architectures for their own sake but I suggest you think twice about throwing our Binding alongside MVVM. The two are not inextricably linked and building in some binding mechanism can make a framework vastly easier to use. Binding is one of those inescapable things - if you don't provide a way to do it then people are doomed to somehow copy data around.

    Are you looking for a text layout engine or a word processing/editor control or both? They are very different things.

    For the sake of accessibility, I suggest trying to use native entry controls wherever possible.

  • BrettBarrettBrettBarrett USMember ✭✭


    Thanks. Not sure if you have read the react literature but react basically replaces bindings with another approach, now considered the 'react' way of thinking. Its basically an alternative implementation to solving the problems we traditionally have used bindings for. So they should not be needed.

    I'm still looking for a text layout engine, I'm off the belief I'll need to role my own unfortunately since I can't find a cross platform one what would be usable from c#. Which means I'll likely just have simple/basic English text formatting with some limited options.

    I plan to in the middle of 2018 or earlier depending on progress post a link to github with the above released as an open source project. There is still a lot changing in the hood to open source it now but I'm definitely "getting there".

  • blazespinnakerblazespinnaker CAMember

    Brett, can you be more specific about the "other approach"? There is two way binding in React, AFAIK.

Sign In or Register to comment.