RU2799988C2 - Система и способ динамической визуализации элементов программного обеспечения - Google Patents

Abstract

Изобретение относится к системе и способу динамической визуализации элементов программного обеспечения. Технический результат заключается в уменьшении времени вывода (визуализации) графических элементов в интерфейс. Система содержит среду выполнения, включающую по крайней мере компонент визуализации элемента управления в среде выполнения; компонент интеграции в среде выполнения, сконфигурированный для интеграции элемента управления в программное обеспечение; и модуль взаимодействия с визуализатором в среде выполнения, сконфигурированный с возможностью получения и передачи макета и включающий компонент рендеринга, подключенный к компоненту визуализации элемента управления в среде выполнения и сконфигурированный с возможностью отложенной подгрузки функций элемента управления, а также содержит подключенные друг к другу: среду редактирования, включающую по крайней мере компонент визуализации элемента управления в среде редактирования; компонент интеграции в среде редактирования, сконфигурированный для интеграции элемента управления в визуальный редактор; и модуль взаимодействия с визуализатором в среде редактирования, сконфигурированный с возможностью создания макета и подключенный к модулю взаимодействия с визуализатором в среде выполнения, подключенные друг к другу, и интерфейс с по крайней мере одним элементом управления, подключенным к компоненту визуализации элемента управления в среде выполнения и к компоненту визуализации элемента управления в среде редактирования и сконфигурированным с возможностью генерации строк кода. 2 н. и 16 з.п. ф-лы, 6 ил.

Description

Область техники

[1] Настоящее изобретение относится к способам создания визуальных элементов программного обеспечения, позволяющих визуализировать элементы управления программного обеспечения.

Уровень техники

[2] С началом цифровизации многие бизнесы и пользователи начали создавать свои собственные приложения. Для этих целей зачастую привлекались внештатные разработки-программисты, услуги которых были недешевы, а для малых бизнесов - часто недоступными. К тому же, если такой разработчик-программист не предусмотрел удобную для пользователей, не владеющих навыками программирования, возможность внесения изменений в программное обеспечение (ПО), например, добавления туда новых товаров или обновления данных внутри ПО, то пользователям приходилось повторно обращаться за услугами разработчиков.

[3] Позднее появились платформы для конфигурации сайтов и приложений, не требующих знаний программирования. В них элементы управления (виджеты) являются визуализированными элементами в интерфейсе платформы. За счет этого пользователю, не владеющему навыком программирования, удобно и понятно применять визуализированные функциональные элементы для создания собственного программного обеспечения. Однако часто ПО, созданное при помощи таких платформ, сильно уступает ПО, написанному программистом-разработчиком: в скорости визуализации, в скорости отклика программы в ответ на взаимодействия пользователя с программой и в целом, в функциональности программного обеспечения.

[4] В настоящее время существует множество различных систем для динамического создания визуальных элементов программного обеспечения или сайтов. Большинство из них включают две среды: среду редактирования, где создаются страницы сайта или программного обеспечения посредством перетаскивания виджетов или других визуальных элементов в пользовательский интерфейс среды редактирования, и среду выполнения, в которую интегрируют все использованные визуальные элементы среды редактирования посредством генерации машиночитаемого кода. Обычно интеграция производится после того, как пользователь, создавший программное обеспечение или сайт в среде редактирования нажал на кнопку компиляции. После нажатия на эту кнопку генерируется машиночитаемый код, включающий кодифицировано заданное программное обеспечение. При этом обычно вместе с визуальными элементами интегрируются все ссылки и связи между визуальными элементами, которые были предусмотрены в процессе разработки программного обеспечения или сайта в среде редактирования. Это значительно уменьшает скорость отображения страницы сайта или программного обеспечения.

[5] Известно решение, описанное в патенте на изобретение US8533661B2 (опубл. 28.04.2008; МПК: G06F 9/44). В нем представляется веб-интерфейс для визуального моделирования процесса интеграции бизнеса или приложения путем выбора и связывания предварительно определенных визуальных элементов, представляющих процесс. Настраиваемое исполняемое программное приложение для конкретного предприятия («динамический механизм выполнения») автоматически создается программным обеспечением, работающим удаленно. Механизм динамической среды выполнения создается для включения общего шаблона приложения, предопределенных «стандартных» кодовых наборов, выбранных в зависимости от моделируемого процесса, и кодового набора профиля данных, который включает ввод, предоставляемый пользователем для настройки стандартных компонентов для конкретного процесса интеграции конкретное предприятие. Шаблон приложения и выбранные кодовые наборы могут быть впоследствии загружены для предоставления исполняемого программного приложения динамического механизма выполнения, которое настроено для выполнения определенного процесса интеграции для конкретного предприятия. Таким образом, программное обеспечение динамического механизма выполнения создается автоматически за пределами вычислительной сети предприятия, но настраивается для конкретного предприятия до того, как оно поступит в вычислительную сеть предприятия или другую сеть назначения. Одним из недостатков этого решения является то, что визуальный элемент изначально существует только в среде редактирования, а затем, посредством перевода его в машиночитаемый код, отображается в среде выполнения. Это значительно замедляет процесс отображения визуального элемента в среде выполнения. Еще одним недостатком является то, что каждый визуальный элемент в режиме выполнения сразу связан со всеми ссылками и программными элементами, которые были в него заложены в режиме редактирования. За счет этого процесс отображения в среде выполнения еще больше замедляется, т.к. каждый визуальный элемент может нести в себе большое количество ссылок. Также из второго недостатка вытекает еще одно отличие от настоящего изобретения, заключающееся в том, что в вышеописанном решении не предусматривается формирование и присвоение карт ключ-значение для организации связи между метаданными и визуальными элементами. Еще один недостаток заключается в том, что не предусматривается предрасчет минимальных и максимальных размеров визуальных элементов перед их использованием. Это может приводить к неверной разметке и к некорректному отображению, особенно в процессе перевода в машиночитаемый код.

[6] В другом патенте на изобретение US7774745B2 (опубл. 29.12.2005; МПК: G06F 9/44) описываются способы и устройства, включая программные продукты, для создания исполняемых сущностей в среде визуального моделирования. Метод включает в себя предоставление сущностей языка графического моделирования во время разработки для использования в программе визуального моделирования, получение входных данных, определяющих определение приложения во время разработки как включающих, по крайней мере, первую и вторую сущности во время разработки в качестве компонентов версии приложения во время разработки, и создание сущностей среды выполнения для приложения. Сущности языка графического моделирования среды разработки включают в себя первую и вторую сущности среды разработки, а первая сущность среды разработки имеет связанный первый объект среды выполнения, предварительно скомпилированный для первой платформы. Входные данные включают в себя конфигурацию свойств первой и второй сущностей среды разработки, а создание сущностей среды выполнения включает установку свойств первой сущности среды выполнения в соответствии с конфигурацией свойств первой сущности среды разработки. Одним из недостатков этого решения является то, что визуальный элемент изначально существует только в среде редактирования, а затем, посредством перевода его в машиночитаемый код, отображается в среде выполнения. Это влечет за собой то, что визуальный элемент в среде редактирования и в среде выполнения являются технически разными объектами, следовательно в момент создания в среде редактирования визуальный элемент может отличаться от того, что получится в итоге в среде выполнения. Еще одним недостатком является то, что каждый визуальный элемент в режиме выполнения сразу связан со всеми компилируемыми функциями и программными элементами, которые были в него заложены в режиме редактирования. За счет этого процесс отображения в среде выполнения еще больше замедляется, т.к. каждый визуальный элемент может нести в себе большое количество компилируемых функций. Также из второго недостатка вытекает еще одно отличие от настоящего изобретения, заключающееся в том, что в вышеописанном решении не предусматривается формирование и присвоение карт ключ-значение для организации связи между метаданными и визуальными элементами. Еще один недостаток заключается в том, что не предусматривается предрасчет минимальных и максимальных размеров визуальных элементов перед их использованием. Это может приводить к неверной разметке и к некорректному отображению, особенно в процессе перевода в машиночитаемый код.

