Top.Mail.Ru
Заказать консультацию
специалиста 1С
Отправить заявку

ИнфоСофт использует файлы «cookie» с целью персонализации сервисов и повышения удобства пользования веб-сайтом. Вы можете запретить обработку сookies в настройках браузера. Пожалуйста, ознакомьтесь с политикой использования cookies.
Оставаясь на сайте, вы соглашаетесь с политикой использования cookies.

1С:Предприятие.Элемент – создаем свой первый компонент

Воякин Данил Посмотреть все статьи >> Старший программист 1С франчайзинговой сети "ИнфоСофт".
07.03.2024
5415
Время прочтения - 7 мин.
Заказать консультацию

28 февраля 2024 года была выпущена в публичный доступ технология «1С:Предпрятие.Элемент», ключевыми особенностями которой являются новый язык, новая среда разработки, которая находится в облаке, и новый подход к работе с компонентами. Более подробно о выходе технологии рассказано в этой статье.

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

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

1.png

Визуальный редактор форм


2.png

Эта же форма в формате YAML


Разработчиками были определены системные компоненты интерфейса, например:

  • Всевозможные группы, логика которых знакома нам из механизма управляемых форм «1С:Предприятие 8.3»;

  • Кнопка;

  • Переключатель;

  • Страница;

  • Карточка;

  • Изображение;

  • И так далее.

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

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

Карусель - это изображение, которое сменяется с течением времени и даёт возможность перейти по ссылке, соответствующей текущему изображению. Логику работы подобного компонента часто можно встретить на веб-сайтах, например, на сайте «ИнфоСофт».

3.png


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

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

4.png

Меню создания объектов


Создадим дочерний компонент к «Фиксированная группа» и определим свойства у компонента. «Свойства» — это те поля, которые будут доступны «снаружи» компонента, например, с его помощью будем настраивать содержимое «Карусели».

5.png

Свойства компонента и поля структуры


Блок - это структура, которая содержит в себе изображение и произвольный текст.

Определим структуру компонента следующим образом:

6.png

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

В «1С:Элемент» есть возможность использовать выражения сразу в качестве значения поля на форме без необходимости писать для этого отдельный код в модуле. Таким образом, определим, что изображение на компоненте всегда будет равно изображению из n-ого элемента нашей структуры с «рекламными» блоками. Также в этом файле устанавливается привязка событий формы к будущим методам (строка 24, 29, 41).

В файле «КарусельКомпонент.xbsl» определим методы, описанные ранее:

7.png


С помощью аннотации «@Глобально» определим функции, которые будут выступать в качестве программного интерфейса взаимодействия с компонентом – «клик» по баннеру произойдет в любом случае, этого не отнять. А вот возможность программно управлять «каруселью» пригодится. Если не указать аннотацию области видимости, тогда метод нельзя будет вызвать у экземпляра «из вне».

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

8.png

 

Остается настроить свойства у компонента, которые мы определили, «НомерТекущегоБлока» оставляем как есть, чтобы начать показ изображений с начала. Заполняем «СписокБлоков» произвольными картинками и текстом:

9.png

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

10.png

11.png


Также частое поведение «Карусели» - автоматическое переключение изображений со временем. Чтобы это реализовать, прикрепим на компонент обработчик таймера сразу при создании  главной формы:

12.png


Таким образом, мы решили задачу совсем небольшим количеством кода и завернули всё в один компонент. Если потребуется, можем использовать «Карусель» в своем проекте в любом другом месте приложения.


Заказать консультацию специалиста 1С
Оставьте заявку и наши эксперты проконсультируют вас по данной статье.
Отправить заявку
Рассказать друзьям
Для разработчиков 1С 1С:Предприятие.Элемент
Вам может быть интересно: