Создание виджетов (widgets) в 1С

06.07.16

Разработка - Работа с интерфейсом

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

Какие элементы 1С мы можем использовать в качестве виджетов?

Для представления информации в 1С есть достаточно большое количество инструментов. Это могут быть сообщения, возникающие при взаимодействии с полями формы, элементы «поле картинки», предоставляющие нам какие-то интерактивные возможности, или элементы типа «графическая схема». Этот богатый набор может использоваться нами для различных целей.

Так почему же нам так захотелось сделать что-то по-другому?

Причин может быть множество, начиная от какого-то мелкого улучшения, которое не может дать нам стандартный интерфейс 1С – что-то, что сделано чуть-чуть по-другому, чуть-чуть не так, когда то, что хочет заказчик, нельзя реализовать средствами 1С, и до любимой кнопки заказчика «Сделать все».

Конечно, для расширения интерфейса чаще мы обычно используем объекты внутри 1С, такие как:

  • Табличное поле;
  • Графическая схема;
  • Географическая схема;
  • Поле картинки.

Причем мы можем их использовать не только по прямому назначению, как рекомендует 1С, мы также можем использовать и какие-то нестандартные практики.

К примеру, среди разработчиков 1С очень популярно табличное поле. Оно очень хорошо отлажено и используется практически везде. Диаграмма Ганта на табличном поле очень хорошо работает.

Но сегодня мы все-таки поговорим про специфическое поле внутри 1С - прополе HTML. Мы попробуем разобраться, как его можно использовать для того, чтобы привнести в интерфейс 1С какую-то изюминку (обратите внимание, на скриншоте показан пример, взятый с сайта 1С – уних тоже была когда-то такая задумка).

Поле HTML документа и его особенности

Тот, кто говорит, что облако – это не для него, мягко говоря, не прав. Если компьютер в интернете – все, вы в облаке.

Чем же хороши интернет-технологии?

  • Во-первых, они основаны на стандартах, которые исходят от независимого источника, а значит, они не зависят от конкретного производителя.
  • Во-вторых, они обладают кросс-платформенностью.
  • И, наконец, у них огромная распространенность. Я думаю, вы прекрасно представляете, что эта распространенность гораздо больше, чем у 1С.

А что мы имеем для поля HTML в 1С?

  • В версии 1С для Windows и в тонком, и в толстом клиентеполе HTML – это ActiveX. Хоть 1С нам и говорит, что у нее ActiveX уже нет, мы можем легко проверить, что даже в самой последней версии тонкого клиента поле HTML – это ActiveX.
  • Поле HTMLработает в режиме совместимости.
  • Хуже того, этот режим совместимости не является чисто IE6,  IE7,  IE8 и т.д. – там своя реализация.
  • И самое главное, поле HTML обладает низкой производительностью по отношению к современным браузерам.

Обратите внимание на такую особенность: если мы запустим в HTML-поле простейший JavaScript-код, выводящий версию движка, то мы увидим, что этот код выполняется два раза – происходит двойная инициализация.

Как видите, согласно полученной здесь информации, движок HTML-поля соответствует версии браузера IE7.

Я думаю, многие из вас уже знают, что есть «волшебная палочка», позволяющая «обмануть» этот движок и заставить его работать в режиме совместимости с конкретной версией (IE=8 или IE=9, или  IE=edge – это последний, можно установить более точно, кто как хочет), это метастрока:

<meta http-equiv="X-UA-Compatible" content="IE=edge">

Но даже она не всегда помогает.

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

  • Первая инициализация нам говорит, что у нас IE11;
  • А вторая вам все равно выдаст IE7. Это значит, что стилевое оформление начнет работать в режиме IE11, но основной контекст (когда вы нажимаете кнопочки) все равно будет работать в старом режиме.