[7] В патенте на изобретение US9582254B2 (опубл. 20.05.2015; МПК: G06F 9/44; G06Q 10/06) описываются варианты систем и способов для создания компонентов среды выполнения в различных аппаратных и программных компьютерных системах. Более конкретно, определенные варианты осуществления настоящего изобретения описывают интерфейс среды разработки, с помощью которого приложения могут быть спроектированы, созданы и развернуты в соответствии с базовыми исходными системами компьютерной системы. Компоненты можно выбирать, настраивать и связывать вместе, чтобы сформировать функциональное сквозное приложение, основанное на множестве базовых технологий внутри системы. После завершения проектирования приложения метаданные приложения и/или компоненты среды выполнения могут быть сгенерированы и развернуты в компьютерной системе. Во время выполнения такие компоненты среды выполнения, развернутые в системе, могут взаимодействовать для получения и обработки потоков событий из различных источников событий, анализа входящих данных и создания объектов логических транзакций, предупреждений и других ответов с использованием различных исходных систем. Одним из недостатков этого решения является то, что визуальный элемент изначально существует только в среде редактирования, а затем, посредством перевода его в машиночитаемый код, отображается в среде выполнения. Это влечет за собой то, что визуальный элемент в среде редактирования и в среде выполнения являются технически разными объектами, следовательно в момент создания в среде редактирования визуальный элемент может отличаться от того, что получится в итоге в среде выполнения. Еще одним недостатком является то, что каждый визуальный элемент в режиме выполнения сразу связан со всеми компилируемыми функциями и программными элементами, которые были в него заложены в режиме редактирования. За счет этого процесс отображения в среде выполнения еще больше замедляется, т.к. каждый визуальный элемент может нести в себе большое количество компилируемых функций. Также из второго недостатка вытекает еще одно отличие от настоящего изобретения, заключающееся в том, что в вышеописанном решении не предусматривается формирование и присвоение карт ключ-значение для организации связи между метаданными и визуальными элементами. Еще один недостаток заключается в том, что не предусматривается предрасчет минимальных и максимальных размеров визуальных элементов перед их использованием. Это может приводить к неверной разметке и к некорректному отображению, особенно в процессе перевода в машиночитаемый код.

[8] В патенте на изобретение US7412658B2 (опубл. 12.11.2003; МПК: G06F 3/00) описывается система моделирования для универсальной спецификации пользовательских интерфейсов. Система предоставляет средства для определения пользовательских интерфейсов, включая очень сложные и динамические пользовательские интерфейсы, способом, который не зависит от любого контекста реализации. Система моделирования основывается на удобном для пользователя визуальном представлении пользовательского интерфейса через постепенно детализированные спецификации структурных и поведенческих аспектов частей пользовательского интерфейса, пока не будет достигнуто строгое определение пользовательского интерфейса во всех его контекстах использования. Используя информацию, зафиксированную в модели, можно создавать инструменты, которые автоматически генерируют полностью рабочий код пользовательского интерфейса. Одним из недостатков этого решения является то, что визуальный элемент изначально существует только в среде редактирования, а затем, посредством перевода его в машиночитаемый код, отображается в среде выполнения. Это влечет за собой то, что визуальный элемент в среде редактирования и в среде выполнения являются технически разными объектами, следовательно в момент создания в среде редактирования визуальный элемент может отличаться от того, что получится в итоге в среде выполнения. Еще одним недостатком является то, что каждый визуальный элемент в режиме выполнения сразу связан со всеми компилируемыми функциями и программными элементами, которые были в него заложены в режиме редактирования. За счет этого процесс отображения в среде выполнения еще больше замедляется, т.к. каждый визуальный элемент может нести в себе большое количество компилируемых функций. Еще один недостаток заключается в том, что не предусматривается предрасчет минимальных и максимальных размеров визуальных элементов перед их использованием. Это может приводить к неверной разметке и к некорректному отображению, особенно в процессе перевода в машиночитаемый код.

[9] Еще один патент на изобретение US7493594B2 (опубл. 14.03.2005; МПК: G06F 9/44) описывает систему и способ для обеспечения системы пользовательского интерфейса для разработки приложения, имеющего первый компонент с дескрипторами, выраженными на языке структурированных определений, и второй компонент, выраженный как последовательность инструкций. Отдельные компоненты взаимодействуют для обработки сообщений в среде выполнения устройства, полученных от источника данных по сети. Компонентные приложения содержат компоненты данных, компоненты представления и компоненты сообщений, которые написаны в коде XML. Компонентные приложения дополнительно содержат компоненты рабочего процесса, которые написаны в подмножестве ECMAScript и дополнены кодом XML. Система пользовательского интерфейса содержит первый модуль, такой как средство просмотра или редактор, для разработки определений первого компонента посредством взаимодействия с моделью данных, которая обеспечивает постоянное состояние приложения. Система пользовательского интерфейса содержит второй модуль для разработки инструкций второго компонента посредством взаимодействия с моделью данных. и серверный соединитель для предоставления информации об отображении сообщений источника данных первому модулю. Первый модуль генерирует определения на основе информации отображения. Первый и второй компоненты, разработанные соответствующими первым и вторым модулями, включены в приложение вместе с другими компонентами, где это применимо. Одним из недостатков этого решения является то, что визуальный элемент изначально существует только в среде редактирования, а затем, посредством перевода его в машиночитаемый код, отображается в среде выполнения. Это влечет за собой то, что визуальный элемент в среде редактирования и в среде выполнения являются технически разными объектами, следовательно в момент создания в среде редактирования визуальный элемент может отличаться от того, что получится в итоге в среде выполнения. Еще одним недостатком является то, что каждый визуальный элемент в режиме выполнения сразу связан со всеми компилируемыми функциями и программными элементами, которые были в него заложены в режиме редактирования. За счет этого процесс отображения в среде выполнения еще больше замедляется, т.к. каждый визуальный элемент может нести в себе большое количество компилируемых функций. Еще один недостаток заключается в том, что не предусматривается предрасчет минимальных и максимальных размеров визуальных элементов перед их использованием. Это может приводить к неверной разметке и к некорректному отображению, особенно в процессе перевода в машиночитаемый код.

[10] Иным близким аналогом является патент на изобретение US10846060B2 (опубл. 24.11.2020; МПК: G06F 8/34; G06F 8/38; G06F 3/30482; G06F 8/35; G06F 16/23). В нем описываются система и способ построения декларативного одностраничного веб-приложения (Single Page Web Application, SPA), которые можно использовать для создания сложного, полнофункционального SPA без излишнего кодирования. Конструктор SPA содержит набор правил, облегчающих создание SPA. Набор правил в построителе SPA может включать в себя набор элементов пользовательского интерфейса и модель конечного автомата (finite-state machine model) с набором правил зависимости данных, набором правил визуализации пользовательского интерфейса и набором правил потока данных выполнения действий. Построитель SPA может также использовать фиктивные данные (mock data - «данные-имитация»), которые позволяют пользователю создавать и проверять потоки взаимодействия с пользователем SPA в среде редактирования. Одним из недостатков этого решения является то, что визуальный элемент изначально существует только в среде редактирования, а затем, посредством перевода его в машиночитаемый код, отображается в среде выполнения. Это влечет за собой то, что визуальный элемент в среде редактирования и в среде выполнения являются технически разными объектами, следовательно в момент создания в среде редактирования визуальный элемент может отличаться от того, что получится в итоге в среде выполнения. Еще один недостаток заключается в том, что не предусматривается предрасчет минимальных и максимальных размеров визуальных элементов перед их использованием. Это может приводить к неверной разметке и к некорректному отображению, особенно в процессе перевода в машиночитаемый код.

Сущность изобретения

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

[12] Указанная задача решается благодаря достижению такого технического результата, как создание системы и способа визуализации элементов программного обеспечения, способных обеспечить создание сложных и полнофункциональных интерфейсов программного обеспечения без излишнего кодирования, а также высокую скорость компиляции интерфейса в программном обеспечении, за счет периодических малых затрат вычислительных мощностей. Указанная задача достигается в том числе, но не ограничиваясь, благодаря:

• реализации элементов управления одновременно в двух средах: редактирования и выполнения;

• предварительному расчету минимальных размеров визуальных элементов в среде редактирования;

• интеграции метаданных и функций элемента управления в элемент управления в момент взаимодействия пользователя с ним.

[13] Более полно, технический результат достигается описанной системой динамической визуализации элементов программного обеспечения, включающей среду выполнения, среду редактирования и интерфейс с по крайней мере одним элементом управления. При этом среда выполнения включает подключенные друг к другу компонент визуализации в среде выполнения, компонент интеграции в среде выполнения, сконфигурированный для интеграции элемента управления в программное обеспечение, и модуль взаимодействия с визуализатором в среде выполнения, сконфигурированный с возможностью получения и передачи макета. Среда редактирования включает подключенные друг к другу компонент визуализации в среде редактирования, компонент интеграции в среде редактирования, сконфигурированный для интеграции элемента управления в визуальный редактор, и модуль взаимодействия с визуализатором в среде редактирования, сконфигурированный с возможностью создания макета и подключенный к модулю взаимодействия с визуализатором в среде выполнения. Интерфейс с по крайней мере одним элементом управления, подключенным к компоненту визуализации в среде выполнения и к компоненту визуализации в среде редактирования и сконфигурированным с возможностью генерации строк кода.

