Картинки в динамическом списке

13.09.24

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

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

Скачать файл

ВНИМАНИЕ: Файлы из Базы знаний - это исходный код разработки. Это примеры решения задач, шаблоны, заготовки, "строительные материалы" для учетной системы. Файлы ориентированы на специалистов 1С, которые могут разобраться в коде и оптимизировать программу для запуска в базе данных. Гарантии работоспособности нет. Возврата нет. Технической поддержки нет.

Наименование По подписке [?] Купить один файл
Картинки в динамическом списке пример (релиз 8.3.25.1286)
.cf 114,33Kb
6
6 Скачать (1 SM) Купить за 1 850 руб.

В случаях, когда необходим доступ к медиа-контенту с витрины используется стороннее хранилище данных. В качестве хранилища может использоваться сетевой каталог, S3 или CDN-решение. По сути это аналог хранилища двоичных данных с высокими требованиями доступности и скорости. Почему бы решению на 1С не использовать те же хранилища, если они удовлетворяют требования таких высоконагруженных систем как витрины: сайты, мобильные приложения.

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

Механика вывода картинок в динамическом списке основана на всем известном приеме: поместить двоичные данные во временное хранилище , получить адрес, сохранить адрес в строковый реквизит, который на форме отображается как поле картинки.

Предположим, у нас есть справочник с данными. В реквизитах справочника есть URL картинки. Необходимо вывести на форму динамический список справочника с отображением картинки в каждой строке.

 

 

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

 

 

Добавляем в параметры запроса строковый параметр ИдентификаторФормы, в который соответственно будем передавать идентификатор нашей формы.

 

 

В вычисляемые поля запроса добавляем строковое поле Картинка. Значение будет возвращаться из метода общего модуля, в который как параметр будет передаваться URL изображения текущей записи справочника.

 

 

На форме в табличное поле списка выводим реквизит "Картинка" с типом "Поле картинки". 

 
 Модуль формы

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

 
 Метод серверного общего модуля

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

Запрос по URL самый обычный. Желательно ограничивать минимально-возможным таймаутом, чтобы пул фоновых заданий не копился.

 
 Метод get-запроса данных картинки

 

 
 //
 //
 Функция ПолучитьДвоичныеДанные(АдресURL) Экспорт
	 
	 Результат = Неопределено;
	 
	 лАдресURL = АдресURL;
	 ////infostart.ru/bitrix/templates/.default/mmenu/images/directions/personal.svg
	 
	 Если ЗначениеЗаполнено(лАдресURL) Тогда
		 
		 Порт = 80;
		 Если СтрНачинаетсяС(НРег(лАдресURL), "https") Тогда
			 
			 ЗащищенноеСоединениеOpenSSL = Новый ЗащищенноеСоединениеOpenSSL();
			 Порт = 443;
			 
		 КонецЕсли;
		 
		 лАдресURL = Сред(лАдресURL, СтрНайти(лАдресURL, "://") + 3);
		 
		 Сервер = "";
		 Метод = "";
		 Таймаут = 2;
		 
		 МассивЧастиURL = СтрРазделить(лАдресURL, "/", Ложь);
		 Если МассивЧастиURL.Количество() > 0 Тогда 
			 
			 МассивЧастейХост = СтрРазделить(МассивЧастиURL[0], ":", Ложь);
			 Сервер = МассивЧастейХост[0];
			 Если МассивЧастейХост.Количество() > 1 Тогда
				 
				 Порт = МассивЧастейХост[1];
				 
			 КонецЕсли;
			 
			 МассивЧастиURL.Удалить(0);
			 Метод = СтрСоединить(МассивЧастиURL, "/");
			 
		 КонецЕсли;			 
		 
		 Заголовки = Новый Соответствие;
		 
		 HTTPСоединение = Новый HTTPСоединение(Сервер, Порт,,,, Таймаут, ЗащищенноеСоединениеOpenSSL);
		 
		 HTTPЗапрос = Новый HTTPЗапрос(Метод, Заголовки);
		 
		 Попытка
			 
			 Ответ = HTTPСоединение.Получить(HTTPЗапрос);
			 Если Ответ.КодСостояния - 200 < 100 Тогда
				 
				 Результат = Ответ.ПолучитьТелоКакДвоичныеДанные();
				 
			 КонецЕсли;
			 
		 Исключение	 
			 
			 // логируем ошибку
			 
		 КонецПопытки;
		 
		 
	 КонецЕсли;
	 
	 Возврат Результат;
	 
 КонецФункции

В результате после вывода динамического списка на форму картинки догружаются в фоне. Естественное обновление картинок по строкам выполнится при действиях со список: пролистывании, изменении данных. Чтобы ускорить обновление добавил на форму при открытии однократный обработчик ожидания с задержкой в 2 секунда, который обновит содержимое элемента динамического списка.

 

 