Мы все, конечно, ругаем Windows, и надеемся получить идеальную картину в Linux. Но и там своя специфика:

  • Например, компания 1С до сих пор не давала точных данных о том, какой движок webkit они используют.
  • Смещения внутри поля HTML у нихотличаются.
  • И координаты мыши там также отличаются (если кто пробовал, заметил).
  • Соответственно, вы получаете неидентичность работы в Windows-клиенте и в Linux-клиенте.

А что нам говорит сама документация по 1С? Если идентичность не достигнута, виноват разработчик. И это – та идеология, которую нужно принять для того, чтобы двигаться дальше. Вы, как разработчик, должны продумать все тонкие моменты так, чтобы у вас все четко работало.

Если у вас все еще осталось желание работать с полем HTML, я предлагаю один из возможных способов улучшения нашего интерфейса.

Инструмент для улучшения работы HTML-поля

Для улучшения работы HTML-поля вы можете использовать универсальную библиотеку Raphael, запускающую код JavaScript внутри 1С.

Библиотека Raphael обладает следующими преимуществами:

  • Она полностью поддерживает старые версии браузеров – работает в старых версиях IE, в GoogleChrome, вFireFox, и даже внутри 1С в Linux-клиенте.
  • Не зависит от внешних библиотек, даже от jquery.
  • Имеет достаточно малый размер.
  • Очень популярна: можно в интернете найти сайты с описанием документации, и как она работает.
  • А также она имеет полностью открытую лицензию использования. За это надо благодарить разработчика этой библиотеки.

Что мы получаем при ее использовании?

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

Взаимодействие с пользователем по технологии HTML-контейнера

Как мы можем взаимодействовать с пользователем, используя поле HTML?

  • В противовес продвижению у 1С технологии клиент-серверного взаимодействия;
  • При использованииHTML-поля мы приходим к технологии HTML-контейнера внутри клиента 1С.

Жизнь внутри этого контейнера полностью зависит от вас:

  • Внутреннее наполнение делаете полностью вы.
  • Реакцию на внешние события определяете тоже вы.
  • И, соответственно, конфликты с 1С тоже разбираете вы.

Здесь вы можете видеть пример графика, построенного на HTML-поле с использованием этой технологии.

Взаимодействие с 1С

Хочу остановиться на особенностях взаимодействия с 1С.

  • В управляемых формах нам оставили один-единственный метод интерактивного взаимодействия – это метод «ПриНажатии».
  • Нам кажется, что нас полностью ограничили и ничего нам не дали. Это не совсем так. Мы можем использовать один из интересных методов, который заключается в обработке событий ПриНажатии для невидимых элементов. Например, в концепции 1С, если мы ставим галочку «невидимый» в интерфейсе, то на клиенте мы вообще не получаем этого элемента, сервер просто не передает его на клиент. Это факт. А в интернет-технологиях, в отличие от 1С, невидимые элементы присутствуют в интерфейсе и могут использоваться для взаимодействия с пользователем. Он имеет свойства, и он может генерировать события. В частности, мы можем использовать событие для эмуляции внешних событий от нашего HTML-поля.
  • Внутри этой эмуляции, соответственно, мы можем передавать данные. Самое простое – это передавать их строкой.
  • Если вам необходима более сложная передача данных, вы можете использовать JSON. В последних версиях JSON встроен в платформу. Если у вас менее новая версия, то благодаря Инфостарту вы тоже можете использовать JSON полностью.

Проблемы быстродействия

Однако самая главная проблема, с которой вы столкнетесь при использовании технологииHTML-контейнера, – это проблема быстродействия.

Все остальные проблемы (несовместимость, неправильная компоновка, чуть-чуть различное выполнение скриптов), так или иначе, технологически преодолимы. А проблема именно быстродействия внутри 1С – очень существенна. Сделать так, чтобы содержимое поля HTML внутри самой 1С было сложным, все делало интерактивно, и при этом работало быстро, нельзя. Поэтому, когда вы захотите получить свой результат, вам нужно будет сразу же заложить эти риски на уровне архитектуры решения и вовремя предупредить клиента: «Можно использовать веб-клиент  –  там все работает, все хорошо. А внутри 1С у нас, к сожалению, старый элемент. Поэтому там долгая инициализация и низкая скорость».

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

