Содержание
CefSharp всегда будет лучшим решением с открытым исходным кодом для создания графических пользовательских интерфейсов с HTML, CSS и JavaScript. Тем не менее, в коммерческой сфере есть много компаний, которые полагаются на Sciter для пользовательского интерфейса их применения. Sciter — это встраиваемый движок HTML / CSS / script для современной разработки пользовательского интерфейса. Sciter приносит стек веб-технологий для разработки пользовательского интерфейса рабочего стола. Веб-дизайнеры и разработчики могут повторно использовать свой опыт и знания при создании современных настольных приложений.
Преимущества Sciter по сравнению с CefSharp? Ну, пустое приложение, которое реализует CefSharp, будет по крайней мере 40 МБ, а Sciter только около 13 МБ. Чтобы внедрить Sciter в ваш проект на C #, мы установим родные привязки C # для Sciter создано @MISoftware.
Требования
- Вам не нужно ничего особенного, кроме Visual Studio и менеджера пакетов nuGet. NuGet доступен по умолчанию из Visual Studio> 2010, в этом случае мы собираемся использовать Visual Studio Community 2017.
- Мы будем следовать руководству с уже существующим проектом, поэтому сначала обязательно создайте пустое (или используйте существующий проект) приложение WinForms C #.
1. Скачать бинарные файлы Sciter
Первое, что вам нужно будет использовать sciter, это сам sciter, потому что родные привязки не обеспечивают источник sciter. Откройте официальный сайт Sciter, перейдите в раздел загрузок и нажмите кнопку «Загрузить SDK»..
Заметка
Не беспокойтесь о размере загружаемого файла SDK. Обычно он составляет около 50 МБ (со всеми платформами iOS, Android и т. Д.), Однако для C # нам потребуется скопировать только около 12 МБ.
Из zip-файла вам нужно будет скопировать весь контент внутри папки bin в соответствии с вашей платформой:
Это означает, что если ваш проект WinForms использует x64, скопируйте содержимое /bin/64 или если вы используете x86, скопируйте содержимое /bin/32, Все файлы с скейтера теперь нужно разместить на bin/Debug а также bin/Release папки вашего проекта.
Обязательно выполните этот шаг правильно, иначе позже при попытке запустить приложение вы получите исключение, а именно:
System.TypeInitializationException: инициализатор типа для ‘SciterSharp.SciterWindow’ вызвал исключение.
2. Скачать SciterSharpWindows через nuGet
В качестве следующего шага нам нужно добавить нативные привязки для Sciter в ваш проект. Откройте Visual Studio, откройте ваш проект и перейдите в обозреватель решений в верхнем правом углу VS и щелкните правой кнопкой мыши ваш проект. В раскрывающемся списке выберите параметр «Управление пакетами NuGet»:
Затем в появившемся окне найдите SciterSharpWindows и установите пакет на свой проект:
3. Добавьте контроль в вашу форму
Далее, импортируйте тип SciterSharp в свой класс формы (вверху вашего класса):
using SciterSharp.WinForms;Затем, в событии formload вашей главной формы, приступайте к созданию элемента Sciter, но перед этим выставьте SciterElement в своем классе, чтобы сделать его доступным для других методов. Затем создайте элемент, добавьте обратный вызов HandleCreated и добавьте его в форму. В этом случае мы отобразим его на всей форме, установив для свойства Dock элемента значение Fill:
using System.Windows.Forms;
using System;
using SciterSharp.WinForms;
namespace Sandbox
{
public partial class Form1 : Form
{
// Create a class-accesible sciter control
private SciterControl SciterElement;
public Form1()
{
InitializeComponent();
}
private void Form1_Load(object sender, EventArgs e)
{
// Create a new instance of the sciter control
SciterElement = new SciterControl();
// Set the callback once the element is ready to be used
SciterElement.HandleCreated += SciterControl1_HandleCreated;
// Add the Sciter Control to the Form and fill it
this.Controls.Add(SciterElement);
SciterElement.Dock = DockStyle.Fill;
}
private void SciterControl1_HandleCreated(object sender, EventArgs e)
{
// Initialize with some HTML
SciterElement.SciterWnd.LoadHtml(@"
Hello World
");
}
}
}
Предыдущий пример будет генерировать следующую форму:
И это все ! Вы можете легко использовать Sciter в своем приложении WinForm для создания удивительных и впечатляющих графических пользовательских интерфейсов. Для получения дополнительной информации о том, как работает интерфейс Scither JavaScript, CSS и HTML, обратитесь к официальной документации проекта Sciter.
