Лайфхак с невидимостью ПоляHTMLДокумента

28.10.25

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

В данной публикации занудно и подробно по шагам расписано, как спрятать Поле HTML документа в вашей форме, сохранив эстетику.

Коллеги, всем привет!

В своей недавней публикации про конвертацию PDF в массив PNG я использовал давний приём, а именно, использование JavaScript внутри ПоляHTMLДокумента. Про данный костыль трюк написано уже немало статей, но в данной публикации я бы хотел сосредоточиться на эстетической стороне вопроса.

Ну согласитесь, некрасиво, когда на форме болтается эта свёрнутая в трубочку заплатка, из которой торчат уши. А отключить её совсем ну никак не получается. Как только мы отключаем у ПоляHTMLДокумента видимость, оно тут же превращается в тыкву перестаёт работать.

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

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

Ведь механизм страниц в УФ – это то самое, что позволяет спрятать часть элементов, при этом не отключает их видимость. Я начал проводить эксперименты и вывел идеальную формулу, как спрятать Поле HTML документа, которой с вами сейчас поделюсь.

Итак, первым шагом мы создаём группу формы Страницы, назовём его СтраницыHTMLПоле.

 

 

Внутри создаём две группы формы Страница.

 

 

Первую называем СтраницаHTMLЗаглушка, вторую СтраницаHTMLПоле:

 

 

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

 

 

Устанавливаем у неё вот такие свойства:

 

 

Во вторую группу СтраницаHTMLПоле мы размещаем непосредственно наш элемент ПолеHTMLДокумента.

В итоге наш бутерброд обретает вот такой законченный вид:

 

 

Теперь начинаем работу над внешним видом, потому что на данном этапе всё это безобразие выглядит у нас вот так:

 

 

Задаём нашему Полю HTML документа такие же параметры, что и картинке:

 

 

Также обязательно нужно отключить вывод заголовка элемента:

 

 

После этих настроек наша форма приобретает вид:

 

 

И нам остался всего лишь один шаг – у нашей группы страниц отключаем Отображение страниц:

 

 

Теперь наша форма выглядит так:

 

 

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

И на этом можно было бы заканчивать эту статью, но я был бы с вами не до конца честен.

Дело в том, что в момент выполнения JS кода в HTML поле, оно, вопреки всем настройкам, имеет нехорошую привычку менять свой размер. И, оставаясь невидимым на форме, оно меняет размер группы страниц. Если вы этот кубик запрятали в самую гущу элементов, то их перекосит. Лучше всё-таки помещать этот кубик в конец формы, после всех элементов.

Но есть ещё более хитрый способ, как сделать, чтобы на форме не осталось вообще никаких отголосков этого элемента.

Представим, что у нас есть форма с 2 колонками, в которых расположены реквизиты:

 

 

 

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

 

 

У группы СредняяКолонка при этом нужно задать следующие свойства:

 

 

Расстояние между двумя колонками немножко раздвигается, размер нашего невидимого кубика контролируется дополнительно шириной группы СредняяКолонка. А если он будет увеличивать свою высоту, то там для него остаётся пустое пространство, и он может безопасно растягиваться вниз, не сместив ни один элемент со своего привычного места. Именно в таком варианте Поле HTML документа абсолютно никак себя не проявляет.

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

 

 

Ну вот теперь, наверное, можно точно заканчивать) Получилось довольно скучно и занудно, но думаю, перфекционисты оценят)) Всем добра!

Вступайте в нашу телеграмм-группу Инфостарт

УФ ПолеHTMLДокумента интерфейс эстетика невидимость

См. также

Работа с интерфейсом Анализ учета Мониторинг 1С v8.3 8.3.14 1C:Бухгалтерия 1С:Бухгалтерия 3.0 1С:Библиотека стандартных подсистем 1С:ERP Управление предприятием 2 1С:Управление холдингом 1С:Зарплата и Управление Персоналом 3.x 1С:Комплексная автоматизация 2.х 1С:Управление нашей фирмой 3.0 1С:Управление торговлей 11 Платные (руб)

Создайте свой функциональный интерфейс в любой конфигурации 1С с помощью расширения Infostart Dashboard. Настраивайте панели виджетов с метриками, индикаторами и показателями на начальном экране. Узнайте возможность внедрения подсистемы у себя в конфигурации с помощью бесплатной обработки "Анализ внедрения подсистемы 1С Infostart Dashboard"!

28800 руб.

27.03.2025    48193    26    22    

39

Работа с интерфейсом Программист 1С v8.3 1C:Бухгалтерия 1С:ERP Управление предприятием 2 Платные (руб)

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

5160 руб.

29.06.2020    22396    32    6    

50

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

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

5040 руб.

06.10.2020    12426    8    8    

14

Работа с интерфейсом Программист Стажер 1С v8.3 Бесплатно (free)

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

20.08.2024    41161    mrXoxot    44    

136

Работа с интерфейсом Программист 1С v8.3 Бесплатно (free)

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

27.05.2024    24191    smielka    38    

111

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

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

27.12.2023    22152    1310    elcoan    53    

128

Инструментарий разработчика Работа с интерфейсом Программист 1С v8.3 1C:Бухгалтерия Абонемент ($m)

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

3 стартмани

10.04.2023    15824    178    acces969    31    

132

Работа с интерфейсом Программист 1С v8.3 1C:Бухгалтерия Бесплатно (free)

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

12.08.2022    11420    rpgshnik    39    

96
Для отправки сообщения требуется регистрация/авторизация