***********

Данная статья написана по итогам доклада, прочитанного на конференции INFOSTART EVENT 2015 CONNECTION 15-17 октября 2015 года.

Приглашаем вас на новую конференцию INFOSTART EVENT 2019 INCEPTION.

См. также

Богатый редактор картинок, хранимых в базе, с возможностью РИСОВАНИЯ. Редактор внешних файлов картинок. Объект, расширяющий возможности работы с картинками из встроенного языка (Три в одном) + Обработка «Стандартизация картинок»

Работа с интерфейсом Рабочее место Платформа 1С v8.3 Управляемые формы Конфигурации 1cv8 Платные (руб)

Обработка предназначена для редактирования картинок в режиме «Предприятие», с возможностью РИСОВАТЬ на них. Поддерживается работа как в обычных формах (толстый клиент) так и на управляемых формах (тонкий клиент). Обработка позволяет редактировать как картинки, хранимые в базе, так и графические файлы с диска на файловой системе. Помимо базовых функций (изменение размеров, преобразование формата, обрезание картинки, повороты и т.п.) – редактор имеет богатый набор инструментов для рисования. Доступна функция вставки изображения из буфера обмена. Также обработка может быть использована из встроенного языка как объект для редактирования картинок. Объект может быть использован: на стороне клиента, на стороне сервера, из внешнего соединения. Данная обработка будет особенно полезна тем, кто вносит картинки в базу (изображения номенклатуры, фотографии физических лиц и т.п.). Функционал реализуется с использованием JavaScript и бесплатного ПО ImageMagick (без использования внешних компонент).

6000 руб.

16.01.2015    61707    43    59    

80

[Расширения] Динамическое управление видимостью и доступностью элементов форм (УФ) (8.3.6+)

Работа с интерфейсом Платформа 1С v8.3 Управляемые формы Конфигурации 1cv8 Платные (руб)

Механизм «Динамическое управление доступом к элементам форм объектов 1С8» предназначен для обеспечения возможности оперативного управления видимостью и доступностью элементов форм документов и справочников продуктов фирмы «1С» «1С:Предприятие 8». Решение универсальное, встраивается в любую конфигурацию с минимальными доработками, что позволяет без проблем обновлять типовые решения.

5000 руб.

14.01.2016    54320    16    21    

42

Управление дашбордами

Работа с интерфейсом Платформа 1С v8.3 Конфигурации 1cv8 Платные (руб)

Обработка предназначена для создания и управления дашбордами.

2400 руб.

29.06.2020    16625    21    4    

35

Новогоднее оформление для 1С

Работа с интерфейсом Платформа 1С v8.3 1С:Бухгалтерия 3.0 1С:Управление торговлей 11 1С:Зарплата и Управление Персоналом 3.x 1С:Управление нашей фирмой 3.0 Бесплатно (free)

Добавьте новогоднего настроения! Расширение создает декорацию в виде гирлянды на некоторых формах объектов.

27.12.2023    10567    745    elcoan    45    

106

Конструктор HTML, CSS и javascript

Инструментарий разработчика Работа с интерфейсом Платформа 1С v8.3 Конфигурации 1cv8 Абонемент ($m)

Подходит для создания web-страниц для замены управляемых форм 1С, красивых отчетов, интерфейса мобильного приложения на платформе 1С и для простых страниц веб-сайтов.

2 стартмани

10.04.2023    9486    150    acces969    31    

115

Модель состояния для MVC

Работа с интерфейсом Платформа 1С v8.3 Конфигурации 1cv8 Абонемент ($m)

