Анимация фона элементов на форме в стиле JQuery

16.07.15

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

+85 –
>
  • несколько полей.png
  • anima.png
К сожалению, у платформы 1С не так много красивостей, которыми обычно сдабривают формы обычных web-страниц. Нам недоступны эффекты JQuery и других javascript-библиотек.
А иногда хочется сделать необычно, красиво и удобно.

Файлы

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

Наименование Скачано Купить файл
АнимацияФонаЭлементов
.zip 8,90Kb
28 2 500 руб. Купить

Подписка PRO — скачивайте любые файлы со скидкой до 85% из Базы знаний

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

Оформить подписку и скачать решение со скидкой

Вот, например, как привлечь внимание пользователя к полю, которое изменилось в результате правки пользователем другого элемента?
Можно штатно выкинуть сообщение и привязать к полю, но лично у меня это вызывает негативную эмоцию вида "Что там еще за ошибка?".
А можно ненавязчиво подсветить фоном, который "вспыхнет и погаснет". Мол, глянь-ка сюда.
Собственно, далее реализация через ОбработчикОповещения.

&НаКлиенте
Перем ИмяПоля;


// фон поля меняется от желтого к безцветному
// запуск анимации СменаЦветаФона("Итого",Истина);
// ИмяЭлемента - строка с названием анимируемого элемента
// Старт - булево. Истина - начинаем анимацию, Ложь - продолжаем анимацию
&НаКлиенте
Процедура СменаЦветаФона(ИмяЭлемента,Старт=Ложь,ВызвавшаяФункция="АнимацияПоля")
	ИмяПоля = ИмяЭлемента;
	Элемент = Элементы.Найти(ИмяПоля);
	Скорость = 3; // 1-5
	Если Старт = Ложь Тогда
		Синий = Элемент.ЦветФона.Синий;
		Синий = Синий+255/(7-Скорость);
	Иначе
		Синий = 0;
	КонецЕсли;
	
	Если Синий >= 255 Тогда
		Элемент.ЦветФона = Новый Цвет();
		Возврат;
	КонецЕсли;
	Цвет = Новый Цвет(255, 255, Синий);
	Элемент.ЦветФона = Цвет;
	ПодключитьОбработчикОжидания(ВызвавшаяФункция, 0.1, Истина);	

КонецПроцедуры

// вызывается из обработчика ожидания
&НаКлиенте
Процедура  АнимацияПоля()
	СменаЦветаФона(ИмяПоля,Ложь);
КонецПроцедуры

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

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

Анимация фона анимация элементов формы Jquery 1C

+85 –

См. также

Infostart Dashboard: Монитор показателей, виджеты и дашборды в 1С 8.3

Работа с интерфейсом Анализ учета Мониторинг 1С:Предприятие 8 1С 8.3 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"!

31720 руб.

27.03.2025    75686    47    36    

59
Дизайнер форм 1С

Разработка Инструментарий разработчика Работа с интерфейсом Адаптация типовых решений Нейросети 1C:Бухгалтерия 1C:ERP 1С:ЗУП 1С:КА 1С:УНФ 1С:УТ 1С:Розница 1С:ДО 1С:ERP Управление предприятием 2 Платные (руб)

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

36600 руб.

28.08.2025    6682    2    2    

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

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

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

6100 руб.

14.01.2016    59701    22    25    

47
Удобные фильтры: динамические кнопки-закладки для списков в 1С

Консолидация данных Работа с интерфейсом Программист Пользователь 1С:Предприятие 8 1С:Бухгалтерия 3.0 1С:Управление торговлей 11 1С:Управление нашей фирмой 3.0 1С:Розница 3.0 1C:ERP Узбекистан Беларусь Кыргызстан Россия Казахстан Платные (руб)

Знакомая ситуация? Пользователи, особенно менеджеры, уверены: отборов много не бывает. Идут пожелания добавить в форму списка еще один быстрый фильтр, еще два, еще пять... В итоге интерфейс превращается в нагромождение полей отбора, а потребность в «самом главном» отборе, который «вот прямо сейчас нужен», все равно не закрыта. Универсальное расширение, которое решает эту проблему элегантно и технологично. С его помощью в любую форму списка можно легко добавить панель настраиваемых кнопок-закладок, каждая из которых применяет сложный фильтр-запрос, а так же показывает актуальное количество элементов в реальном времени.

6088 руб.

17.10.2025    1694    3    0    

