Пример текста

Данный раздел содержит описание примера реализации элемента управления Пример текста.

Ссылка на пример на GitHub: TextBox.

Пример требует подключенного расширения программы Конструктор Web-разметок UrlProprtyDesignerExtension.

Пример рассчитан на версию Web-клиента 6.1 или выше.

Перечень необходимых инструментов:

Проект "TextBoxDesignerExtension"

  1. Проект-расширение для конструктора разметок. Содержит описание элемента управления Пример текста для программы Конструктор Web-разметок.

  2. Демонстрирует описание и подключение нового ЭУ, используя класс ControlTypeDescription, задание ему стандартных свойств, реализованных в программе Конструктор Web-разметок[1] и добавление собственного свойства, используя класс PropretyDescription [2].

Проект "CheckBoxWebExtension"

Проект-расширение клиентской части Web-клиента. Содержит клиентский скрипт, формирующий поле ввода текста и картинку (свойство Url), и стили для ЭУ Пример текста.

Сборка и установка

  1. Откройте /Samples.sln.

  2. Соберите проект Controls > TextBox > TextBoxDesignerExtension.

  3. Откройте консоль в папке Controls > TextBox > TextBoxWebExtension и выполните команду npm install, затем npm update и в конце npm run build:prod.

  4. Скопируйте каталог SamplesOutput\Plugins\TextBoxDesignerExtension в каталог Путь к директории с исполняемым файлом конструктора Web-разметок\Plugins.

  5. Скопируйте каталог SamplesOutput\Content\Modules\TextBoxWebExtension в каталог Путь к сайту Web-клиента\Content\Modules.

  6. Выполните инструкции по сборке и установке примера ControlProperties > Url.

  7. Перезапустите dvwebclient.

Проверка примера

  1. Запустите конструктор разметок.

  2. Скопируйте любую разметку редактирования.

    Пример рассчитан только на работу в разметках редактирования.

  3. Выберите условия использования этой разметки.

  4. Откройте разметку и добавить в нее новый элемент управления Пример текста.

  5. Задайте желаемые параметры элемента управления.

    При указании URL адрес должен быть доступен согласно политике CORS. Большинство серверов не разрешают запросы из веб-приложений, расположенных на других доменах. Политике CORS гарантированно удовлетворяют адреса внутри Web-клиента, например Content/App/Assets/Images/favorite-empty.svg.

  6. Сохраните разметку.

  7. Перезапустите dvwebclient.

  8. Откройте карточку с этой разметкой.

  9. Убедитесь, что появился новый элемент управления.

1. См. PropertyFactory.GetNameProperty()
2. См. свойство Url