Wisej：企业软件的简易按钮

Wisej provides a platform and set of tools designed to ease the burden of developing, testing, deploying, and maintaining complex business software. It bridges the gap between traditional WinForms-style desktop applications and the web by empowering developers to leverage their existing .NET and C# skills.

Wisej提供了一个平台和一组工具，旨在减轻开发，测试，部署和维护复杂业务软件的负担。 它使开发人员能够利用他们现有的.NET和C＃技能，从而弥合了传统WinForms样式桌面应用程序和Web之间的鸿沟。

Developers are able to use the tools they are familiar with, like a pixel-perfect design surface and drag-and-drop controls with the languages they are comfortable with (C# or VB.NET) to build real-time web applications without having to learn HTML, CSS, or JavaScript. They can stay in their favorite IDE like Visual Studio to take advantage of features like IntelliSense, integrated debugging, design surfaces and source control integration. Front-end developers can leverage their knowledge of web technologies to augment applications and seamlessly integrate third-party packages like HTML5 charting libraries and ASP.NET controls.

开发人员能够使用他们熟悉的工具，例如像素完美的设计图面和拖放控件以及他们熟悉的语言(C＃或VB.NET)来构建实时Web应用程序，而无需学习HTML，CSS或JavaScript。 他们可以留在自己喜欢的IDE(如Visual Studio)中，以利用IntelliSense，集成调试，设计图和源代码控制集成等功能。 前端开发人员可以利用他们对Web技术的知识来扩展应用程序，并无缝集成第三方包，例如HTML5图表库和ASP.NET控件。

To bridge the gap between legacy desktop applications and modern web applications, Wisej provides several features that create a straightforward path to migrate existing applications or build green field projects without having to learn a new set of technologies. Support for touch and gestures is built into the software with emulation to support the desktop experience, localization is a first-class citizen, and the applications Wisej produces are out-of-the-box responsive. That means they are readily accessible from desktop browsers, mobile smartphones and tablets.

为了弥合传统桌面应用程序和现代Web应用程序之间的鸿沟，Wisej提供了一些功能，这些功能创建了直接迁移现有应用程序或构建绿色项目的途径，而无需学习新的技术。 该软件内置了对触摸和手势的支持，并通过仿真来支持桌面体验，本地化是一流的公民，Wisej生成的应用程序具有开箱即用的响应能力。 这意味着可以从桌面浏览器，移动智能手机和平板电脑轻松访问它们。

获取软件 (Obtaining the Software)

To get started, visit the Wisej site:

首先，请访问Wisej网站：

https://wisej.com/

https://wisej.com/

There you can browse the various pricing options and download a trial.

您可以在那里浏览各种定价选项并下载试用版。

The sample application is available at:

可以从以下位置获得示例应用程序：

http://demo.wisej.com/codeproject

http://demo.wisej.com/codeproject

You can download the source code at:

您可以在以下位置下载源代码：

Examples

Examples

Download the latest build of Wisej from https://wisej.com to get started. You should be able to compile and debug the application. The application uses a 64-bit SQLite driver. There are two options to ensure that you are able to successfully debug. You can either run as Administrator and use the full IIS server locally, or you can set IIS Express to run in 64-bit mode as shown in the following dialog.

从https://wisej.com下载最新版本的Wisej，以开始使用。 您应该能够编译和调试应用程序。 该应用程序使用64位SQLite驱动程序。 有两个选项可确保您能够成功调试。 您可以以管理员身份运行并在本地使用完整的IIS服务器，也可以将IIS Express设置为以64位模式运行，如下图所示。

Figure 2: Start Menu 图2：开始菜单

实例化控件 (Instantiating Controls)

In Visual Studio, navigate to the “Popups” folder and double-click “StartPopup.” This will open the designer experience for the pop-up menu. You can see the various buttons, click once to view properties and double-click on them to view the code-behind. Launching another component is simple. Double-click on the “Background Task” button in the designer. You will see the following code that simply creates an instance of the “BackgroundTask” control and then invokes it.

在Visual Studio中，导航到“ Popups”文件夹，然后双击“ StartPopup”。 这将打开弹出菜单的设计者体验。 您可以看到各种按钮，单击一次可查看属性，然后双击它们以查看隐藏的代码。 启动另一个组件很简单。 双击设计器中的“背景任务”按钮。 您将看到以下代码，这些代码仅创建“ BackgroundTask”控件的实例，然后调用它。

实时更新 (Real-time Updates)

The first example we’ll review is the “Background Tasks.” Traditionally, building a real-time pipeline between a web browser client and server host involves scaffolding technologies like WebSockets or SignalR and building logic on both sides to handle dataflow and exceptions. Run the Background Tasks example press “Start” to see it running:

我们将审查的第一个示例是“背景任务”。 传统上，在Web浏览器客户端和服务器主机之间建立实时管道涉及到WebSockets或SignalR等脚手架技术，并在两侧构建逻辑来处理数据流和异常。 运行“后台任务”示例，请按“开始”以查看其正在运行：

Figure 4: Background Tasks in the Designer 图4：设计器中的后台任务

Note the list of controls on the left side that are ready for drag-and-drop positioning on the canvas with the same experience that WebForms developers are used to. The controls to maximize, tile, and close the dialog are all built-in and require no additional code to work. Right-click on the control to view the code-behind.

请注意左侧的控件列表，这些控件准备好在画布上进行拖放定位，并具有与WebForms开发人员相同的体验。 最大化，平铺和关闭对话框的控件都是内置的，不需要其他代码即可工作。 右键单击该控件以查看其后的代码。

The important code is in the “” event.

重要的代码在“ ”事件中。

The code iterates through 100 items and pauses for one half second each loop. The browser app still runs asynchronously and is not blocked by the operation. The Wisej platform provides the “” method to initiate a background task, and refreshing data real-time is as simple as calling the “” method! All of the real-time connections between the browser and server are handled automatically, so the developer can focus on what’s important (the core code logic) and not worry about the nuances of how the client and server connect. Wisej support for real-time communications handles Websockets, HTTP, or Websockets with HTTP fallback, all selectable via a simple configuration setting.

该代码循环访问100个项目，每个循环暂停半秒。 浏览器应用程序仍然异步运行，并且不受操作限制。 该Wisej平台提供了“ ”方法来启动一个后台任务，并刷新数据的实时很简单，只要调用“ ”的方法！ 浏览器和服务器之间的所有实时连接都是自动处理的，因此开发人员可以专注于重要的事情(核心代码逻辑)，而不必担心客户端和服务器如何连接的细微差别。 Wisej对实时通信的支持可通过简单的配置设置来处理Websocket，HTTP或具有HTTP后备的Websocket。

第三方整合 (Third-Party Integration)

Next, click on “Widget Integration” in the demo app. You will be presented with an editing control:

接下来，在演示应用程序中单击“窗口小部件集成”。 您将看到一个编辑控件：

Figure 6: Data-Binding Grid 图6：数据绑定网格

The grid is full-featured. Tap on a column header to sort, and tap again to toggle the order between ascending and descending. Tap on any row to edit in the associated dialog, or double-tap on the grid to edit inline (“Excel-style”). You can insert new rows and tweak your updates until they are ready to be saved to the server. The save features a dismissible alert notification that indicates success or a modal dialog to diagnose failure.

网格功能齐全。 点击列标题进行排序，然后再次点击以在升序和降序之间切换顺序。 点击任意行以在关联的对话框中进行编辑，或者在网格上双击以进行内联编辑(“ Excel样式”)。 您可以插入新行并调整更新，直到准备好将其保存到服务器为止。 该保存具有可忽略的警报通知，指示成功或诊断失败的模式对话框。

Open the grid in Visual Studio and right-click to view the code-behind. This is an incredibly powerful feature of Wisej that many web developers likely wish they had in the past. The grid is fully implemented through C# server-side code, and Wisej automatically handles all of the binding, updates, and dataflows without the developer having to write any client JavaScript code!

在Visual Studio中打开网格，然后右键单击以查看隐藏的代码。 这是Wisej令人难以置信的强大功能，许多Web开发人员可能希望他们曾经拥有过。 网格是通过C＃服务器端代码完全实现的，Wisej会自动处理所有绑定，更新和数据流，而开发人员无需编写任何客户端JavaScript代码！

Loading the initial data set is as simple as filling a standard data adapter. The demo app uses a SQLite database to store and update sample data:

加载初始数据集就像填充标准数据适配器一样简单。 该演示应用程序使用SQLite数据库来存储和更新示例数据：

The code to save a record provides a success alert and shows a modal error dialog when an issue is encountered, again all done with straightforward C# code that automatically controls the browser experience.

保存记录的代码会发出成功警报，并在遇到问题时显示模式错误对话框，所有这些操作都通过直接控制浏览器体验的简单C＃代码完成。

It is important to note how easy it is to provide client modals with server-side code. This is often a challenge in other frameworks due to the logic necessary to handle the asynchronous dialog and ensure that the modal successfully disables other content in the app. Notice the previous code example provides a straightforward, sequential, server-side C# workflow but successfully provides an interactive modal experience in the browser.

重要的是要注意为客户端模式提供服务器端代码有多么容易。 由于处理异步对话框并确保模式成功禁用应用程序中的其他内容所需的逻辑，这在其他框架中通常是一个挑战。 注意，前面的代码示例提供了一个简单，顺序的服务器端C＃工作流程，但成功地在浏览器中提供了交互式的模态体验。

In more advanced scenarios, you may have to write code to page and skip records in the database and filter based on advanced criteria. Wisej simplifies this process by allowing you to focus on one set of code. If you can make the code work on the server, Wisej will connect it to the browser and display the appropriate output for you. No more writing two sets of code, one for the server and one to handle all of the events in the browser!

在更高级的方案中，您可能必须编写代码以分页并跳过数据库中的记录，并根据高级条件进行过滤。 Wisej通过允许您专注于一组代码来简化此过程。 如果您可以使代码在服务器上工作，Wisej会将其连接到浏览器并为您显示适当的输出。 无需再编写两套代码，一套用于服务器，一套用于处理浏览器中的所有事件！

嵌入式媒体 (Embedded Media)

Click on the “Media” option from the start menu to view the media experience. The dialog box includes embedded video with position tracking and an embedded PDF document that you can view and navigate without leaving the current webpage.

从开始菜单中单击“媒体”选项，以查看媒体体验。 该对话框包括带有位置跟踪的嵌入式视频和一个嵌入式PDF文档，您可以在不离开当前网页的情况下查看和导航。

Figure 8: PDF Viewer Properties 图8：PDF查看器属性

The PDF viewer control is flexible and offers support for pdf.js, native PDF documents, Google Docs and custom viewers.

PDF查看器控件非常灵活，并支持pdf.js，本机PDF文档，Google Docs和自定义查看器。

For the position tracking in the media element, a simple event is wired in to trigger when the time position changes and handled with the following code:

对于media元素中的位置跟踪，将插入一个简单事件，以在时间位置更改并通过以下代码处理时触发：

The code is handled just like a desktop app and all of the updates to the browser are coordinated automatically by Wisej.

就像桌面应用程序一样处理代码，并且Wisej会自动协调浏览器的所有更新。

定制画 (Custom Painting)

The final dialog to cover in this review is “Custom Painting.” Tap on the option and you’ll see a modal dialog with a fully rendered Mandelbrot set and a smiling face.

此评论中要覆盖的最后一个对话框是“自定义绘画”。 点击选项，您将看到一个模态对话框，其中包含完全渲染的Mandelbrot设置和笑脸。

The smiling face is a “canvas” control that enables you to write server-side code to render a client-side HTML5 canvas. This allows you to create complex custom web controls entirely in .NET that are fully HTML5 compliant.

笑脸是一个“画布”控件，使您可以编写服务器端代码来呈现客户端HTML5画布。 这使您可以完全在.NET中创建完全兼容HTML5的复杂的自定义Web控件。

独立可执行文件 (Standalone Executable)

In addition to supporting web-based deployments, the Wisej platform allows you to package your application as a local executable that can be run from the desktop. It supports identical functionality to the web-based project as a standalone program. This enables distribution without a web server. The executable is generated in the root directory of the project, and this is an example of running it with the canvas widget.

除了支持基于Web的部署外，Wisej平台还允许您将应用程序打包为可从桌面运行的本地可执行文件。 它作为独立程序支持与基于Web的项目相同的功能。 这样就可以在没有Web服务器的情况下进行分发。 可执行文件在项目的根目录中生成，这是使用canvas小部件运行它的示例。

Figure 10: Standalone Executable 图10：独立的可执行文件

功能和集成 (Features and Integrations)

像素完美的所见即所得设计器 (Pixel-Perfect WYSIWIG Designer)

Everything done with Wisej revolves around the framework’s patented pixel-perfect designer. The WYSIWIG designer allows you to see exactly what the application will look like at runtime. Drag and drop controls from the toolbox onto the page and see for yourself. The designer also allows developers to create responsive profiles: pages that will fit any device.

使用Wisej进行的所有操作都围绕该框架的专利像素完美设计器展开。 WYSIWIG设计器使您可以准确查看应用程序在运行时的外观。 将控件从工具箱拖放到页面上，然后自己查看。 设计人员还允许开发人员创建响应式配置文件：适用于任何设备的页面。

主题生成器 (Theme Builder)

Wisej comes with a powerful theme builder that allows developers to modify the look and feel of any control within their application. Different themes and styles can be applied to debug applications running in production with ease. Each Wisej control also comes with a “CssStyle” attribute that applies the custom style during design-time.

Wisej带有一个功能强大的主题生成器，使开发人员可以修改其应用程序中任何控件的外观。 可以轻松地将不同的主题和样式应用于调试在生产中运行的应用程序。 每个Wisej控件还带有“ CssStyle”属性，该属性在设计时会应用自定义样式。

控制库集成 (Control Library Integrations)

In addition to the third-party widgets integrated in the sample, Wisej now features the Syncfusion, DevExpress, and Infragistics JavaScript component libraries available as drag-and-drop controls in the designer. The integration simplifies the migration process for developers concerned about losing their native desktop application’s charts, graphs, and other controls.

除了示例中集成的第三方小部件之外，Wisej现在还具有Syncfusion，DevExpress和Infragistics JavaScript组件库，它们可以在设计器中作为拖放控件使用。 集成为担心丢失其本地桌面应用程序的图表，图形和其他控件的开发人员简化了迁移过程。

本机移动集成 (Native Mobile Integration)

The Wisej Mobile Integration package for Android and iOS offers web developers the power to integrate native device functionalities into their Wisej applications. Native scrolling and a custom theme will give the user a responsive experience. Use the device’s biometric authentication capabilities, native toolbars, tabbars, and more. Handle any native device event in Wisej using a custom handler.

适用于Android和iOS的Wisej移动集成软件包为Web开发人员提供了将本机设备功能集成到其Wisej应用程序中的功能。 本机滚动和自定义主题将为用户提供响应式体验。 使用设备的生物特征认证功能，本机工具栏，标签栏等。 使用自定义处理程序处理Wisej中的任何本机设备事件。

Wisej的好处 (Benefits of Wisej)

• Load Balancer support

  负载平衡器支持

• Support for native mobile integrations (iOS and Android)

  支持本地移动集成(iOS和Android)

• Support for progressive web applications (PWA)

  支持渐进式Web应用程序(PWA)

• Robust architecture that is resistant to some of the top OWASP attacks

  强大的体系结构可抵抗某些顶级OWASP攻击

结论 (Conclusion)

For developers, the challenge of building a complex enterprise web application with features like large customizable grids and real-time data updates can be daunting. It may seem even more complex when the requirement is to migrate a legacy WinForms-style application to the web without losing the features business users have grown accustomed to, like being able to use their keyboard for data entry and editing values inside a live grid. Fortunately, Wisej is a tool that eases the burden of the challenge and provides a direct path from desktop applications to the web. As a powerful platform that abstracts away the nuances of client/server interactions while embracing all the web has to offer, including third-party HTML5-based solutions, it is the perfect tool for building enterprise web applications.

对于开发人员而言，构建具有大型可定制网格和实时数据更新等功能的复杂企业Web应用程序的挑战可能艰巨。 当要求是将遗留WinForms样式的应用程序迁移到Web而不丢失业务用户已经习惯的功能(例如能够使用其键盘输入数据并在实时网格内编辑值)时，这似乎更加复杂。 幸运的是，Wisej是一种可减轻挑战负担并提供从桌面应用程序到Web的直接路径的工具。 作为一个强大的平台，它可以抽象化客户端/服务器交互的细微差别，同时包含所有Web提供的内容，包括基于HTML5的第三方解决方案，它是构建企业Web应用程序的理想工具。

This review just scratched the surface of the capabilities Wisej provides. In addition to what was covered here, there are dozens more out of the box controls and features like comprehensive theming that can be applied while the application is running. It is possible to target both a web application and a desktop application from the same codebase. All of the functionality is available as a drag-and-drop, designer-based .NET application that leverages existing C# or VB.NET skills. Why not see for yourself how powerful the Wisej platform isHead over to the website and start your free trial if you haven’t already to follow through this review.

这篇评论只是对Wisej提供的功能的介绍。 除了此处介绍的内容外，还有许多现成的控件和功能(例如综合主题)可在应用程序运行时应用。 可以从同一代码库中同时定位Web应用程序和桌面应用程序。 所有功能都可作为基于设计人员的拖放式.NET应用程序使用，该应用程序利用现有的C＃或VB.NET技能。 为什么不亲自了解Wisej平台的功能呢如果您还没有关注此评论，请访问该网站并开始免费试用。

Note: This is an update version of Jeremy Likness’ original article on Wisej: https://www.codeproject.com/Articles/1208339/Wisej-The-Easy-Button-for-Enterprise-Software

注意：这是Jeremy Likness在Wisej上原始文章的更新版本： https ://www.codeproject.com/Articles/1208339/Wisej-The-Easy-Button-for-Enterprise-Software

翻译自: https://www.codeproject.com/Articles/1208339/Wisej-The-Easy-Button-for-Enterprise-Software

文章知识点与官方知识档案匹配，可进一步学习相关知识Java技能树首页概览91365 人正在系统学习中 相关资源：按软件服务对象的范围划分-软件工程课件-专业指导文档类资源-CSDN…

来源：cunhan4654