2
Настройки управляемых форм (списков, объектов), заполнение реквизитов по условиям, контроль заполнения, доступ для 1С:УТ 11

Работа с интерфейсом 1С:Предприятие 8 1С:Управление торговлей 11 Россия Платные (руб)

Настройки управляемых форм (списков, объектов), заполнение реквизитов по условиям, контроль заполнения, условное оформление, доступ и пр. для 1С

6100 руб.

20.02.2018    22833    25    21    

42
Дизайн Гайд для создания форм на 1С. Когда и как использовать различные элементы, примеры и антипримеры по использованию

Работа с интерфейсом Программист Стажер 1С:Предприятие 8 Бесплатно (free)

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

20.08.2024    47703    mrXoxot    44    

138
Прогресс-бар в поле динамического списка

Работа с интерфейсом Программист 1С:Предприятие 8 Бесплатно (free)

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

27.05.2024    26000    smielka    38    

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

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

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

3 стартмани

10.04.2023    17243    180    acces969    31    

132
Комментарии
Подписаться на ответы Инфостарт бот Сортировка: Древо развёрнутое
Свернуть все
1. dj_serega 396 18.02.15 10:38 Сейчас в теме
Прикольная штука. Попробуем реализовать у себя такую ерунду.
+ – Ответить
2. friend0 18.02.15 17:19 Сейчас в теме
Забавная штука. Плюс за идею.

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

Ну и для поля таблицы чтобы работало.

Но это все легко допилить руками кому надо будет. Главное идея.

П.С. Не переделывая логику, поигрался со значениями, чтоб не так глаза резало. Вдруг кому пригодится: 
	Если Старт = Ложь Тогда
		Синий = Элемент.ЦветФонаПоля.Синий;
		Синий = Синий+20;
	Иначе
		Синий = 200;
	КонецЕсли;
	
	Если Синий >= 240 Тогда
Показать
+ – Ответить
4. kraynev-navi 699 18.02.15 19:57 Сейчас в теме
(2) Тут да... Можно подключить фантазию и наворотить чего хочешь. Я делал разные цвета, настраивал скорость и т.д.
(3) Если речь про несколько полей при одном событии, то глюков нет. А вот если кликнул на первое поле, через долю секунды на второе, то да - глюканет: первое останется цветным.
+ – Ответить
3. vasyak319 156 18.02.15 18:18 Сейчас в теме
Должно феерично глючить при подсветке больше, чем одного поля.
+ – Ответить
5. jobkostya1c_ERP 101 19.02.15 07:22 Сейчас в теме
Когда что-то красиво оформляют только плюс за юзабилити. Обычно, такое редко.
+ – Ответить
6. bashinsky 156 19.02.15 16:54 Сейчас в теме
Если речь про несколько полей при одном событии, то глюков нет. А вот если кликнул на первое поле, через долю секунды на второе, то да - глюканет: первое останется цветным.
На обычной форме, 10 полей работает без глюков. Но для этого, для подсветки каждого поля нужно писать свою вызывающую функцию. 
Процедура  АнимацияПоля1()
	СменаЦветаФона("Поле1",Ложь);
КонецПроцедуры
Процедура  АнимацияПоля2()
	СменаЦветаФона("Поле2",Ложь);
КонецПроцедуры
Процедура  АнимацияПоля3()
	СменаЦветаФона("Поле3",Ложь);
КонецПроцедуры
Показать
kraynev-navi; +1 – Ответить
7. kraynev-navi 699 19.02.15 17:13 Сейчас в теме
(6) Да, именно так будет работать. Но больно громоздкий способ, который мне кажется из-за этого неправильным подходом. Более оригинального не нашел.
Кстати, раз уж пошло техническое совершенствование.
Я все никак не мог придумать как избавиться от переменной ИмяПоля. Глаз режет, неудобно, хочется минимализма. Может кто-то придумает интереснее решение?
+ – Ответить
8. ixilimuse 193 25.02.15 12:56 Сейчас в теме
Да, тоже так делал в одной обработке, в случае когда пользователи забывали заполнить одно важное поле. Пользователям понравилось) Да и звонков с вопросами стало меньше, так как сообщение информировало о том что они забыли, мигание цветом показывало - где =)

Кстати, в своей реализации не заморачивался с плавным переходом цветов, за красоту - респект))
+ – Ответить
9. Lok`Tar 90 07.09.17 08:20 Сейчас в теме
Крутяк:) Обязательно попробую у себя
+ – Ответить
Для отправки сообщения требуется регистрация/авторизация