GUI-библиотека ElectronIC Control

ElectronIC Control - кроссплатформенная библиотека для построения графических пользовательских интерфейсов, разработанная при помощи фреймворка Electron.

Задача

Чтобы расширить возможности нашего продукта SkyHistory, приложения для просмотра, управления, хранения, фильтрации сообщений в Skype и их поиска по дате, мы создали кроссплатформенную библиотеку графических элементов пользовательского интерфейса. Библиотека для создания пользовательских интерфейсов отвечает за отображение текстовых сообщений в Skype, чатов, в том числе групповых, и фильтров по дате.

При выполнении задачи наша команда выбрала:

  • кроссплатформенный фреймворк Electron;
  • Node.js для работы с бэкендом;
  • формат AppX для распространения и установки приложения в Windows 8, 10, Phone 8.1, 10 Mobile, 10 IoT Core, Xbox One, HoloLens.

Подход

В случаях, когда необходимо разработать нативные графические приложения для различных операционных систем с помощью веб-технологий, задачу поможет решить фреймворк Electron. Он предоставляет платформу для разработки кроссплатформенных десктопных приложений с HTML/CSS/JavaScript и Node.js для доступа к системному API. Фреймворк уже поспособствовал созданию множества приложений, в числе которых — Atom (текстовый редактор с открытым исходным кодом), редактор исходного кода Visual Studio Code, корпоративный мессенджер Slack и другие.

Поэтому при создании кроссплатформенной библиотеки графических элементов пользовательского интерфейса команда разработчиков СКЭНД отдала предпочтение фреймворку Electron. Благодаря ему мы достаточно быстро разработали библиотеку и реализовали все необходимые функции.

Так как наша кроссплатформенная GUI-библиотека является частью продукта SkyHistory, все данные для отображения выбираются из базы данных SQLite. Для этого мы использовали уже существующий драйвер SQLite ODBC, написанный на C++ и обернутый в .NET Core Data.SQLite, для обеспечения совместимости и кроссплатформенности.

Для запуска пакета приложений в Windows Store был сформирован инсталляционный пакет в формате AppX с помощью Electron-Windows-Store CLI.

Описание

Кроссплатформенная GUI-библиотека для SkyHistory включает в себя:

  • списки пользователей и групп пользователей;
  • календарь для просмотра и фильтра записей по датам, месяцам и сезонам;
  • панели меню и инструментов;
  • элемент пользовательского интерфейса «список сообщений в беседе»;
  • элементы поиска и фильтрации сообщений в Skype.

Один из главных элементов пользовательского интерфейса — «список сообщений в беседе» (message conversation list) — дает возможность:

  • размещать текстовые сообщения различной длины;
  • использовать специфические заголовки и подзаголовки с привязкой ко времени;
  • настраивать шрифт и его параметры, например, выбирать размер, тип, цвет шрифта для собственных сообщений и сообщений других пользователей;
  • динамической прокрутки.

Ключевые решения

Собрав вместе ряд элементов, мы создали библиотеку, для которой характерны следующие особенности:

  • это кроссплатформенная библиотека для построения графических пользовательских интерфейсов;
  • для разработки библиотеки использовался фреймворк Electron;
  • использование менеджера пакетов NuGet;
  • компонент .NET Core Data.SQLite стал неотъемлемой частью разработки;
  • наша GUI-библиотека совместима с Windows Anniversary Update (Redstone) для загрузки приложения в формате AppX в Windows Store.

Результат

Kроссплатформенная GUI-библиотека для построения графических пользовательских интерфейсов

Кроссплатформенная GUI-библиотека для SkyHistory является единой для платформ, поддерживающих Microsoft Skype, — Windows, Linux и macOS. После выхода обновления Windows Anniversary Update (Redstone) приложения могут загружаться в Windows Store в пакетах AppX. Чтобы автоматически их установить, пользователям нужно просто дважды кликнуть на файл с расширением .appx.

Вам нужен похожий проект?

Свяжитесь с нами

Наша команда к вашим услугам! Напишите нам, и мы ответим вам в ближайшее время.

Спасибо, что написали нам! Ваше сообщение было успешно отправлено. Мы обязательно ответим на него в ближайшее время. Пожалуйста, проверьте, получили ли Вы от нас письмо-подтверждение на указанную Вами почту.