[14] При этом среда редактирования необходима для внесения изменений в программное обеспечения, причем по крайней мере визуальных изменений. Компонент визуализации в среде редактирования необходим для визуализации внесенных в программное обеспечение изменений, а компонент интеграции в среде редактирования необходим для взаимодействия с элементом управления в среде редактирования. Среда выполнения необходима для визуализации программного обеспечения, а именно его итоговой и промежуточных версий. Компонент визуализации в среде выполнения необходим для визуализации внесенных в программное обеспечение изменений, а компонент интеграции в среде выполнения необходим для взаимодействия с элементов управления в созданном программном обеспечении. Модуль взаимодействия с визуализатором в среде редактирования необходим для создания макета с по крайней мере одним элементом управления для последующей визуализации этого макета в среде редактирования, а также для передачи макета модулю взаимодействия с визуализатором в среде выполнения. При этом сам модуль взаимодействия с визуализатором в среде выполнения необходим для получения макета и его передачи компоненту визуализации в среде выполнения. Сам элемент управления необходим для его использования в процессе создания программного обеспечения. А то, что он сконфигурирован с возможностью генерации строк кода, необходимо для преобразования визуализированного представления программного обеспечения в машиночитаемый код, а также ускорить процесс визуализации в среде редактирования и в среде выполнения. Интерфейс при этом необходим для реализации элементов управления одновременно в двух средах: редактирования и выполнения.

[15] Модуль взаимодействия с визуализатором в среде редактирования может дополнительно включать компонент преобразования действий пользователя. При его включении в систему его можно подключить к компоненту визуализации в среде редактирования. Он может служить для обработки действий пользователя. Также модуль взаимодействия с визуализатором в среде редактирования может дополнительно включать компонент организации доступа к интерфейсу, подключенный к компоненту преобразования действий пользователя. Это может позволить организовать доступ к интерфейсу с элементами управления в среде редактирования. Он также может накапливать внесенные изменения для того, чтобы любое изменение могло быть как применено, так и отменено.

[16] Также модуль взаимодействия с визуализатором в среде редактирования может дополнительно включать компонент хранения элементов управления, подключенный к компоненту организации доступа к интерфейсу. Это может быть полезно для хранения всех созданных и/или сгенерированных элементов управления. Таким образом будет возможно элементы управления, созданные или сгенерированные ранее, сохранить и впоследствии добавить к другому элементу управления/форме/программному обеспечению. Также он может позволить хранить логику и функции конкретного элемента управления.

[17] Модуль взаимодействия с визуализатором в среде выполнения, в свою очередь, может дополнительно включать компонент загрузки, подключенный к компоненту визуализации в среде выполнения и сконфигурированный для конвертации функций для визуализации и для загрузки функций в элемент управления, а также для приема созданных макетов и их отложенной передачи. Этот компонент может позволить добавлять логику в элемент управления в среде выполнения.

[18] Также модуль взаимодействия с визуализатором в среде выполнения может дополнительно включать компонент рендеринга, подключенный к компоненту загрузки и к компоненту визуализации в среде выполнения. Он может позволить производить отложенный рендеринг функций элемента управления, что таже может еще больше уменьшить время компиляции программного обеспечения.

[19] Среда редактирования может дополнительно включать компонент хранения и обработки данных. Он может быть подключен к компоненту хранения элементов управления. Компонент хранения и обработки данных может предоставлять функциональные возможности для взаимодействия с различными типами данных.

[20] Также система может дополнительно включать базу данных элементов управления, включающее по крайней мере один элемент управления. Это может позволить пользователю интегрировать в программное обеспечение ранее созданные элементы управления или ранее преднастроенные элементы управления, что может облегчить создание программного обеспечения, а также ускорить процесс его создания.

[21] Также технический результат достигается способом динамической визуализации элементов программного обеспечения, по которому сначала добавляют элемент управления в среду редактирования. После добавления, при помощи элемента управления генерируют код и передают его в интерфейс. При помощи интерфейса полученный код передают в компонент визуализации в среде редактирования. После этого получают информацию от компонента интеграции в среде редактирования о месте визуализации элемента управления в среде редактирования. Далее создают макет, включающий добавленный элемент управления, а в среде редактирования визуализируют созданный макет в среде редактирования. После этого интегрируют элемент управления в визуальный редактор. Далее созданный макет передают в модуль взаимодействия с визуализатором в среде выполнения и визуализируют полученный макет в среде выполнения. После этого интегрируют элемент управления в программное обеспечение.

[22] При этом этап добавления элемента управления в среду редактирования необходим для того, чтобы выбрать элемент управления, который станет частью программного обеспечения, или добавить созданный элемент управления в него. Этап генерации кода элементом управления необходим для преобразования человекочитаемого элемента управления в машиночитаемый код, а этап его передачи интерфейсом в среду редактирования и среду выполнения необходим для организации взаимодействия с элементом управления в среде редактирования и в среде выполнения. Этап создания макета необходим для размещения элемента управления в конкретном месте макета перед его визуализацией. А этап его передачи в среду выполнения необходим для того, чтобы в среде редактирования и в среде выполнения визуальное воплощение элемента управления было отображено одинаково. Этап визуализации элемента управления в среде редактирования и в среде выполнения необходим для того, чтобы элемент управления был виден в обеих средах. А этап интеграции элемента управления необходим того, чтобы с видимым в обеих средах элементом управления можно было взаимодействовать.

[23] На этапе создания макета могут детектировать добавление пользователем элемента управления при помощи компонента обработки действий пользователя. После этого могут сохранять добавление пользователем элемента управления и применять это действие.

[24] После передачи созданного макета в модуль взаимодействия с визуализатором в среде выполнения могут получать созданный макет при помощи компонента загрузки, передавать полученный макет компоненту рендеринга. При помощи компонента рендеринга могут получать строки кода, сгенерированные элементом управления, включающимся в полученный макет. После этого полученный макет со строками кода могут передавать в компонент визуализации в среде выполнения.

[25] После этапа интеграции элемента управления в программное обеспечение в среде редактирования пользователь может взаимодействовать с элементом управления, при этом могут обрабатывать действия пользователя при помощи компонента преобразования действий пользователя. Это может служить для обработки действий пользователя, а именно для их преобразования в машиночитаемый код и анализа того, была ли пользователем добавлена функция в элемент управления и/или был ли добавлен сам элемент управления.

[26] После интеграции элемента управления в среду редактирования могут генерировать функцию для элемента управления при помощи интерфейса и передавать данные о функции компоненту организации доступа к интерфейсу. Это может позволить добавлять логику в элемент управления в среде редактирования.

[27] В случае если при помощи интерфейса добавили функцию в элемент управления, передают данные о функции компоненту организации доступа к интерфейсу. Сгенерированные функции также могут сохранять при помощи компонента организации доступа к интерфейсу. Это может позволить хранить и накапливать функции для того, чтобы любое изменение могло быть как применено, так и отменено.

[28] Также сгенерированную функцию могут передавать в компонент хранения элементов управления и обновлять созданный макет посредством элементов управления с функциями. Это может позволить хранить логику и функции конкретного элемента управления.

[29] После этапа обновления созданного макета могут передавать макет с загруженными функциями в компонент загрузки, а затем передавать загруженные функции в компонент рендеринга при помощи компонента загрузки при взаимодействии пользователя с элементом управления в среде выполнения. Это может позволить осуществлять отложенный рендеринг функций элементов управления только при необходимости.

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

[31] При этом перед этапом созданного макета могут дополнительно загружать функции из компонента хранения и обработки данных в компонент хранения элементов управления. Это может предоставить функциональные возможности для взаимодействия с различными типами данных.

Описание чертежей

[32] На Фиг. 1 представлена схема системы динамической визуализации элемента программного обеспечения согласно настоящему изобретению.

[33] На Фиг. 2 представлена схема системы динамической визуализации элемента программного обеспечения с дополнительными компонентами согласно настоящему изобретению.

[34] На Фиг. 3 представлена блок-схема, иллюстрирующая способ динамической визуализации элемента программного обеспечения, согласно настоящему изобретению.

[35] На Фиг. 4 представлена блок-схема, иллюстрирующая дополнительные этапы способа динамической визуализации элемента программного обеспечения производящиеся в среде редактирования, согласно настоящему изобретению.

[36] На Фиг. 5 представлена блок-схема, иллюстрирующая дополнительные этапы способа динамической визуализации элемента программного обеспечения производящиеся в среде выполнения, согласно настоящему изобретению.

[37] На Фиг. 6 представлена блок-схема, иллюстрирующая вариант воплощения способа визуализации элементов программного обеспечения для системы визуализации элементов программного обеспечения, показанной на Фиг. 2, согласно настоящему изобретению.

Подробное описание

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

[39] Кроме того, из приведенного изложения ясно, что изобретение не ограничивается приведенной реализацией. Многочисленные возможные модификации, изменения, вариации и замены, сохраняющие суть и форму настоящего изобретения, очевидны для квалифицированных в предметной области специалистов.