Тестировалось на релизе 8.3.25.1286.

Что мы получаем при использовании данного решения:

- отображение произвольных картинок в динамических списках, а соответственно и любых других объектах, использующих СКД;

- минимальные затраты на хранение БД, т.к. перманентно хранится только строка с URL, а сама картинка хранится в стороннем хранилище, с которым кроме нашего решения могут работать и любые другие сервисы в контуре;

- минимальное влияние на скорость отклика интерфейса с оговоркой стабильной сети и наличия быстрого стороннего хранилища двоичных данных (существенное требование);

- клиент-серверные вызовы по картинкам отсутствуют, вся работа на сервере;

- затрат на клиентские лицензии нет, т.к. для работы фоновых заданий нужна только серверная лицензия;

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

Новый механизм работы с хранилищами двоичных данных (S3) платформы скорре всего реализует в итоге что-то похожее, не щупал. В данном случае выходит сильно дешевле, если КОРП вам нужен только ради такой задачи )).  

 

 

картинки динамический список разработка харнилище двоичных данных s3

См. также

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

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

5000 руб.

14.01.2016    55443    17    23    

43

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

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

2400 руб.

29.06.2020    19726    28    6    

44

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

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

20.08.2024    21883    mrXoxot    44    

128

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

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

27.05.2024    11006    smielka    37    

105

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

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

27.12.2023    17967    1225    elcoan    53    

125

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

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

3 стартмани

10.04.2023    12662    167    acces969    31    

126

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

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

1 стартмани

05.07.2022    7397    kalyaka    6    

32
Комментарии
Подписаться на ответы Инфостарт бот Сортировка: Древо развёрнутое
Свернуть все
1. Diversus 2331 20.09.24 09:08 Сейчас в теме
- клиент-серверные вызовы по картинкам отсутствуют, вся работа на сервере;


Все таки клиент-серверные вызовы есть. Если запускать в режиме отладки и скролить список, то получаем постоянные вызовы
2. Lars Ulrich 625 20.09.24 11:22 Сейчас в теме
(1) Да, динамические списки они такие, совсем без клиент-серверных вызовов никуда даже без картинок.
3. Diversus 2331 20.09.24 11:23 Сейчас в теме
(2) Я придумал способ отображения картинок в динамическом списке действительно без клиент-серверных вызовов. Если все получится, то выложу решение позже.
4. Lars Ulrich 625 20.09.24 11:24 Сейчас в теме
(3) Огонь, мне бы пригодилось.
5. Diversus 2331 20.09.24 15:55 Сейчас в теме
(4) Ничего не вышло, к сожалению.

Идея была в следующем:
1. Все используемые картинки подготовить в один спрайт SVG (это получилось сделать программно). Пример такого объединения во вложении. Пусть он был бы длинным, работало бы все равно бы быстро.
2. Дальше была идея каждому элементу справочника присвоить индекс в спрайте от 0 до n-1. При добавлении картинок добавлять в конец спрайта новую картинку и присваивать элементу справочника индекс в спрайте.
3. В форме списка использовать этот индекс и в поле КартинкаЗначений (для ячеек) или КартинкаСтрок (для списка целиком), подсунуть этот спрайт. Это бы позволило не использовать серверные вызовы.

Такой способ работает, если спрайт добавить в ручную в БиблиотекуКартинок. Но не работает, если попробовать КартинкаЗначений или КартинкаСтрок заполнить программно. Эти реквизиты только для чтения :(
Прикрепленные файлы:
Спрайт.svg
6. Lars Ulrich 625 20.09.24 16:00 Сейчас в теме
(5) сильно, но на больших количествах картинок тоже вопрос как бы это работало.
Я подобным образом через imagemagick ресайз картинки на лету делаю для отображения в списке, чтобы клиенты не умирали на данных.
7. Diversus 2331 20.09.24 16:04 Сейчас в теме
(6) Мы использовали такой спрайт добавленный в БиблиотекуКартинок со 128 картинками (причем там архив с набором картинок под разный масштаб). Все работает прекрасно. Думаю и с большим количеством легко справится. Это при условии, конечно, что картинки не большие 16x16 или 24x24. Если будут большие, то тут, наверное, да. Будут проблемы.
8. Lars Ulrich 625 20.09.24 16:06 Сейчас в теме
(7) не, тут вопрос с тем, чтобы условно произвольный-бесконечный набор картинок так на лету формировать, запоминать позиции картинок и все такое. То, что это работает в 1с для всяких картинок строк безусловно.
Оставьте свое сообщение