"MVC плохо применима в 1С" - познакомьтесь с моделью состояния и, возможно, ваше мнение поменяется! Представленное решение является эволюционным развитием идеи реализации MVC для 1С. В новой версии добавлены DSL для описания модели состояния, а также параметризация свойств параметров и элементов формы.

1 стартмани

05.07.2022    3581    kalyaka    2    

27

Табло очереди заказов на экран телевизора

WEB-интеграция Работа с интерфейсом Платформа 1С v8.3 1С:Розница 2 Платные (руб)

Связка из веб-приложения и расширения для 1С: Розница 2.3.

3600 руб.

29.04.2022    12013    1    5    

10
Комментарии
В избранное Подписаться на ответы Сортировка: Древо развёрнутое
Свернуть все
1. vano-ekt 123 09.07.16 00:41 Сейчас в теме
delete; gashamaer; Nuuq; DrAku1a; fuxic; awk; Vladimir87; Дмитрий74Чел; Morisato; Serega-artem; Sheff; depresnjak; Сурикат; o.nikolaev; +14 Ответить
5. sikuda 673 11.07.16 16:13 Сейчас в теме
(1) vano-ekt, и я вовсе не утверждаю, что я истина в последней инстанции
Сам Борис утверждает, что когда пытаешься что-то сделать новое, чего еще никто не делал, то найдётся много старателей, которые будут крутить пальцем у веска, всячески убеждая, что все эти идеи колоссальный бред.

http://olligator.ru/publ/interesnye_fakty/boris_nuraliev/13-1-0-87

(2) o.nikolaev, (3) Makushimo,
Да есть застой стека HTML+CSS+JavaScript в 1С-Предприятии и бурное развитие в 1С-Bitrix :)
Здесь вовсе не глобальные изменения, здесь только факты как это все реально работает.

Собственно текущий проект перешел в "Панель показателей" http://widget.sikuda.ru/dashboard (скачивается беcплатно).
Но если у Ва есть что сказать новое - пишите. У меня все что нашел выложено на Инфостарте.
2. o.nikolaev 211 09.07.16 16:58 Сейчас в теме
К сожалению, такой подход - рисовать интерфейс через поле HTML документа - не очень приветствуется "конторой" (по крайней мере, сейчас) и это мягко говоря. Менять что-либо в этом плане, вроде бы, не планируется, увы. И сама возможность - использовать все богатство связки HTML+CSS+JavaScript, она, эта возможность, вроде как и есть, но, "не рекомендуется". И остается только использовать это, ну, для каких-то мелких вещей. На мой взгляд, строить аж "архитектуру" всего приложения на столь рисковом и непрочном фундаменте (устаревший компонент, нерекомендованный самим же вендором режим использования), это неразумно. Одно дело - несколько форм, несколько отчетов, совсем другое - сотни связанных объектов и тысячи единиц логики. При столкновении с какой-либо серьезной проблемой, которая, к примеру, не позволяет вам решить какую-либо бизнес-задачу, вы рискуете получить ответ "предупреждали, что не рекомендуется". К фирме тут нет, и не может быть, претензий. Поддерживать все и вся, действительно, трудно. Есть более насущные задачи. Этой заметкой, всего лишь, хочу предостеречь от излишнего оптимизма напоминанием о заклинании "не рекомендуется".
3. Makushimo 160 11.07.16 05:41 Сейчас в теме
Эта статья вида "поболтали за рюмкой чая, пока перекур"? (отвечать не нужно)
все вокруг да около, а букав получилось много,
с картинками.

Мэтры что ли уже превращаются в профессуру, которая доклады клепает ради самих докладов, чтобы много и вкусно разглагольствовать о том как много они знают ?
wildfalcon; asae; bursvit; Kostya120981; AKulakoff; dj_serega; Дмитрий74Чел; Serega-artem; +8 Ответить
4. Sheff 11.07.16 11:23 Сейчас в теме
Оставьте свое сообщение