В ролике разбираются практические приёмы работы с визуализацией в CODESYS V3.5: динамическое изменение цвета элементов через переменные, переключение изображений из пула, определение и смена активного экрана, а также открытие веб-страниц и файлов из папки Visu по нажатию кнопки.
- 00:00 Изменение цвета элемента через параметры
- 01:21 Запись цвета в формате ARGB
- 04:09 Использование перечисления цветов из библиотеки ОВЕН
- 05:46 Переключение изображений из пула
- 09:26 Определение активного экрана визуализации
- 11:38 Переключение экранов из кода программы
- 13:50 Открытие веб-страницы из веб-визуализации
- 16:18 Открытие файла из папки Visu контроллера
- CODESYS V3.5
- ОВЕН
- ПЛК
- веб-визуализация
Кому полезно: Инженерам АСУ ТП, разрабатывающим визуализацию в CODESYS V3.5
Описание составлено автоматически по расшифровке речи в ролике.
Расшифровка видео
0:00 Добрый день, коллеги, мы продолжаем говорить про КДС 3 5 и сегодня рассмотрим некоторые вопросы, которые периодически возникают у клиентов. При разработке визуализации 1 вопрос, как в программе реализовать изменения цветов элементов. Например, прямоугольника, я думаю, многие из вас знают, что у подобных элементов есть вкладка параметров цвета и в ней можно задать цвета нормального состояния и состоянии тревоги, цвета рамки и цвета заливки. То есть фон элемента, то.
0:32 Переключение между состояниями происходит с помощью параметра, переключить свет и складки перемены цвета соответственно, если переменная привязана к этому параметру. Имеет значение Фолс, то элемент имеет цвета нормального состояния. Если эта перемена имеет значение ТРУ, то элемент окрашивается в цвета состоянии тревоги, но в некоторых. случаях 2 состояний достаточно, предположим, вам с помощью элемента нужно индицировать аварию. Предупреждение и нормальное состояние 3 цвета или более в этом случае нужно. Воспользоваться другими параметрами они тоже расположены в охватах, нормальное состояние, состояние тревоги. Но теперь эти папки расположен уже во вкладке перемены и цвета.
1:21 Каждому из этих параметров можно привязать перемену типа двор, в которую надо записать значение цвета в формате, а РГБ в старший байт записывается значение прозрачности. А в следующие 3 Байта интенсивности красной зеленой и синей составляющей цвета соответственно. Давайте рассмотрим это на примере все нужные переменной. Я уже объявил вот перемены типа Двор в. котором будем записывать значение цвета и вот 2 пультских переменах, 1 из них индицирует наличие аварии, 2 наличие предупреждения. Давайте напишем простейший код, если у нас случилась авария.
2:04 То мы присваиваем нашу перемену значения красного цвета и еще раз напоминаю старший Байт. Это степень прозрачности обычно используется в максимальной степени. Если только не хотите, какие то полупрозрачные элементы. То есть УФ Ф и дальше нам нужно расписать интенсивность, пусть у нас при аварии элемент будет отображаться красным цветом, поэтому красной составляющей устанавливаем максимум, то есть ФФ и остальные в нулях.
2:31 Если же у нас аварии нет, но есть предупреждение. То записываем значения, например, желтого цвета, соответственно, в данном случае нам надо в максимум установить красную и зеленую составляющую. Смесь красного и зеленого дает желтый цвет. И если нет ни аварии, ни предупреждения, то пусть элемент будет зеленым.
2:56 Привяжем теперь нашу творческую переменную к параметру цвет заливки нормального состояния. То есть в нашем случае элемент будет всегда в нормальном состоянии, просто мы. Будем динамические из программы менять значение переменной цвета заливки этого нормального состояния и переменная переключить свет нам в данном случае не потребуется.
3:18 Мы все сделали, загружаем наш проект. Давайте откроем в браузере вип визуализацию. По умолчанию элемент отобрали зеленым, как мы ожидали, потому что нет ни аварии, ни предупреждения. Сформируем бит авария, вот видим цвет элемента, изменился на красный, сформируем вид. Предупреждения и видим, что цвет остался красным, потому что авария не пропала, уберем аварию. Теперь выполнилось вот эта ветвь, и теперь мы видим, что элемент действительно имеет желтый цвет.
4:09 Справедливое замечание, что сложно на память запомнить все вот эти цветовые обозначения цветов и, например, вы можете оформить все. Нужные вам цвета в виде перечисления. Более того, если вы используете библиотеку Овен из Удайлакс, то здесь уже есть перечисление на. Калорс, в котором записаны множество цветов, можете просто использовать его и, более того, для каждого элемента перечисления численное значение как раз соответствуют вот формату. А РГБ покажу, покажу на примере, то есть вместо. Того, чтобы самому подбирать все вот эти цветовые коды. Вы можете просто обратиться к библиотеке с помощью пространственно ОВД обратиться к перечислению Калорс и использовать оттуда нужный цвет, например, соответственно, Ред.
5:01 Йеллоу. Игрин. И увидим, что поведение не изменилось, только код стал более читаемым. Устанавливаю перемену авария. Вот мы видим, что элемент опять таки окорчился в красный цвет. Таким образом можно менять цвета элементов типа прямоугольник прямо в процессе работы проекта и индицировать различные состояния системы управления. Следующий вопрос, как реализовать изменения, как реализовать переключение изображений при поломке. Предположим, у нас есть несколько картинок. В моем случае это 2 картинки, которые характеризуют работу вентилятора 1 из. них характеризует, что вентилятор выключен, 2 что включен, они добавлены в элемент пул изображений. Если у вас этого элемента нет в проекте, то вы можете его добавить. Нажимаем на плейшим правой кнопкой добавление объекта.
6:15 Пул изображений таким образом происходит соответственно добавление картинок в пул. Обратите внимание, что у них есть айтишники и по умолчанию айтишник соответствует названию файла изображения. Но в принципе вы можете его переименовать и задать любой айтишник. Только главное не использовать символы кириллицы и спецсимволы, и точно также файл изображений не должны содержать кириллицу из под символа. И предположим, нам теперь нужно где то этот вентилятор отобразить на экране и, соответственно, переключать его состояние.
6:50 Давайте добавим элемент изображения на экран по умолчанию. Нужно привязать какой то файл, давайте вот привяжем. Просто отключен вентилятор, и теперь нам нужно, чтобы в какие то моменты времени он отображался как включенный. Объявим, точнее, у меня уже объявлена бульской переменная. Если она тру, это значит, для это включен, если Фолс отключен. Ну и напишем опять таки крайне простой код. Если она включена, то в специально объявленную. Строку перемена мы присваиваем Айди нашего изображения, но не только 1 сначала нужно указать имя пула. То есть у меня пул изображения из вас имидж пул, поэтому я пишу имидж пул, точка памп, он где памп, он это.
7:40 Не пам, прошу прощения, Вент, где Вент, он это как раз Айди соответствующего изображения из пула изображений, то. Если же перемена имеет значение, Фолс, то тогда присылаем картинку Вент ОФ ОВ и нашу строковую перемену. Мы должны привязать к элементу изображения к параметру переменная айди изображения. Привязали, загружаем проект. Соответственно, в вашем проекте вы можете использовать столько изображений, сколько вам нужно, и переключать их в рамках 1 вот этого элемента.
8:27 По умолчанию у нас элемент, соответственно, переменная в стоянии офф, поэтому Буффалос точнее, поэтому отображается вот отключанный вентилятор. Переводим нашу булевскую переменную значения тру. Видим, что теперь элемент отображается включенным таким образом, соответственно, можно реализовать анимацию, просто переключая, точнее изменяя значение переменной. Айди изображения и присваивания нужные айдишники из пула изображений. Вопрос, который периодически услышат клиентов, можно ли как то из программы поменять цвета? Изображения ответ нет доступа, никакого уже к изображению нет. Это просто графический файл, поэтому если вам нужно менять цвета, то сделайте несколько файлов в. Графическом редакторе на компьютере раскрасьте, вот как вам нужно ваши картинки и каждую из картинок добавьте в пул изображений и переключайте их в элементе.
9:22 Следующий вопрос связан с. Переходами между экранами визуализации и определением, какой экран визуализации открыт в данный момент у оператора. Тут есть несколько вариантов это сделать, и на самом деле все зависит от того, сколько оператор будет в вашей теме. Если вы говорите, что у меня будет, например, только оператор таргета, визуализации на СПК или, например, только. 1 Оператор Веб визуализации у полка то удобнее всего в менеджеры визуализации поставить галочку, использовать переменную Карен визу и, собственно, дальше работать с этой переменной. Но обратите внимание, как только вы. Эту галочку поставите, то визуализации будут синхронизированы для всех клиентов. Например, если пользователь таргет визуализации, работая с экраном, СПК переключит экран, то этот экран сразу приключится у всех клиентов. Которые подключены к электроизоляции и наоборот. Если это поведение приемлемо, то проще всего работать с данной переменной. Она позволяет определить, какой экран в данный момент открыт на контроллере и также его переключить.
10:28 Опять таки у меня тут есть 2 булочки переменные, а в практике 2 экрана и, соответственно, какой экран открыт. Такая булевская, переменная и будет заведена в тру и опять. Таки давайте напишем простейшую логику, обращаемся к нашей переменной. Для этого вводим пространство имен визу ЛМС нажимаем точку и убираем нашу переменную Карен визу.
10:53 Если она равна визу, 1 то есть открытый экран внизу, 1 тогда мы соответственно. Нашей бульской переменной, соответствующий при своем назначении ТРУ. А 2 Фолс, потому что, ну, соответственно, явно сейчас открыт 1 кран, а не 2. По аналогии обрабатываем 2 экран, если он открыт, мы соответственно присваиваем нашим переменам нужное значение. Если по каким то причинам открыт вообще еще какой, то экран. Предположим, вы добавили 3 экран и забыли от как в логике обработать специально, то обе перемены сбрасываем Фолс.
11:38 Сразу обращу внимание, но не буду отдельно показать это переменная доступность для записи. То есть если вы в ходе вы, вы при выполнении какого то условия напишите, что то в таком стиле? То прибудет произведено переключение визуализации на экран 2 из кода программы. Вы переключите визуализацию проекта, при этом обратите внимание, что вот такие выражения нужно сгонять в конструкцию ив там и в что. То там потому, что если вы это будете клички выполнять, то соответственно всех пользователей просто приклеит к данному экрану. Поэтому такие вот выражения сгонять и в какие то конструкции и в кейс, и так далее.
12:19 Загрузим наш проект в контроллер и проверим, что я действительно работает. Сейчас у меня открыт по умолчанию 1 экран и, соответственно, 1 буйская переменная в тру переходим на 2 соответственно. Вот теперь 2 взялась, 1 сбросилась, вернемся на 1. Вот мы видим, все работает корректно, если же такой вариант. Вам не подходит, то есть каждый оператор должен работать отдельным и визуализации, не должны быть синхронизирована, то вам потребуется использовать более сложный способ. С помощью библиотеки визу Утилс, как это сделать, написано В. Отдельной статье ссылку на нее я размещу в описании к видео и также видео оставлю ссылку на документ про визуализацию. Там, в частности, написаны и другие системные переменные, которые вы можете могли увидеть, когда я вот искал нашу. Переменную Карен Физу, видите, здесь есть Карен и Джернеем. Например, Карен Фьюзел группой Дим Карен Ленд Линвич и так далее. Большей части них относятся к управлению пользователями, то есть вот это вот это, вот это, вот это и вот это.
13:36 Корень Лаги, соответственно, показывает вам текущий язык визуализации и позволяет его динамически переключать. И я показывал в эту перемену в 1 из видео, в которых рассказывал о реализации мультиязычной визуализации. И последний вопрос, который сегодня хотелось рассмотреть это как. В контексте век визуализации открыть другую веб страницу. Например, у вас есть в сети несколько контроллеров с ее физ лицами. И вы хотите, чтобы из 1 визуализации, точнее из? Вебфазелизации 1 контроллера можно было перейти в вебкапитализацию другого контроллера или просто открыть. Какую то веб страницу в браузере по нажатию на кнопки веб визуализации?
14:17 Для этого мы на вкладке конфигурация ввода добавляем какое то действие. Например, он масклик и убираем точнее события, он масклик и выбираем действия. Выполнить команду, выбираем команду, перейти к юрл Вип визу. Эта команда будет работать только в Вип визуализации, в Таргет визуализация, она работать не будет, нажимаем плюсик. 1 Параметр это тип стринг, он имеет тип стрим, к нему можно привязать перемену типа стринг или можно вести литирал в одиночных кавычках. Соответственно, я просто укажу я.
14:55 Наш сайт и чтить без Овен ру если 2 параметр оставить пустым, то новая вкладка будет, то страница вот это будет открыта в новой вкладке браузера. Можно написать специальный ключ репликс, и тогда она будет открыта вместо текущей вкладке веб визуализации. Давайте посмотрим, как это работает.
15:25 Загружаем проект. Нажимаем на кнопку, и вот мы видим, что наш экран был приоткрыт. Точнее, должен был приоткрыт, то есть видно, что обновляется новая страница. Но что то пошло не так датчика, я обновлю свою общую страницу светоциализации. Вот теперь я сработала корректно, просто не совсем быстро. Видимо, опять наш локальный стиль не все здорово. Обратите внимание, что страница была открыта не в новой вкладке, а была переоткрыта, текущая вкладка как раз и заключаю реплей, с которой я вел.
16:18 И напоследок еще 1 момент таким образом можно открыть не только какую то интернет страницу, но и файл, расположенный в папке визу в памяти контроллера. Например, у меня контроллер имеет айпи адрес 10 2 1 174 дальше, вводим 80 80.
16:41 И дальше вводим имя какого то файла из папки. Визу в памяти контроллера у меня этот файл называется Тейбл и что Майл и просто содержит какие то обычные данные. Это файл, вы, например, можете формировать в коде программы или, например, с помощью? Какого то питона скрипта можете формировать отчетом ваще Майл в ПДФ, в чем вам удобно и указывайте путь к этому файлу. Еще раз напомню, файл должен быть в папке визу, то есть Пилси ложек визу.
17:12 Загружаю проект и посмотрим, что сейчас произойдет. Нажимаем на кнопку, немного ждем.
17:53 Так тут, может быть, проблема вот с чем? Да, я по ошибке оставил и чти пес, но у меня нет сертификата. То есть моем случае нужно было идти и чти пи. Опять закроем проект? И сейчас уже все должно сработать корректно. Нажимаем на кнопку, и вот открылся файл из папки из папки визу в памяти контроллера. Все эти файлы, как я уже говорил, вы можете генерировать, но удобнее всего, наверное. На Питоне в ходе КДС с не очень удобно формировать ИЧТ и Майл. Хотя, может быть, для вас это будет приемлемо и дальше уже открывать и показывать операторам визуализации.
18:43 Собственно, все, что я хотел вам рассказать, я рассказал. Если у вас еще есть какие то вопросы про визуализации, которые были было бы полезно рассмотреть следующих видео, то, пожалуйста, напишите о них в комментариях. Спасибо вам за внимание и еще увидимся.
Расшифровка сделана автоматически (Yandex SpeechKit) и может содержать ошибки в терминах.