The. NET implementation of the Electron of the starter dry-electron.net

Source: Internet
Author: User
Tags dotnet install node

0x01, Electron.net 1, Introduction

Electron is maintained by a team and a group of active contributors on GitHub. Use HTML,CSS and JavaScript to build an open source library for cross-platform desktop applications. Electron this is accomplished by merging chromium and node. js into the same runtime environment and packaging them as applications under Mac,windows and Linux systems. Official address: https://electronjs.org. Chromium is the engine of Google Chrome, node. js, is .... Do I have to tell you?

Electron.net is a C # implementation of this technology, rod-stick. (. NET core Version)

2, Spit Groove

Also two months no more, there is ash, some bug in the repair, just get started when special tangled, now sorted out, let the old iron gate less trouble.

3, the construction process (the following process is not on the computer Nodejs traces of people, if you have used Nodejs, you still see this step to do, what to do what to do)

A, electron.net is based on Electron and node. js, so you need to do some preparatory work before you start.

B. Install node. js to https://nodejs.org/en/download

C, open the node. js command Line register a configuration file, Knock command: NPM config set registry xxx (XXX casually write, you will write XXX also line, wild way, but nothing wrong)

D. The above command will generate a. npmrc file when it finishes running. Find it (C:\USER\ADMINISTRATOR\.NPMRC), I can not find it with everything search.

E, edit the file you found, change some source, Ali's fast, clear all content and write:

registry=https://registry.npm.taobao.org
sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
Phantomjs_cdnurl=http://npm.taobao.org/mirrors/phantomjs
electron_mirror=http://npm.taobao.org/mirrors/electron/

F, continue to knock command NPM install-g Electron

G, continue to knock command NPM install Electron-packager--global

H, knock Node-v and electron-v respectively, see if the outfit is not loaded.

I

      

J, not very understanding of node. JS configuration, in addition to this environment needs, other I do not use it.

4. Development

A, open your vs, downloadElectronNET.API这个包包。

b, Program.cs Plus. Useelectron (args).

Webhost.createdefaultbuilder (args)                . Usestartup<Startup>()                . Useelectron (args)                . Build ();

C, in Startup.cs, configure method, under APP.USEMVC () Add:

varBrowserwindow =awaitElectron.WindowManager.CreateWindowAsync (Newbrowserwindowoptions {Width=1152, Height=864, Show=true, Center=true, Transparent=true            },$"http://localhost:{bridgesettings.webport}/1.html"); Browserwindow.onreadytoshow+ = () =browserwindow.show (); Browserwindow.settitle ("electron.net API Demos");

I explain $ "http://localhost:{bridgesettings.webport}/1.html", this URL parameter is the page that your app displays when you open it.

Bridgesettings.webport is getting you this MVC bound on the local port, but it's not the same as the port of your profile.

For example, my configuration file specifies that the MVC port is 50000, but the port may be 8000 when it is generated.

The path specified by the program context at this time is: \ your project \obj\host\node_modules\.bin

D, write your logic, like writing a website, all finished, also tested, and then began to change the configuration file:

      

< ItemGroup >    <  Include= "Electronnet.cli"  Version= "*"/></  ItemGroup>

The Dotnetclitoolreference node is changed to look like this, because it uses its tool.

E, in your package Management Console to find your project path, the first is on the outside, you have to CD Ah, what kind of calculation in? Dir can see your program.cs on the line.

F, then, run dotnet electronize init, which generates a Electron.manifest.json file for you.

G, and then continue to dotnet electronize start, may error, it's okay, as long as the console orange box is not extinguished (running) then you continue to wait, walk two steps, not sick walk two steps ...

      

Other computer not so error, my home computer on the red, my birds are not birds, the demo still like Red Sun rising!

H, Effect

      

This is a dynamic rain page, the water beads as if I did not like it--the other text is not centered, I am sorry--because at that time will only CSS3 not very css ....

Some people feel that they should not take electronnet with WPF, Long live XAML. Well, hooray, yes. A matter of opinion, Swaiiow tu a quiet.

G, Resources

More examples in: Https://github.com/ElectronNET/electron.net-api-demos This example code, if the window does not show Show=false to true try.

That is the example of C # and JS control, JS obviously no official website of the whole, even if you read the example is not necessarily able to find some code in the above code, because I turned a bit of source. After all, it's a first edition, so slow down.

Today's example I upload: Https://github.com/NMSLanX/ElectronNET.Demo

0x02, advertising

    

0X03, End

    

On the age, time and energy is obviously not enough, from the top of the learning method has become a habit.

Many of the library's documentation and demo for Developers is the heavenly book, I never blame people around said: "I do not understand, too difficult, I will not." "

I never insult their IQ, if someone does not understand, it must be the author and the team, the project document is not comprehensive, the demo's functional coverage is low, but also the ecological negligence of everyone!

Reducing the learning cost is each. NET missionary obligations and responsibilities.

Establish ecology, protect the ecology, see a share.

The. NET implementation of the Electron of the starter dry-electron.net

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.