[40] На Фиг. 1 представлена схема системы динамической визуализации элемента программного обеспечения согласно настоящему изобретению. Система динамической визуализации элемента программного обеспечения включает среду редактирования 100, среду выполнения 200 и интерфейс 2 с по крайней мере одним элементом управления 1. При этом среда редактирования 100 включает компонент визуализации в среде редактирования 101, компонент интеграции в среде редактирования 102 и модуль взаимодействия с визуализатором в среде редактирования 103, подключенные друг к другу. Среда выполнения 200, в свою очередь, включает компонент визуализации в среде выполнения 201, компонент интеграции в среде выполнения 202 и модуль взаимодействия с визуализатором в среде выполнения 203, подключенные друг к другу. Компоненты интеграции в среде редактирования 102 и в среде выполнения 202 сконфигурированы для интеграции элемента управления 1 в визуальный (графический) редактор и в программное обеспечение соответственно. Сам же элемент управления 1 подключен к компоненту визуализации в среде выполнения 201 и к компоненту визуализации в среде редактирования 101. При этом элемент управления 1 сконфигурирован с возможностью генерации строк кода. Под строками кода понимается машиночитаемый код, причем код может генерироваться на любом языке программирования, предназначенном для создания программного обеспечения, например, Python, Java, Javascript, C#, Си (С) и С++, PHP, R, Objective-C, Swift, MATLAB, HTML, XHTML, XML и др. Интерфейс 2 позволяет реализовать элементы управления 1 одновременно в двух средах: редактирования 100 и выполнения 200. Настоящая система может быть реализована на клиентском сервере, облачной архитектуре или на любых других компьютерных архитектурах, находящихся в пределах объемов раскрытия изобретения. Например, система может быть реализована как автономная компьютерная система или в программном обеспечении как сервисная архитектура. В представленных материалах применение системы в большей степени описано со стороны применения системы в программном обеспечении в качестве сервисной архитектуры, однако для специалиста в этой области техники очевиден способ ее внедрения и в другие компьютерные системы.

[41] Элемент управления 1 может представлять из себя виджет. По своей сути, это графические элементы управления («виджеты» GUI), являющиеся примерами многократно используемых модульных компонентов. Они могут применяться в совокупности для создания более сложного приложения, что позволяет программистам создавать пользовательские интерфейсы, комбинируя простые, более мелкие компоненты. Каждый элемент управления 1 может включать заранее в него заложенные функции. При этом эти функции также могут иметь возможность редактирования. Все элементы управления 1 при этом могут храниться в базе данных элементов управления. База данных элементов управления может являться внутренней базой данных системы или внешней базой данных.

[42] Среда редактирования 100 является визуальным редактором, позволяющим создавать формы на основе элементов управления 1. Основными элементами среды редактирования 100, отвечающими за визуализацию и интеграцию элементов управления в визуальный редактор, являются компонент визуализации в среде редактирования 101 и компонент интеграции в среде редактирования 102.

[43] Компонент визуализации в среде редактирования 101 предназначен для визуализации по крайней мере одного элемента управления 1 в визуальном редакторе. Также компонент визуализации в среде редактирования 101 может визуализировать другие дополнительные элементы пользовательского интерфейса (user interface elements - UI-элементы), необходимые для осуществления редактирования элементов управления 1 в среде редактирования 100. Например, он 101 может визуализировать меню, панель с инструментами и функциями редактирования и др. Меню, в свою очередь, может, например, включать переключение между проектами программного обеспечения, инструкцию по использованию среды редактирования, набор преднастроенных форм и элементов управления 1. На панели инструментов редактирования могут быть предусмотрены инструменты добавления элемента управления 1, копирования элемента управления 1, сохранения элемента управления 1, удаления элемента управления 1, выделения элемента управления 1, перемещения элемента управления 1 и инструменты рисования, подобные инструментам графического редактора.

[44] Компонент интеграции в среде редактирования 102 представляет собой специальный компонент, организующий связь между формой или элементом управления 1, реализованными системой, и визуальным редактором (средой редактирования 100), использующим данную форму. Он 102 организует контейнер для отображения компонента визуализации в среде редактирования 101 и обеспечивает интерфейс взаимодействия между ним 101 и средой редактирования 100. Предназначен для размещения на странице визуального редактора. Это позволяет встраивать визуализированные при помощи компонента визуализации в среде редактирования 101 элементы управления 1 в интерфейс любого программного обеспечения. При этом компонент визуализации 101 и компонент интеграции 102 элемента управления в среду редактирования должны быть подключены друг к другу напрямую.

[45] Среда выполнения 200 представляет собой среду компиляции. В ней происходит интеграция и визуализация форм или элементов управления 1 с последующей возможностью с ними взаимодействовать. Формы при этом состоят из элементов управления 1. Для ускорения процесса интеграции элементов управления 1 в программное обеспечение в среде выполнения 200 применяется специальный подход к визуализации элементов управления 1, предназначенный для сокращения затрат вычислительных мощностей на визуализацию элемента управления 1. Целевой показатель 150 миллисекунд на форму из 1000 элементов управления 1, скомпонованных в любой последовательности.

[46] В среде выполнения 200 компонент визуализации 201 отвечает за организацию интерфейса взаимодействия между элементами управления и пользовательскими настройками. А компонент интеграции в среде выполнения 202 организует связь между формой, реализованной на основе элементов управления 1, или элементов управления 1 и программным обеспечением, использующим данную форму. Он 202 организует контейнер для визуализации компонентом визуализации в среде выполнения 201 и обеспечивает интерфейс взаимодействия между компонентом визуализации 201 и программным обеспечением.

[47] Интерфейс 2 представляет собой жесткий интерфейс взаимодействия элементов управления 1 со средами редактирования 100 и выполнения 200. Интерфейс 2 может представлять собой интерфейс прикладного программирования. Интерфейс прикладного программирования представляет собой функциональный интерфейс прикладного программирования (application programming interface, API) по изменению модели. Он представляет собой набор методов (функций), который пользователь может использовать для доступа к функциональности программного компонента (программы, модуля, библиотеки). API является важной абстракцией, описывающей функциональность «в чистом виде», безотносительно того, как реализована эта функциональность. Программные компоненты взаимодействуют друг с другом посредством API. При этом обычно компоненты образуют иерархию - высокоуровневые компоненты используют API низкоуровневых компонентов, а те, в свою очередь, используют API еще более низкоуровневых компонентов. Пользователь может задавать в интерфейсе прикладного программирования сигнатуру функции в качестве части общего объявления функции, позволяющей средствами трансляции идентифицировать функцию среди других. Также он может задавать семантику функции, т.е. описание того, какой исполнительный код будет реализовывать эта функция. Семантика функции включает в себя описание того, что является результатом вычисления функции, как и от чего этот результат зависит. Обычно результат выполнения зависит только от значений аргументов функции, но в некоторых модулях есть понятие состояния. Тогда результат функции может зависеть от этого состояния, и, кроме того, результатом может стать изменение состояния. Логика этих зависимостей и изменений относится к семантике функции. Полным описанием семантики функций является исполняемый код функции или математическое определение функции.

[48] Интерфейс прикладного программирования может быть реализован различными способами, подходящими для пользователей с разными уровнями навыков программирования. Например, для пользователей, не имеющих знаний в области логики и программирования, могут быть заданы заранее сгенерированные функции, которые они могут использовать для создания программного обеспечения. Заранее сгенерированные функции могут быть заранее встроенными в элементы управления 1 форм. Такой пользователь может просто добавить эти функции в элемент управления 1 путем, например, перетаскивания функции в элемент управления 1.

[49] В другом варианте интерфейс прикладного программирования 2 может быть реализован для пользователей, обладающих знаниями в логике, но не обладающих знаниями в программировании. Это может быть реализовано, например, посредством блок-схем или диаграмм. То есть, логика элемента управления 1 может задаваться в виде блок-схемы для обозначения последовательности действий элемента управления 1, а также триггерные события, которые могут инициировать переход к тому или иному действию элемента управления 1.

[50] Еще одним вариантом реализации интерфейса прикладного программирования может являться окно для написания кода. Этот вариант может быть удобен для пользователей, имеющих навыки программирования. Причем код может быть написан на любом языке программирования, предназначенном для создания программного обеспечения, например, Python, Java, Javascript, C#, Си (С) и С++, PHP, R, Objective-C, Swift, MATLAB, HTML, XHTML, XML и др.

[51] При этом интерфейс 2 сконфигурирован с возможностью контроля того, какие функции могут быть добавлены в конкретный элемент управления 1.

[52] Интерфейс 2 взаимодействует со средой редактирования 100 и со средой выполнения 200 по-разному. После получения строк кода от элемента управления 1 интерфейс 2 передает код в компоненты визуализации в среде редактирования 101 и в среде выполнения 201 в отдельности. При этом, после получения строк кода в компонент визуализации в среде редактирования 101 интерфейс 2 дополняет функционал элементу управления 1. Например, при добавлении элемента управления 1 в среду редактирования 100 интерфейс 2 создает для него 1 ячейку. Благодаря этой ячейке возможно перемещение элемента управления 1 по макету программного обеспечения в среде редактирования 100. В среде выполнения 200 ячейки для элементов управления 1 не создают.

