Catalogue
How desktop software fits today's Internet
Give Way. NET desktop software engineering has Internet gene
Adapt applications to different application scenarios
Cloud WinForm: Powerful Web productivity
introduction
For everyone NET developers, the following code is no stranger:
namespace FirstApp { static class Program { /// <summary> /// The main entry point for the application. /// </summary> [STAThread] static void Main() { Application.EnableVisualStyles(); Application.SetCompatibleTextRenderingDefault(false); Application.Run(new Form1()); } } }
It can be said that almost every WinForm project written in C# contains parts equivalent to the above code. The key is:
Application.Run(new Form1());
Microsoft was officially released in January 2002 NET Framework, it has been nearly 20 years now, and this line has hardly changed. In 20 years, it was built on NET based desktop client systems are numerous, although each system has different forms, for the vast majority NET desktop application system The call of run is inevitable, which is an objective and indisputable fact.
How desktop software fits today's Internet
The emergence of Internet browser has changed people's habit of obtaining information. At the same time, it has also changed the mode of software development, deployment, upgrading and operation, which has formed a great challenge to the ecology of desktop software. Web software with browser as the breakthrough point shows incomparable advantages of desktop software in many aspects. Due to the limitation of Web DOM elements, web applications can not completely replace desktop software, but a trend seems to have taken shape. Desktop applications are confused by "yesterday's yellow flower". Is there any way to change this situation?
Perhaps we are about to usher in the further evolution of the Internet. With the rise of 5G, network speed is no longer a problem, local computer hard disk storage is hardly a problem, and the dominant frequency of computer chips is becoming larger and larger. All this indicates that the increasingly powerful desktop computer is no longer a luxury. It seems that desktop software also has an objective basic physical environment. However, in the face of the aggressive Web ecology, even C# such an excellent language is inadequate. We believe that the software industry needs a change, or the change has been quietly brewing
It is our vision to make every desktop application have the gene of Internet browser. If this idea is established, the unique status of Internet browser will gradually disappear, the competition of browser will gradually fade, and the boundary between desktop software and Web software will disappear.
Give Way. NET desktop software engineering has Internet gene
This article is for all windows Net programmers need to have the following basic knowledge and preparations:
- Modification NET project, we only support 64 bit applications (Debug, Release 64 bit compilation);
- Download (click) WebRuntime runtime support package , you need to put the necessary support package for runtime in the same folder as the exe file;
- Correctly configure the Manifest file of the project (app.manifest is included in the WebRuntime runtime support package);
- Reference cosmos DLL (Cosmos.dll is included in the WebRuntime runtime support package);
For specific details, please refer to the information provided by us One minute video tutorial Operation:
Let NET project has Internet gene
What is web runtime?
WebRuntime Is an open source project. The core goal of this project is to let developers take the modern browser as the starting point of an application. Different from the existing browser based controls (CEF, WebView2) and Electron, WebRuntime completely retains all the code of Chromium, which fundamentally ensures that a specific application contains all the functions of the Web browser. For. NET developers, their workload is a line of code change, that is
Application.Run(new Form1());
Change to
Universe.Cosmos.Run();
Note that "new Form1()" is ignored here. Replace this line with the one after replacement NET application brings the following important changes:
- . NET desktop application is transformed into a chrome based desktop application, which naturally contains all the functions of modern Web Browser. The difference from the standard browser is that we allow the first window to be a user-developed custom window (every time the standard browser opens a browser window), at the same time, we allow developers to create different types of Win32 forms in the Web page, that is, when the user starts the program, the window specified by the developer will first be displayed as the main window of the application. When the user starts the second instance of the application, or opens a new URL in the program, A new browser window will be activated;
- . NET Framework class objects as DOM elements, especially GUI objects such as WinForm and UserControl, can be displayed on Web pages as DOM elements;
- . NET interacts with Javascript, which ensures Javascript operation in Web pages NET object, processing response NET object;
- Cloud WinForm allows any number of dynamic WinForm elements to be defined in Web pages, enabling developers to instantiate any number of Form objects based on Javascript scripts, similar to Office VBAForm.
Specific cases
We are Binary package (download TheUniverse.zip) Among them, the simplest demonstration applications FirstApp and exe are provided. Developers can download the source code of FirstApp on Git or create the simplest project themselves.
Run firstapp correctly Exe, we need an initialization WebPage: "FirstApp,index,html". The code of the page is as follows:
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title>Welcome to a new world.NET world, I'm your friend WebRuntime</title> <link rel="icon" href="webpage/app.png" sizes="32x32"> <script type="text/javascript"> function OpenAppURL1() { cosmos.openUrl("host:webpage/WebApp1.html", 100); } function OpenAppURL2() { cosmos.openUrl("host:webpage/WebApp2.html", 100); } function OpenAppURL3() { cosmos.openUrl("host:webpage/WebApp3.html", 100); } function OpenAppURL4() { cosmos.openUrl("host:webpage/WebApp4.html", 100); } function OpenAppURL5() { cosmos.openUrl("host:webpage/WebApp5.html", 100); } function OpenAppURL6() { cosmos.openUrl("host:webpage/WebApp6.html", 100); } function OpenCWRURL() { cosmos.openUrl("host:webpage/CWR.html", 2); } function OpenCERURL() { cosmos.openUrl("host:webpage/CER.html", 2); } function OpenAppURLAsSubPage1() { cosmos.openUrl("host:webpage/SubWebApp1.html", 2); } function OpenAppURLAsSubPage2() { cosmos.openUrl("host:webpage/SubWebApp2.html", 2); } function OpenAppURLAsSubPage3() { cosmos.openUrl("host:webpage/WebApp3.html", 2); } </script> </head> <body> <cosmos> <!-- Define new DOM elements --> <define tagName="mainWindow"></define> <define tagName="application"></define> <define tagName="webViewport"></define> <!-- End Define new DOM elements --> <!-- The "application" element is required, it can provide application-level configuration. --> <application> <ntp> <winNucleus> <xobj id='grid' rows='1' cols='2' width='350,350,' splitterwidth='6'> <xobj objid="FirstApp.Form1,host"></xobj> <xobj objid="nucleus"></xobj> </xobj> </winNucleus> </ntp> <defaultworkbench> <winNucleus> <xobj id='grid' rows='1' cols='2' width='350,350,' splitterwidth='6'> <xobj objid="FirstApp.Form1,host"></xobj> <xobj objid="nucleus"></xobj> </xobj> </winNucleus> </defaultworkbench> <urls> <url url="host:WebPage/sunny.html"></url> </urls> </application> <mainWindow objid="FirstApp.Form1,host" caption="The Universe" width="2400" height="1600" id="mainForm"> <panel1 id="mainworkclient"> <default> <winNucleus> <xobj style="39" activepage="1"> <xobj caption="Cloudx Application" id='Splitter1' rows='1' cols='2' height='250,' width='350,350,' borderwidth='0' splitterwidth='6'> <xobj objid="nucleus"> </xobj> <xobj objid="" id="Sunny_ntpctrl"> </xobj> </xobj> <xobj caption="Common Web Runtime for Application" url="host"></xobj> </xobj> </winNucleus> </default> </panel1> </mainWindow> <webViewport> <winNucleus> <xobj rows="1" cols="2" width="750," id="xxx" caption="test caption"> <xobj objid="FirstApp.Form1,host" id="navCtrl"> </xobj> <xobj objid="nucleus" id="mainClient"> </xobj> </xobj> </winNucleus> </webViewport> </cosmos> <strong style="font-size:32px; color:black">welcome<i style="color:fuchsia">You come</i><i style="color:blue">FirstApp of </i><b style="color:coral">.NET Desktop software ecological world</b>!</strong> <h1 style="font-size: 16px; color:midnightblue"><i style="font-size:32px; color:blue">Click the following hyperlink</i> Experience new Web page...</h1> <p> <a href="javascript:void(0);" onclick="OpenAppURL1();" style="font-size:16px;color:firebrick"><b>The First WebPage for Application</b></a> <hr /> <a href="javascript:void(0);" onclick="OpenAppURL2();" style="font-size:16px;color:blueviolet"><b>Let your application system have Internet gene</b></a> <hr /> <a href="javascript:void(0);" onclick="OpenAppURL3();" style="font-size:16px;color:forestgreen"><b>new Web Page, new expressiveness</b></a> <hr /> <a href="javascript:void(0);" onclick="OpenAppURL4();" style="font-size:16px;color:brown"><b>Give Way Web The gap between apps and desktop apps is disappearing</b></a> <hr /> <a href="javascript:void(0);" onclick="OpenAppURL5();" style="font-size:16px;color:cadetblue"><b>Breaking through the constraints, a new world is ready to come out.</b></a> <hr /> <a href="javascript:void(0);" onclick="OpenAppURL6();" style="font-size:16px;color:dodgerblue"><b>You can do more with your Web You decide</b></a> <hr /> <a href="javascript:void(0);" onclick="OpenAppURLAsSubPage1();" style="font-size:16px;color:saddlebrown"><b>Pages are everywhere</b></a> <hr /> <a href="javascript:void(0);" onclick="OpenAppURLAsSubPage2();" style="font-size:16px;color:springgreen"><b>Your creativity is unlimited</b></a> <hr /> </p> </body> </html>
The rule here is: each "Exename Exe "requires an initialization page:" exeName,index,html ".
With firstapp Index, HTML, now you can run FirstApp,exe.
FirstApp run video
Start FirstApp,exe, and we see:
Compare the Form1 designer interface:
We found that many elements have been added to the runtime form, all of which are the following Web page elements:
<mainWindow objid="FirstApp.Form1,host" caption="The Universe" width="2400" height="1600" id="mainForm"> <panel1 id="mainworkclient"> <default> <winNucleus> <xobj style="39" activepage="1"> <xobj caption="Cloudx Application" id='Splitter1' rows='1' cols='2' height='250,' width='350,350,' borderwidth='0' splitterwidth='6'> <xobj objid="nucleus"> </xobj> <xobj objid="" id="Sunny_ntpctrl"> </xobj> </xobj> <xobj caption="Common Web Runtime for Application" url="host"></xobj> </xobj> </winNucleus> </default> </panel1> </mainWindow>
Among them, panel1 is a control on Form1. The design given here is that when the Form form is paged, the control at its central position can be further dynamic by the Web page. Click a group of "hyperlinks" given on the Form1 Form to directly activate the built-in browser:
(the application page is composed of. NET controls and standard DOM elements)
(debugging interface)
(New TabPage)
We're at firstapp index. The following sections of the HTML determine the basic style of each new page:
<application> <ntp> <winNucleus> <xobj id='grid' rows='1' cols='2' width='350,350,' splitterwidth='6'> <xobj objid="FirstApp.Form1,host"></xobj> <xobj objid="nucleus"></xobj> </xobj> </winNucleus> </ntp> <urls> <url url="host:WebPage/sunny.html"></url> </urls> </application>
(ntp node, ntp = "New TabPage")
We note that universe Cosmos. Run () has no parameters, so no GUI objects will be created when the application system starts. Later, for the convenience of writing, we assume that there is already a FirstApp that meets our conditions Exe, here you can replace FirstApp with any C# WinForm project you choose. We hope Form1 in FirstApp is designed as follows:
In the downloaded binary package, an initialization page with some complexity is provided "firstapp1 Index, HTML ", you can replace this file with FirstApp.index,html (change the name) to see a more comprehensive effect.
Adapt applications to different application scenarios
We note that new NET application execution portal:
Universe.Cosmos.Run();
Since the Run method has no parameters, in fact, the main form of the application is determined by the following elements of the initialization page "AppExeName,index,html":
<mainWindow objid="FirstApp.Form1,host" caption="The Universe" width="2400" height="1600" id="mainForm"> <panel1 id="mainworkclient"> <default> <winNucleus> <xobj style="39" activepage="1"> <xobj caption="Cloudx Application" id='Splitter1' rows='1' cols='2' height='250,' width='350,350,' borderwidth='0' splitterwidth='6'> <xobj objid="nucleus"> </xobj> <xobj objid="" id="Sunny_ntpctrl"> </xobj> </xobj> <xobj caption="Common Web Runtime for Application" url="host"></xobj> </xobj> </winNucleus> </default> </panel1> </mainWindow>
(note the element panel1. Of course, panel2 can be added similarly, and the corresponding control needs to exist on the Form)
Our subsequent series of articles will systematically introduce this mainwindow element. You can see some clues here, that is, the main window can be described, It means "diversification" of the main form. When we copy exe to different directories and match different initialization pages, the application scenario is completely different. In fact, mainwindow has an "objid" attribute, which is actually the "qualified name" of a. NET object "Based on this attribute, we can dynamically change the main window of an application system according to the page.
Since the application is launched from the first page, more pages can be organized in one page, and the specific organization principles of the application system have changed, If we remove the child element of mainwindow, the application system is the original system before the Run method is not replaced, that is, the original application system is a "special solution", which is very similar to the differential equation, and the special solution is obtained according to different "initial value conditions" and "boundary value conditions".
Due to the internal processing of WebRuntime, we found that a large number of existing application systems can establish their own application ecology after one line of code modification. This effect enables those existing application systems to find new value-added space in the Internet era. From this perspective, Internet technology has revitalized the vast majority of technical resources. In other words, we can do subsequent value-added development based on Web on the basis of the original model.
Application based Web pages
Because the new application is a modern browser, different from the standard browser, the application system supports NET GUI elements (Form, Control, WPF Control...) and standard Web DOM elements Form new Web pages, which adds unlimited expansion capability to the host application system. In particular, we promote the browser sub window mode, which makes a GUI object, such as WinForm object, flexibly organize specific applications based on a set of Tags:
(organize applications in GUI objects based on browser tags,
Make the software more friendly and expressive, and better dynamic control)
Application oriented pages can be said to be the natural extension of standard pages. This feature makes the application system more adaptable. It is a powerful software organization mechanism based on content ecology.
Cloud WinForm: Powerful Web productivity
When designing the demonstration application of FirstApp, we added a panel object on Form1. We set the anchor property of the control. This object changes during runtime, depending on the following description:
<panel1 id="mainworkclient"> <default> <winNucleus> <xobj style="39" activepage="1"> <xobj caption="Cloudx Application" id='Splitter1' rows='1' cols='2' height='250,' width='350,350,' borderwidth='0' splitterwidth='6'> <xobj objid="nucleus"> </xobj> <xobj objid="" id="Sunny_ntpctrl"> </xobj> </xobj> <xobj caption="Common Web Runtime for Application" url="host"></xobj> </xobj> </winNucleus> </default> </panel1>
In fact, the basic requirement of the Web runtime is that only one control with a dock attribute of "dockfill" or "none" is required, not necessarily a panel. WebRuntime regards each Form object as a dynamic Form. If a Form contains one or a group of controls with dock attribute of "dockfill" or "none", the above description is true. The complexity depends on the specific structure of winNucleus elements. We call this kind of Form "Cloud WinForm", which will be explained in detail in the subsequent introduction, This dynamic description capability of WinForm is not limited to Web pages. However, due to Javascript, such elements in pages make The GUI object of Net Framework embodies strong creativity in the Web model of application system.
(Cloud WinForm and application-oriented Web pages will make your application system
Web based technology has become more dynamic than the original system)
summary
We have seen several basic changes brought by WebRuntime to an ordinary desktop application:
- Each NET application provides each application with a built-in full-featured chromium based Internet browser in the most concise way on the basis of completely retaining the original structure;
- Each browser can NET GUI elements are used as DOM elements of Web pages, and Javascript can respond to the events of these GUI elements;
- Provide directory based deployment mechanism, so that applications have completely different Web configuration and deployment without folders;
- When the user is in the project, application Run is called cosmos After the run replacement, the user's system will fully realize the application expansion mechanism based on Web technology and have its own web ecology. Each WinForm form form can realize the similar dynamic expressiveness of web pages based on Web technology. In firstapp Exe, we can see the dynamic performance of panel1;
- In fact, such as firstapp Exe, each one NET desktop application, like standard browser, is a web content engine, that is, WebRuntime reveals the duality of desktop application, one is local feature, the other is Web feature.
- When the WebRuntime is referenced by the application system, extensibility is the basic attribute of the application system. The original model of the application system is infinitely expanded by Web technology, which is essentially different from the original system;
- FirstApp is a minimalist WinForm demonstration. In fact, in the Internet age NET desktop application potential should be "extremely broad". If the browser is the smallest application, then WebRuntime will bring unlimited creativity to developers
The changes in the above aspects are sufficient to ensure that NET application system has a complete "new Web application ecology". WebRuntime allows the existence of independent browser windows and dynamic Cloud WinForm, which makes the original model have great extension and expansion ability, which ensures that in the Internet environment, The application system can not only meet the growing needs of "application content" in the operation process, but also ensure that the application system has sufficient technical and human resources to adapt to the changing network environment.