CryptoTradingFramework — известный в определенных кругах проект на WinForms для торговли на криптобиржах, включающий в себя сам фреймворк и клиентское приложение. Недавно мы перевели его на Avalonia UI с использованием библиотеки визуальных контролов EMX Controls. На примере клиентского приложения CryptoMarketClient мы хотели бы рассказать о возможностях библиотеки EMX Controls для разработки GUI для финансовых приложений.

Работа с табличными данными

Обработка табличных данных составляет основу большинства приложений в финансовой области и многих других сферах. В библиотеке EMX Controls имеется два компонента, которые упрощают визуализацию и редактирование табличных данных.

В первую очередь это контрол DataGrid, предназначенный для представления плоских таблиц. В приложении CryptoMarketClient он используется для отображения плоского списка ключей:

и списка криптовалют:

В колонке Trend показан пример того, что можно создать кастомный редактор для отображения маленьких графиков (т.н. sparklines) и встроить его в ячейки контрола DataGrid.

Также контрол используется для реализации стакана заявок:

В данном примере можно заметить цветовую индикацию объема заявок. Этот функционал реализован с помощью кастомных стилей и шаблонов для строк.

Производительность контрола DataGrid позволяет ему без задержек обновлять данные в режиме реального времени:

DataGrid поддерживает множество функций, которые будут полезны при разработке приложений. Среди них стоит выделить следующие:

• Группировка и сортировка записей — Позволяют провести удобный анализ котировок, транзакций, портфелей.

• Фильтрация — Используется для быстрого поиска по параметрам (дата, сумма, категория).

• Вычисляемые колонки — Позволяют выводить данные, вычисляемые на основе других значений.

• Валидация данных — Механизм для проверки значений в ячейках при вводе, а также при показе.

• Маски (для встроенных и отдельных редакторов) — Служат для ограничения пользовательского ввода и для форматирования значений.

• Режим виртуализации — Поддерживает плавную работу с миллионами записей и большим числом колонок.

Другой табличный контрол в библиотеке EMX Controls — TreeList. Хотя он пока не нашел своего применения в приложении CryptoMarketClient, но о нем стоит упомянуть. Данный компонент предназначен для отображения иерархических структур. Он поддерживает те же возможности, что и DataGrid, включая режим виртуализации, который обеспечивает высокую эффективность при работе с большими объемами данных.

Финансовые приложения предъявляют высокие требования к производительности. В прошлой итерации мы "прокачали" наши табличные контролы, о чем рассказали в предыдущей статье. Высокая производительность контролов помогают создавать эффективный пользовательский опыт (UX) в том числе и в финансовых приложениях.

Графики

Графики способствуют лучшему восприятию финансовых данных. Контрол CartesianChart из библиотеки EMX Controls позволяет отображать разные типы графиков: линейные, столбчатые диаграммы, "японские свечи" и многие другие.

Например, график "японские свечи" ("candlestick") используется в приложении CryptoMarketClient для показа изменения цены актива. Контрол может автоматически агрегировать данные во временные интервалы (от миллисекунды до года) и строить по сгруппированной информации свечи.

Все типы графиков поддерживают динамическое обновление данных. Например, вы можете создать эффект движущегося "окна", при котором старые данные удаляются из начала серии, а новая порция данных добавляется в конец. Предусмотрен специальный API для удаления и добавления данных.

Контрол CartesianChart поддерживает интерактивные возможности, которые позволяют пользователю прокручивать и масштабировать данные с помощью мышки. Функция "прицела" дает возможность узнать значения в любой точке на графике.

В данном примере одновременно отображаются несколько графиков (серий данных) в одном контроле. При этом используются две оси Y (для серий Volume и Price).

Работа с окнами и панелями

В приложении CryptoMarketClient реализован многооконный интерфейс (MDI) с помощью компонента Docking из библиотеки EMX Controls. Данный компонент создает UI и UX в стиле Microsoft Visual Studio.

Компонент Docking — это контейнер, который организует внутри себя документы (основное содержимое интерфейса) и панели. Все элементы автоматически стыкуются друг с другом, но также могут находиться в плавающем режиме или быть сгруппированными в виде вкладок.

При перетаскивании панели появляются подсказки (в стиле Microsoft Visual Studio), указывающие возможные варианты закрепления.

Для создания документов и панелей, а также их содержимого вы можете использовать шаблон MVVM.

Спроектированная компоновка окон не является статичной — пользователи могут легко перенастроить их расположение и видимость с помощью встроенной функциональности drag&drop, а также функции автоматического скрытия панелей. В дальнейшем настроенный лейаут можно сохранить/восстановить с использованием соответствующего API.

Что дальше?

В настоящее время наша команда работает над дата-ориентированным экспортом из табличных контролов в формате MS Excel. Можно будет экспортировать данные с сохранением группировки, сортировки и фильтрации.

Еще один важный функционал, который ожидается в будущих версиях, — это постраничный WYSIWYG экспорт в PDF с диалогом предварительного просмотра. Это позволит распечатывать данные и делиться ими с клиентами.

Актуально ли для вас создание финансовых приложений? Будем рады, если вы поделитесь вашим опытом и требованиями к такого рода проектам. С нетерпением ждем ваших комментариев.

Демо-приложение

Для тех, кто хочет поближе познакомиться с библиотекой контролов EMX Controls для Avalonia, мы создали демо-приложение. Его можно запустить online прямо в браузере, или offline как обычное десктопное приложение на Avalonia.

Наши предыдущие статьи

• Как мы улучшили скорость работы табличных контролов библиотеки EMX Controls для Avalonia UI

• Библиотека EremexControls.NET для Avalonia UI — Большое обновление (v 1.1 EAP)

• Библиотека EremexControls.NET для Avalonia UI — Обновление июль-август 2024

• Библиотека EremexControls.NET для Avalonia UI — Обновление май-июнь 2024

• Библиотека EremexControls.NET для Avalonia UI — Обновление март-апрель 2024

• Библиотека контролов для Avalonia UI