[53] Система динамической визуализации элементов программного обеспечения, показанная на Фиг. 1, работает следующим образом. Пользователь добавляет элемент управления 1 в интерфейс среды редактирования 100. В момент добавления элемент управления 1 генерирует строки кода в интерфейс 2. Интерфейс 2 передает код среде редактирования 100 и среде выполнения 200 и взаимодействует с ними. Далее компонент визуализации в среде редактирования 101 визуализирует элемент управления 1 в среде редактирования 100, а именно в интерфейсе визуального редактора. Причем, перед визуализацией получают информацию от компонента интеграции в среде редактирования 102 о том, в каком месте визуализировать элемент управления 1 в среде редактирования 100, создают макет с по крайней мере одним элементом управления 1 и передают макет компоненту визуализации в среде редактирования 101 при помощи модуля взаимодействия с визуализатором в среде редактирования 103. Компонент интеграции в среде редактирования 102 интегрирует элемент управления 1 в среду редактирования 100, а именно в интерфейс визуального редактора. При этом у пользователя появляется возможность взаимодействия с элементов управления 1 в интерфейсе визуального редактора, т.е. становится возможным вносить изменения в элемент управления. Приблизительно в одно время, спустя какое-то время или одновременно с визуализацией элемента управления 1 в среде редактирования 100 визуализируют элемент управления 1 в среде выполнения 200, а именно в интерфейсе программного обеспечения, при помощи компонента визуализации в среде выполнения 201. Причем, перед визуализацией при помощи модуля взаимодействия с визуализатором в среде выполнения 203 получают макет с по крайней мере одним элементом управления 1 от модуля взаимодействия с визуализатором в среде редактирования 203 и передают макет компоненту визуализации в среде выполнения 201.. Компонент интеграции в среде выполнения 202 интегрирует элемент управления 1 в среду выполнения 200, а именно в интерфейс программного обеспечения. При этом у пользователя программного обеспечения появляется возможность взаимодействовать с элементом управления 1 в программном обеспечении.

[54] Под взаимодействием интерфейса 2 со средой редактирования 100 и средой выполнения 200 понимается дополнение или преобразование строк кода, сгенерированных элементом управления 1 разными способами для каждой из сред 100, 200. Таким образом, элемент управления 1 в среде редактирования 100 и в среде выполнения 200, имея при этом тот же внешний вид и тот же внутренний кол, имеет разный функционал в каждой из сред 100, 200, то есть интерфейс 2 создает разные протоколы взаимодействия пользователя с элементом управления 1.

[55] Вышеописанные компоненты и элементу системы могут быть реализованы на вычислительных устройствах, включающих по крайней мере процессор и память, дисплей для отображения пользовательского интерфейса (UI) веб-браузера или UI компоновщика программного обеспечения пользователя. Предпочтительно, чтобы вычислительное устройство также имело доступ к беспроводным каналам связи для взаимодействия с сервером. Например, вычислительное устройство может быть устройством смартфона, таким как Apple iPhone или операционная система Android, базовое устройство, персональный компьютер, портативный компьютер, планшет и т.п.

[56] Для взаимодействия с системой вычислительно устройство может пользоваться каналами связи, включающими, например, одно или несколько проводных соединений, таких как Ethernet, и беспроводных соединений, таких как сотовая цифровая сеть передачи данных, компьютерная сеть, сеть Wi-Fi и т.п. Канал связи может использовать различные известные протоколы связи и данных. Например, в одном варианте осуществления канал связи может быть TCP / IP и HTTPS или HTTP. Кроме того, канал связи может также передавать данные, имеющие другие форматы, такие как данные JSON.

[57] На Фиг. 2 представлена схема системы динамической визуализации элементов программного обеспечения с дополнительными элементами согласно настоящему изобретению. Среда редактирования 100 может дополнительно включать компонент преобразования действий пользователя 104, компонент организации доступа к интерфейсу 105 и/или компонент хранения элементов управления 106, в зависимости от назначения и поставленной задачи системы. При использовании сочетания всех этих трех компонент (104, 105, 106) наиболее предпочтительным является подключение компонента преобразования действий пользователя 104 к компоненту визуализации в среде редактирования 101 и к компоненту организации доступа к интерфейсу 105. Компонент организации доступа к интерфейсу 105, в свою очередь, может быть дополнительно подключен к компоненту хранения элементов управления 106. А компонент хранения элементов управления 106 может быть подключен к компоненту визуализации в среде редактирования 101, замыкая цепочку взаимодействия компонент. Среда выполнения 200 может дополнительно включать компонент загрузки 204 и компонент рендеринга 205, подключенные друг к другу и к компоненту визуализации в среде выполнения 101. Дополнительно система может включать компонент хранения и обработки данных 107. Компонент хранения и обработки данных 107 может быть подключен к компоненту хранения элементов управления 106.

[58] Компонент преобразования действий пользователя 104 выполняет обработку действий пользователя с помощью подключаемых функций. Компонент преобразования действий пользователя 104 может напрямую влиять на компонент визуализации в среде редактирования 101, например, предоставляя пользователю подсказку при добавлении новых элементов управления 1 в форму. Также он может служить для инициирования триггерного события, используемого в функциях, генерируемых в компоненте организации доступа к интерфейсу105. Для пользовательского взаимодействия с элементом управления 1 пользователь может использовать пользовательские устройства ввода для ввода пользователем информации, такие как клавиатура, мышь и т.д. Возможно применение голосового управления.

[59] Компонент преобразования действий пользователя 104 преобразовывает действия пользователя в класс behavior (рус. поведение). Behavior - это класс, обрабатывающий конкретные действия пользователя перехватываемые при помощи компонента преобразования действий пользователя 103. Например, может использоваться behavior, обрабатывающий добавление элементов управления 1 на форму, а также behavior изменения размера элемента управления 1, размера всей формы и т.д. Behavior является базовым классом для обобщенных определяемых пользователем реакций на произвольные условия и события. Это может быть реализовано посредством инициализации нового экземпляра класса behavior и присвоением ему определенных свойств и методов, зависящих от действия пользователя.

[60] Например, в качестве свойства может применяться возвращение типа элементов управления 1, с которым может быть связано это действие behavior. В другом варианте, behavior может возвращать или задавать элемент управления 1, содержащий свойства, которые будут являться целевыми для привязанных свойств, относящихся к этому элементу управления 1.

[61] В качестве методов behavior могут использоваться нижеописанные методы. Например, применение привязок к элементу управления 1, содержащему свойства, которые будут являться целевыми для привязанных свойств, относящихся к этому элементу управления 1. Возможно также предусмотреть удаление ранее заданных привязок, присваивание привязок свойству и отмена применения всех заданных ранее привязок. Также в качестве метода может использоваться присвоение значения свойству и резервное хранение для свойств, разрешающих привязку к элементу управления 1. При помощи метода это значение также может очищаться или возвращаться. Может быть предусмотрен метод, возвращающий логическую «1» в случае, если целевое свойство behavior существует или задано.

[62] Компонент преобразования действий пользователя 104 также может распознавать, была ли пользователем добавлена новая функция в элемент управления. В случае если была, то компонент преобразования действий пользователя может передавать функцию в компонент организации доступа к интерфейсу 105.

[63] В частности, компонент преобразования действий пользователя 104 может детектировать добавление пользователем элемента управления 1 в среду редактирования 100, в результате чего будет триггериться визуализация элемента управления 1 в среде редактирования 100.

[64] Компонент организации доступа к интерфейсу 105 может быть выполнен с возможностью хранения функций и/или действий пользователя и их накапливания. Таким образом, в интерфейсе организовывается возможность применения и/или отмены функций/действий пользователя. Компонент организации доступа к интерфейсу 105 может накапливать изменения, внесенные пользователем в функции элементов управления 1 в виде списка операций, произведенных пользователем, для того чтобы любое изменение могло быть применено, отменено или возвращено (undo/redo). Одним из примеров хранение действий пользователя является хранение действия пользователя по добавлению элемента управления 1 в среду редактирования 100.

[65] При взаимодействии компонента преобразования действий пользователя 104 и компонента организации доступа к интерфейсу 105 может происходить следующее. Пользователь добавляет элементу правления 1 в среду редактирования 100. Компонент преобразования действий пользователя 104 детектирует добавление элемента управления 1 и оповещает компонент организации доступа к интерфейсу 105 о том, что элемент управления 1 был добавлен. Компонент организации доступа к интерфейсу 105 сохраняет действие по добавлению этого элемента управления 1.

