Loic.NeutroniumCore.Neutronium
1.0.0
dotnet add package Loic.NeutroniumCore.Neutronium --version 1.0.0
NuGet\Install-Package Loic.NeutroniumCore.Neutronium -Version 1.0.0
<PackageReference Include="Loic.NeutroniumCore.Neutronium" Version="1.0.0" />
<PackageVersion Include="Loic.NeutroniumCore.Neutronium" Version="1.0.0" />
<PackageReference Include="Loic.NeutroniumCore.Neutronium" />
paket add Loic.NeutroniumCore.Neutronium --version 1.0.0
#r "nuget: Loic.NeutroniumCore.Neutronium, 1.0.0"
#addin nuget:?package=Loic.NeutroniumCore.Neutronium&version=1.0.0
#tool nuget:?package=Loic.NeutroniumCore.Neutronium&version=1.0.0
<p align="center"><img width="100"src="./Deploy/logo.svg?sanitize=true"></p> <h1 align="center">Neutronium</h1>
https://neutroniumcore.github.io/Neutronium/
What is Neutronium?
Neutronium is a library to create .NET desktop applications using HTML, CSS and javascript.
Neutronium uses MVVM pattern exactly the same way as WPF application.
Neutronium provides bindings with Vue.js and Knockout.js to build powerful HTML5 UI.
Why Neutronium?
Use all the power of the javascript stack to build .NET desktop applications.
Easy to use:
- Architecture Neutronium application just like standard WPF application.
- Compatible with popular MVVM libraries such as MVVM Light Toolkit and reactiveUi
- Use standard javascript frameworks to build UI
Easy to set-up:
Solution template available for a quick start
Use javascript framework cli tools to use the same tool chain as web developmenet taking chance of tools such as live reload.
Reuse ViewModel designed for WPF with a different View Engine.
Build UI on a 100% Open Source Stack
Uses cases
Migrate an existing WPF MVVM application to Neutronium
Use Neutronium to embed an HTML control in an WPF application
Main features
Reactive to property and collection changes
Two way-binding beetween view and viewmodel, including command binding
Pluggable architecture:
- Easily plug-in new javascript frameworks or even embedded browser.
How?
- Neutronium combines Chromium via ChromiumFx C# lib and a binding engine that converts back and forth C# POCO to javascript POCO.
- Javascript objects are then used as ViewModel for javascript MVVM library such as knockout.js or Vue.js.
- Listeners are set-up on C# and javascript side for two-way binding.
On the shoulders of giants
<p align="center"> <a href="https://www.chromium.org" > <img height="60" src="https://www.chromium.org/_/rsrc/1438879449147/config/customLogo.gif?revision=3"> </a> <a href="https://bitbucket.org/chromiumembedded/cef"> <img height="70"src="https://bitbucket-assetroot.s3.amazonaws.com/c/photos/2015/Mar/14/3042045877-1-cef-logo_avatar.png"> </a> <a href="http://vuejs.org/"> <img height="70" style="margin-top: 10px;" src="http://vuejs.org/images/logo.png"> </a> <a href="http://knockoutjs.com/"> <img height="70" style="margin-top: 10px;" src="http://knockoutjs.com/img/ko-logo.png"> </a> </p>
Usage - Example
ViewModel (C#)
public class ViewModelBase : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
protected void Set<T>(ref T pnv, T value, string pn)
{
pnv = value;
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(pn));
}
}
public class Skill
{
public string Type { get;}
public string Name { get;}
public Skill (string name, string skillType)
{
Name = name;
Type = skillType;
}
}
public class Person: ViewModelBase
{
private string _LastName;
public string LastName
{
get { return _LastName; }
set { Set(ref _LastName, value, "LastName"); }
}
private string _Name;
public string Name
{
get { return _Name; }
set { Set(ref _Name, value, "Name"); }
}
public IList<Skill> Skills { get; private set; }
public ICommand RemoveSkill { get; private set; }
public Person()
{
Skills = new ObservableCollection<Skill>();
RemoveSkill = new RelayCommand<Skill>(s=> this.Skills.Remove(s));
}
}
View (HTML)
- First option: use Vue.js
<!doctype html>
<html>
<head>
<title>Vue.js Example</title>
</head>
<body>
<input type="text" v-model="viewModel.Name" placeholder="First name" >
<ul>
<li v-for="skill in viewModel.Skills">
<span>{{skill.Type}}:{{skill.Name}}</span>
<button @click="RemoveSkill.Execute(skill)">Remove skill</button>
</li>
</ul>
<div>
<h2>{{viewModel.Name}}</h2>
<h2>{{viewModel.LastName}}</h2>
</div>
</body>
</html>
Create the component(C# Xaml)
<Neutronium:HTMLViewControl Uri="pack://application:,,,/src/index.html" />
The binding is done on the DataContext property just as standard WPF, That's it!
Examples
Get started
Best way to start with Neutronium is to download template C# solution from visual studio gallery.
See Here for detailed instructions.
Complete Documentation
Comparison with other libraries:
-
Neutronium is electron for .NET? Well, kind of. Neutronium however is a higher abstraction so that you don't need to care about Chromium implementation such as renderer or browser processes.
-
Different from other libraries Awesomium is not open source. Last update was embedding Chrome 19 so it is pretty out of date. One neutronium distribution offer Awesomium as WebBrowser.
-
All are open source libraries presenting up-to-date C# binding for CEF
-
Offers all API of CEF. Used by Neutronium as a test WebBrowser using the mono-process option.
-
Same as CefGlue + remote API that handles communication between Chromium processes. Neutronium recommended set-up uses ChromiumFx as a WebBrowser.
-
Well documented and package solution (including nuget). Does not offer all CEF binding to javascript however.
Nuget packages
ChromiumFx browser and knockout.js
This project is a continuation and improvement of MVVM-for-awesomium.
Support
Product | Versions Compatible and additional computed target framework versions. |
---|---|
.NET | net5.0 is compatible. net5.0-windows was computed. net6.0 was computed. net6.0-android was computed. net6.0-ios was computed. net6.0-maccatalyst was computed. net6.0-macos was computed. net6.0-tvos was computed. net6.0-windows was computed. net7.0 was computed. net7.0-android was computed. net7.0-ios was computed. net7.0-maccatalyst was computed. net7.0-macos was computed. net7.0-tvos was computed. net7.0-windows was computed. net8.0 was computed. net8.0-android was computed. net8.0-browser was computed. net8.0-ios was computed. net8.0-maccatalyst was computed. net8.0-macos was computed. net8.0-tvos was computed. net8.0-windows was computed. net9.0 was computed. net9.0-android was computed. net9.0-browser was computed. net9.0-ios was computed. net9.0-maccatalyst was computed. net9.0-macos was computed. net9.0-tvos was computed. net9.0-windows was computed. |
-
net5.0
- No dependencies.
NuGet packages
This package is not used by any NuGet packages.
GitHub repositories
This package is not used by any popular GitHub repositories.
Version | Downloads | Last updated |
---|---|---|
1.0.0 | 2 | 7/31/2021 |