NXUI (next-gen UI)

Creating minimal Avalonia next generation (NXUI, next-gen UI) application using C# 10 and .NET 8

https://user-images.githubusercontent.com/2297442/132313187-32f18c4b-e894-46db-9a9d-9de02f30835e.mp4

Requisites

NXUI

<PackageReference Include="NXUI" Version="11.1.0" />

or for F# support:

<PackageReference Include="NXUI.FSharp" Version="11.1.0" />

Additionally, depending on the application type:

Desktop

For Desktop extensions:

<PackageReference Include="NXUI.Desktop" Version="11.1.0" />

or using plain Avalonia:

<PackageReference Include="Avalonia.Desktop" Version="11.1.0" />

Browser

<PackageReference Include="Avalonia.Browser" Version="11.0.0" />

dotnet workload install wasm-tools

Usage

Window Build() => Window().Content(Label().Content("NXUI"));

AppBuilder.Configure<Application>()
  .UsePlatformDetect()
  .UseFluentTheme()
  .StartWithClassicDesktopLifetime(Build, args);

var count = 0;

Window Build()
  => Window(out var window)
    .Title("NXUI").Width(400).Height(300)
    .Content(
      StackPanel()
        .Children(
          Button(out var button)
            .Content("Welcome to Avalonia, please click me!"),
          TextBox(out var tb1)
            .Text("NXUI"),
          TextBox()
            .Text(window.BindTitle()),
          Label()
            .Content(button.ObserveOnClick().Select(_ => ++count).Select(x => $"You clicked {x} times."))))
    .Title(tb1.ObserveText().Select(x => x?.ToUpper()));

AppBuilder.Configure<Application>()
  .UsePlatformDetect()
  .UseFluentTheme()
  .WithApplicationName("NXUI")
  .StartWithClassicDesktopLifetime(Build, args);

Minimalistic Desktop app:

Run(
  () => Window().Content(Label().Content("NXUI")), 
  "NXUI", 
  args, 
  ThemeVariant.Dark);

Generate

C#

cd src/Generator
dotnet run -- ../NXUI/Generated

F#

cd src/Generator
dotnet run -- ../NXUI.FSharp/Generated -fsharp