[66] Компонент хранения элементов управления 106 отвечает за загрузку, хранение и сохранение элементов управления 1. При этом компонент хранения элементов управления 106 может создавать макет, включающий элемент управления 1, с привязкой элементу управления 1 к конкретному месту на макете. Каждый визуализированный при помощи компонента визуализации в среде редактирования 101 элемент управления 1 привязан к своему элементу управления 1. Это позволяет при изменении элемента управления 1, т.е. при добавлении к нему функций, передавать информацию компоненту визуализации в среде редактирования 101 для перестроения визуализации элемента управления 1 в режиме реального времени. Элемент управления 1 может быть представлен, например, в виде json-структуры. Таким образом, пользователь сможет сохранять созданные или сгенерированные элементы управления 1 для последующего их использование в других элементах управления 1/формах или в другом программном обеспечении. Пользователи, которые не создают и не генерируют функции сами, смогут добавлять в свои элементы управления 1 ранее созданные и сохраненные элементу управления 1, сохраненные компонентом хранения элементов управления 106. Они смогут это делать путем перетаскивания функции на элемент управления 1 или при помощи специальной кнопки «добавить элементу правления», содержащейся в панели инструментов редактирования интерфейса 2. Элементы управления 1 могут сохранять в базе данных элементов управления (на Фигурах не показана).

[67] В предпочтительном варианте добавление логики и функций элементу управления 1 для пользователя предполагает его взаимодействие с редакторами свойств элементов управления 1, а также создания функций элемента управления 1 на основе визуального программирования при помощи интерфейса прикладного программирования.

[68] При взаимодействии компонента преобразования действий пользователя 104, компонента организации доступа к интерфейсу 105 и компонента хранения элементов управления 106 может происходить следующее. Пользователь добавляет элементу правления 1 в среду редактирования 100. Компонент преобразования действий пользователя 104 детектирует добавление элемента управления 1 и оповещает компонент организации доступа к интерфейсу 105 о том, что элемент управления 1 был добавлен. Компонент организации доступа к интерфейсу 105 сохраняет действие по добавлению этого элемента управления 1 и передает элемент управления 1 в компонент хранения элементов управления 106, а также информацию о действии пользователя, включающую, в частности, место расположения элемента управления 1. Компонент хранения элементов управления 106 сохраняет элемент управления 1 и создает макет, включающий этот элемент управления 1, с привязкой элементу управления 1 к конкретному месту на макете на основании о месте расположения элемента управления 1.

[69] При этом возможно также исключение компонента организации доступа к интерфейсу 105 из системы. В таком случае, компонент преобразования действий пользователя 104 может передавать информацию о действиях пользователя и элементы управления 1 напрямую компоненту хранения элементов управления 106. Также в этом случае не будут накапливаться действия пользователя, что немного снизит требуемую вычислительную мощность системы, однако лишит пользователя возможности отменять, возвращать и применять ранее накопленные действия.

[70] Компонент хранения и обработки данных 107 при этом может преобразовывать функции в конкретный типизованный набор данных, стандартный для элементов управления 1. Это может быть нужно, например, если функции были написаны на человекочитаемом языке и/или если они были описаны на отличном от используемого элементами управления 1 языке программирования. Таким образом, в макет компонентом хранения элементов управления 106 будет добавляться только функции, написанные при помощи определенного языка программирования.

[71] Компонент загрузки 204, включающийся в среду выполнения 200, отвечает за получение макета, включающего по крайней мере один элемент управления 1, функций для визуализации и жизненного цикла элемента управления 1, включающего структуру элемента управления 1 и пользовательские настройки (функции), от компонента хранения элементов управления 106. Также компонент загрузки 204 может производить сохранение и загрузку новых функций в результате взаимодействия пользователя с элементом управления 1 в программном обеспечении. Компонент загрузки 204 может осуществлять взаимодействие только с компонентом визуализации в среде выполнения 201. Компонент загрузки 204 при получении функций внешних источников, преобразовывает их в машиночитаемый язык элементов управления 1. Также им 204 может быть реализована обратная операция, а именно преобразование функций элементов управления в машиночитаемый или человекочитаемый язык, понятный внешнему источнику. Под внешним источником может пониматься пользователь, стороння программа, сторонний интерфейс прикладного программирования, компонент организации доступа к интерфейсу 105 в случае, если функции в нем были созданы не на машиночитаемом языке элементов управления 1, и др.

[72] Компонент рендеринга 205 состоит из совокупности высокопроизводительных обработчиков, позволяющих отобразить элементу правления 1 в программном обеспечении пользователя на основании функций элементу управления 1, а также обеспечить отложенный рендер изначально скрытых функций, но появляющихся в результате взаимодействия пользователя с элементом управления 1. Компонент рендеринга 205 также взаимодействовать только с компонентом визуализации в среде выполнения 201.

[73] Одной из особенностей среды выполнения 200 является алгоритм, обеспечивающий максимально быструю визуализацию элемента управления 1 в программном обеспечении. Это достигается посредством следующих решений. При получении данных с сервера формируются быстрые карты ключ-значение для организации связи между функциями и элементами управления 1, что, в свою очередь, позволяет сформировать специальные дата-объекты, описывающие элементы управления 1 с точки зрения их привязки к функциям и положению в структуре форм. Далее сформированные дата-объекты передают в компонент рендеринга 205, где к каждому дата-объекту применяется шаблон-функция, генерирующая строки кода. Все привязки к объектной модели формируются внутри строчной структуры кода. Далее строчная структура кода добавляется в объектную модель по средствам интерфейса программного обеспечения. Так как при визуализации элемента управления 1 минимизируют операции с объектной моделью, а все пользовательские функции добавляют только после начала взаимодействия пользователя с элементом управления 1, который ими обладает, то это позволяет сосредоточить ресурсы браузера на обновлении одной объектной модели в браузере, а не на всех сразу. Данный подход позволяет добиться среднего целевого показателя в 150 миллисекунд на форму из 1000 элементов управления 1. Важную роль в данном алгоритме так же играют шаблоны-функции элементов управления 1, основывающиеся на объединении строк. Для каждого элемента управления 1 существует своя функция, позволяющая ему быстро генерировать строки кода. Позднее связывание же элементов управления 1 и объектной модели осуществляется на основе идентификаторов (ключ-значение), генерация которых происходит в реальном времени в момент первого рендера компонентом рендеринга 205 и производится только при необходимости, когда пользователь начал взаимодействовать с элементом управления 1. При наличии пользовательской функции события, ее генерация происходит в момент первого обращения к нему. Таким образом функции, ни разу не потребовавшиеся, не генерируются, а элементы управления 1, с которыми не взаимодействовал пользователь, не связываются с объектной моделью.

[74] Объектная модель при этом представляет собой объектную модель документа (DOM, от англ. Document Object Model). Это независящий от платформы и языка программный интерфейс, позволяющий программам и скриптам получить доступ к содержимому HTML-, XHTML- и XML-документов, а также изменять содержимое, структуру и оформление таких документов.

[75] Совокупное применение компонента преобразования действий пользователя 104, компонента организации доступа к интерфейсу 105 и компонента хранения элементов управления 106 представляет собой частный вариант воплощения модуля взаимодействия с визуализатором в среде редактирования 103, а совокупное применение компонента загрузки 204 и компонента рендеринга 205 - модуля взаимодействия с визуализатором в среде редактирования 203.

[76] Система, показанная на Фиг. 2, работает следующим образом. Пользователь добавляет элемент управления 1 в интерфейс среды редактирования 100. В момент добавления элемент управления 1 генерирует строки кода в интерфейс 2. При помощи интерфейса 2 полученный код передают в компонент визуализации в среде редактирования 101 и в среде выполнения 201. Компонент преобразования действий пользователя 104 детектирует добавление пользователем элемента управления 1 и передает это действие в компонент организации доступа к интерфейсу 105. Компонент организации доступа к интерфейсу 105 передает это действие в компонент хранения элементов управления 106, который в свою очередь, создает макет с этим элементом управления 1 и передает созданный макет компоненту визуализации в среде редактирования 101. Далее компонент интеграции в среде редактирования 102 оповещает компонент визуализации в среде редактирования 101 о том, в какой области визуализировать элемент управления 1. А компонент визуализации в среде редактирования 101 визуализирует элемент управления 1 в среде редактирования 100, а именно в интерфейсе визуального редактора. Компонент интеграции в среде редактирования 102 интегрирует элемент управления 1 в среду редактирования 100, а именно в интерфейс визуального редактора. При этом у пользователя появляется возможность взаимодействия с элементом управления 1 в интерфейсе визуального редактора, т.е. становится возможным вносить изменения в элемент управления. Приблизительно в одно время, спустя какое-то время или одновременно с визуализацией элемента управления 1 в среде редактирования 100 визуализируют элемент управления 1 в среде выполнения 200, а именно в интерфейсе программного обеспечения. Для этого сначала передают созданный макет компоненту загрузки 204 при помощи компонента хранения элементов управления 106, который, в свою очередь, передает макет в компонент рендеринга 205. Компонент рендеринга 205 по макету получает строки кода, сгенерированные по крайней мере одним элементом управления 1 и передает макет со строками кода в компонент визуализации в среде выполнения 201. Компонент интеграции в среде выполнения 202 оповещает компонент визуализации в среде выполнения 201 о том, в какой области визуализировать элемент управления 1. Компонент визуализации в среде выполнения 201 на основании макета и строк кода визуализирует элемент управления 1 в среде выполнения 200 в области. Компонент интеграции в среде выполнения 202 интегрирует элемент управления 1 в среду выполнения 200, а именно в интерфейс программного обеспечения. При этом у пользователя программного обеспечения появляется возможность взаимодействовать с элементом управления 1 в программном обеспечении.

[77] При этом то, что этапы визуализации элемента управления 1 в среде выполнения 200 могут производиться спустя какое-то время, подразумевает, что визуализацию производят, например, только после сохранения элемента управления 1 в среде редактирования 100.

[78] Также после визуализации элемента управления 1 в среде визуального редактора 100 пользователь взаимодействует с элементом управления 1 и его функциями. Во время взаимодействия с элементом управления 1, компонент преобразования действий пользователя 104 распознает действия пользователя и преобразовывает их в машиночитаемый код для того, чтобы система в целом откликалась на действия пользователя. В среде редактирования 100 при помощи интерфейса 2 пользователь добавляет функции элементу управления 1, например, одним из трех вышеописанных способов. Компонент преобразования действий пользователя 104 передает сегрегированные функции в компонент организации доступа к интерфейсу. Компонент организации доступа к интерфейсу 105 накапливает функции. После чего, эти функции могут быть переданы компоненту хранения элементов управления 106. Таким образом, сгенерированные функции привязываются к конкретному элементу управления 1, после чего элемент управления 1 с функциями могут передать в базу данных элементов управления для последующего использования. Из компонента хранения элементов управления 106 функции могут быть переданы в среду выполнения 200. Их можно передать компоненту загрузки 204 напрямую. Компонент загрузки 204, в свою очередь, хранит функции с привязкой к конкретному элементу управления 1 в среде выполнения 200. Он 204 также может преобразовывать функции в машиночитаемый язык элементов управления 1. При взаимодействии пользователя с элементом управления 1 в среде выполнения 200, компонент рендеринга 204 подгружает функции конкретного элемента управления 1 этому элементу управления 1 и передает их в компонент визуализации в среде выполнения 201. Компонент визуализации в среде выполнения 201, в свою очередь, визуализирует полученные функции. Таким образом, элемент управления 1 обретает функционал, заданный добавленной функцией, наряду с визуальным воплощением.

[79] Например, если пользователь добавил элемент управления 1 «кнопка» в среду редактирования 100, а затем при помощи интерфейса 2 задал функцию «кнопке», заключающуюся в том, что при нажатии пользователем на «кнопку», «кнопка» меняет цвет, то в среде выполнения 200 эта функция не будет сразу же преобразована и загружена. Функция загрузится или добавится в элемент управления 1 только в момент взаимодействия с «кнопкой» пользователя, то есть в момент нажатия. А затем будет провизуализирована при помощи компонента визуализации в среде выполнения 201.

[80] На Фиг. 3 изображена блок-схема, иллюстрирующая способ динамической визуализации элементов программного обеспечения, в соответствии с настоящим изобретением. Согласно нему, сначала добавляют элемент управления 1 в среду редактирования 100. После этого, при помощи элемента управления 1 генерируют код в интерфейс 2. Интерфейс 2 передает код в компонент визуализации в среде редактирования 101. Далее получают информацию от компонентов интеграции в среде редактирования 102 и в среде выполнения 202 о том, в каком месте визуализировать элемент управления 1 в среде редактирования 100 и в среде выполнения 200 соответственно. После этого создают макет с по крайней мере одним элементом управления 1 и передают макет компоненту визуализации в среде редактирования 101 при помощи модуля взаимодействия с визуализатором в среде редактирования 103. При помощи компонента визуализации в среде редактирования 101 визуализируют элемент управления 1 в среде редактирования 100. Компонент интеграции в среде редактирования 102 интегрирует элемент управления 1 в среду редактирования 100, а именно в интерфейс визуального редактора. При этом у пользователя появляется возможность взаимодействия с элементов управления 1 в интерфейсе визуального редактора, т.е. становится возможным вносить изменения в элемент управления. Приблизительно в одно время, спустя какое-то время или одновременно с визуализацией элемента управления 1 в среде редактирования 100 визуализируют элемент управления 1 в среде выполнения 200, а именно в интерфейсе программного обеспечения, при помощи компонента визуализации в среде выполнения 201. Причем, перед визуализацией при помощи модуля взаимодействия с визуализатором в среде выполнения 203 получают макет с по крайней мере одним элементом управления 1 от модуля взаимодействия с визуализатором в среде редактирования 203 и передают макет компоненту визуализации в среде выполнения 201. Компонент интеграции в среде выполнения 202 интегрирует элемент управления 1 в среду выполнения 200, а именно в интерфейс программного обеспечения. При этом у пользователя программного обеспечения появляется возможность взаимодействовать с элементом управления 1 в программном обеспечении.

[81] В среде редактирования 100 могут производиться дополнительные этапы способа динамической визуализации элементов программного обеспечения, показанные на Фиг. 4. Таким образом, после этапа интеграции элемента управления 1 в программное обеспечение визуального редактора могут генерировать по крайней мере одну функцию для интегрированного элемента управления 1 при помощи интерфейса 2 посредством взаимодействия пользователя с элементом управления 1. Генерация функций может быть реализована, например, одним из трех способов, описанных выше. В момент взаимодействия, компонент преобразования действий пользователя 104 обрабатывает действия пользователя и распознает, была ли пользователем сгенерирована функция. После, по крайней мере одна сгенерированная функция может быть передана в компонент организации доступа к интерфейсу 105, при помощи которого накапливают переданные ему функции. Далее функции могут быть переданы компонент хранения элементов управления 106, который обновляет ранее созданный макет посредством добавления функций в элемент управления 1. Таким образом, сгенерированные функции привязываются к конкретному элементу управления 1, после чего элемент управления 1 с функциями могут передать в базу данных элементов управления для последующего использования и/или могут передать макет, включающий по крайней мере один элемент управления 1 с по крайней мере одной привязанной функцией.

[82] В среде выполнения 200 могут производиться дополнительные этапы способа динамической визуализации элементов программного обеспечения, показанные на Фиг. 5. После интеграции элемента управления 1 в программное обеспечения пользователь может провзаимодействовать с элементом управления 1 в среде выполнения 200. В момент взаимодействия загружают функции, связанные с конкретным взаимодействием с конкретным элементом управления 1, из компонента загрузки 204 в компонент рендеринга 205. После этого при помощи компонента рендеринга 205 осуществляют отложенный рендеринг функций элемента управления 1. А именно передают функции в компонент визуализации в среде выполнения 201 и визуализируют элемент управления 1 при помощи компонента визуализации в среде выполнения 201.

[83] При объединении дополнительных этапов, показанных на Фиг. 4 и Фиг. 5, этапы, производящиеся после добавления пользователем функций в элемент управления, могут быть реализованы следующим образом. После этапа интеграции элемента управления 1 в программное обеспечение визуального редактора могут генерировать по крайней мере одну функцию для интегрированного элемента управления 1 при помощи интерфейса 2 посредством взаимодействия пользователя с элементом управления 1. Генерация функций может быть реализована, например, одним из трех способов, описанных выше. В момент взаимодействия, компонент преобразования действий пользователя 104 обрабатывает действия пользователя и распознает, была ли пользователем сгенерирована функция. После, по крайней мере одна сгенерированная функция может быть передана в компонент организации доступа к интерфейсу 105, при помощи которого накапливают переданные ему функции. Далее функции могут быть переданы компонент хранения элементов управления 106, который обновляет ранее созданный макет посредством добавления функций в элемент управления 1. Таким образом, сгенерированные функции привязываются к конкретному элементу управления 1, после чего элемент управления 1 с функциями могут передать в базу данных элементов управления для последующего использования. Из компонента хранения элементов управления 106 функции могут быть переданы в среду выполнения 200, а именно в компонент загрузки 204. Далее пользователь может провзаимодействовать с элементом управления 1 в среде выполнения 200. В момент взаимодействия при помощи компонента загрузки 204 передают функции, связанные с конкретным взаимодействием с конкретным элементом управления 1, в компонент рендеринга 205. После этого при помощи компонента рендеринга 205 осуществляют отложенный рендеринг функций элемента управления 1. А именно передают функции в компонент визуализации в среде выполнения 201 и визуализируют элемент управления 1 при помощи компонента визуализации в среде выполнения 201.

[84] На Фиг. 6 изображен способ динамической визуализации элементов программного обеспечения, используемый в системе визуализации элементов программного обеспечения, показанной на Фиг. 2. Согласно нему, сначала добавляют элемент управления 1 в среду редактирования 100. После этого, при помощи элемента управления 1 генерируют код в интерфейс 2. При помощи интерфейса 2 полученный код передают в компонент визуализации в среде редактирования 101. Компонент преобразования действий пользователя 104 детектирует добавление пользователем элемента управления 1 и передает это действие в компонент организации доступа к интерфейсу 105. Компонент организации доступа к интерфейсу 105 передает это действие в компонент хранения элементов управления 106, который в свою очередь, создает макет с этим элементом управления 1 и передает созданный макет компоненту визуализации в среде редактирования 101. Далее компонент интеграции в среде редактирования 102 оповещает компонент визуализации в среде редактирования 101 о том, в какой области визуализировать элемент управления 1. А компонент визуализации в среде редактирования 101 визуализирует элемент управления 1 в среде редактирования 100, а именно в интерфейсе визуального редактора. Компонент интеграции в среде редактирования 102 интегрирует элемент управления 1 в среду редактирования 100, а именно в интерфейс визуального редактора. При этом у пользователя появляется возможность взаимодействия с элементом управления 1 в интерфейсе визуального редактора, т.е. становится возможным вносить изменения в элемент управления. Приблизительно в одно время, спустя какое-то время или одновременно с визуализацией элемента управления 1 в среде редактирования 100 визуализируют элемент управления 1 в среде выполнения 200, а именно в интерфейсе программного обеспечения. Для этого сначала передают созданный макет компоненту загрузки 204 при помощи компонента хранения элементов управления 106, который, в свою очередь, передает макет в компонент рендеринга 205. Компонент рендеринга 205 по макету получает строки кода, сгенерированные по крайней мере одним элементом управления 1 и передает макет со строками кода в компонент визуализации в среде выполнения 201. Компонент интеграции в среде выполнения 202 оповещает компонент визуализации в среде выполнения 201 о том, в какой области визуализировать элемент управления 1. Компонент визуализации в среде выполнения 201 на основании макета и строк кода визуализирует элемент управления 1 в среде выполнения 200 в области. Компонент интеграции в среде выполнения 202 интегрирует элемент управления 1 в среду выполнения 200, а именно в интерфейс программного обеспечения. При этом у пользователя программного обеспечения появляется возможность взаимодействовать с элементом управления 1 в программном обеспечении.

[85] При этом то, что этапы визуализации элемента управления 1 в среде выполнения 200 могут производиться спустя какое-то время, подразумевает, что визуализацию производят, например, только после сохранения элемента управления 1 в среде редактирования 100.

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

Claims (54)

1. Система динамической визуализации элементов программного обеспечения, включающая:

• среду выполнения, включающую по крайней мере

компонент визуализации элемента управления в среде выполнения;

компонент интеграции в среде выполнения, сконфигурированный для интеграции элемента управления в программное обеспечение; и

модуль взаимодействия с визуализатором в среде выполнения, сконфигурированный с возможностью получения и передачи макета и включающий компонент рендеринга, подключенный к компоненту визуализации элемента управления в среде выполнения и сконфигурированный с возможностью отложенной подгрузки функций элемента управления,

подключенные друг к другу,

• среду редактирования, включающую по крайней мере

компонент визуализации элемента управления в среде редактирования;

компонент интеграции в среде редактирования, сконфигурированный для интеграции элемента управления в визуальный редактор; и

модуль взаимодействия с визуализатором в среде редактирования, сконфигурированный с возможностью создания макета и подключенный к модулю взаимодействия с визуализатором в среде выполнения,

подключенные друг к другу,

• и интерфейс с по крайней мере одним элементом управления, подключенным к компоненту визуализации элемента управления в среде выполнения и к компоненту визуализации элемента управления в среде редактирования и сконфигурированным с возможностью генерации строк кода.

2. Система динамической визуализации элементов программного обеспечения по п. 1, отличающаяся тем, что модуль взаимодействия с визуализатором в среде редактирования дополнительно включает компонент преобразования действий пользователя, подключенный к компоненту визуализации элемента управления в среде редактирования и сконфигурированный для обработки действий пользователя.

3. Система динамической визуализации элементов программного обеспечения по п. 2, отличающаяся тем, что модуль взаимодействия с визуализатором в среде редактирования дополнительно включает компонент организации доступа к интерфейсу, подключенный к компоненту преобразования действий пользователя.

4. Система динамической визуализации элементов программного обеспечения по п. 3, отличающаяся тем, что модуль взаимодействия с визуализатором в среде редактирования дополнительно включает компонент хранения элементов управления, подключенный к интерфейсу компоненту организации доступа к интерфейсу и к компоненту визуализации элемента управления в среде редактирования.

5. Система динамической визуализации элементов программного обеспечения по п. 1, отличающаяся тем, что модуль взаимодействия с визуализатором в среде выполнения дополнительно включает компонент загрузки, подключенный к компоненту визуализации элемента управления в среде выполнения и к компоненту хранения элементов управления.

6. Система динамической визуализации элементов программного обеспечения по п. 5, отличающаяся тем, что компонент рендеринга дополнительно подключен к компоненту загрузки.

7. Система динамической визуализации элементов программного обеспечения по п. 1, отличающаяся тем, что дополнительно включает компонент хранения и обработки данных, подключенный к компоненту хранения элементов управления.

8. Система динамической визуализации элементов программного обеспечения по п. 1, отличающаяся тем, что дополнительно включает базу данных элементов управления, включающую по крайней мере один элемент управления.

9. Способ динамической визуализации элементов программного обеспечения, по которому:

• добавляют элемент управления в среду редактирования;

• генерируют строки кода при помощи элемента управления;

• передают сгенерированные строки кода в интерфейс;

• преобразовывают код при помощи интерфейса;

• передают код в компонент визуализации элемента управления в среде редактирования;

• получают информацию от компонента интеграции в среде редактирования о месте визуализации элемента управления в среде редактирования;

• создают макет, включающий добавленный элемент управления;

• визуализируют созданный макет в среде редактирования;

• интегрируют элемент управления в визуальный редактор;

• передают созданный макет в модуль взаимодействия с визуализатором в среде выполнения;

• визуализируют полученный макет в среде выполнения;

• интегрируют элемент управления в программное обеспечение;

• подгружают функции элемента управления при взаимодействии пользователя с элементом управления при помощи компонента рендеринга.

10. Способ динамической визуализации элементов программного обеспечения по п. 9, отличающийся тем, что на этапе создания макета:

• детектируют добавление пользователем элемента управления при помощи компонента обработки действий пользователя;

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

• применяют действие пользователя при помощи компонента хранения элементов управления.

11. Способ динамической визуализации элементов программного обеспечения по п. 9, отличающийся тем, что после передачи созданного макета в модуль взаимодействия с визуализатором в среде выполнения:

• получают созданный макет при помощи компонента загрузки;

• передают полученный макет компоненту рендеринга.

• получают строки кода, сгенерированные элементом управления, включающимся в полученный макет, при помощи компонента рендеринга;

• передают полученный макет со строками кода в компонент визуализации в среде выполнения.

12. Способ динамической визуализации элементов программного обеспечения по п. 9, отличающийся тем, что после этапа интеграции элемента управления в программное обеспечение в среде редактирования, пользователь взаимодействует с элементом управления и при помощи компонента преобразования действий пользователя обрабатывают действие пользователя с элементом управления.

13. Способ динамической визуализации элементов программного обеспечения по п. 12, отличающийся тем, что генерируют функцию при помощи интерфейса и передают данные о функции компоненту организации доступа к интерфейсу.

14. Способ динамической визуализации элементов программного обеспечения по п. 13, отличающийся тем, что сохраняют сгенерированную функцию при помощи компонента организации доступа к интерфейсу.

15. Способ динамической визуализации элементов программного обеспечения по п. 14, отличающийся тем, что передают функцию в компонент хранения элементов управления и обновляют созданный макет посредством добавления функций в элемент управления при помощи компонента хранения элементов управления.

16. Способ динамической визуализации элементов программного обеспечения по п. 15, отличающийся тем, что после этапа обновления созданного макета:

• передают макет с загруженными функциями в компонент загрузки и

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

17. Способ динамической визуализации элементов программного обеспечения по п. 16, отличающийся тем, что после передачи загруженных функций в компонент рендеринга:

• получают строки кода, сгенерированные элементом управления, включающимся в полученный макет, при помощи компонента рендеринга;

• передают полученный макет со строками кода в компонент визуализации в среде выполнения;

• визуализируют макет, включающий элемент управления с функциями, при помощи компонента визуализации в среде выполнения.

18. Способ динамической визуализации элементов программного обеспечения по п. 15, отличающийся тем, что перед этапом обновления созданного макета загружают функции из компонента хранения и обработки данных в компонент хранения элементов управления.

Images