MajorDoMo

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

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

Chainik писал(а): Вс дек 26, 2021 9:38 pm Вместо штатных элементов типа "выключатель" можете использовать тип "изображение" или html-блок:

Код: Выделить всё

<style type="text/css">
.gorizontalno {
display: inline-block
}

.button:active {
  transform: scale(0.9, 0.9);
}

</style>


<div class="gorizontalno">
<div class="button">
<div style='display:%Lamp_0380_SP05_205z.Status|"block;none"%' onClick='callMethod("%Lamp_0380_SP05_205z.turnOn");'><img src="\cms\scenes\LampSP03.png"></div>
<div style='display:%Lamp_0380_SP05_205z.Status|"none;block"%' onClick='callMethod("%Lamp_0380_SP05_205z.turnOff");'><img src="\cms\scenes\LampSP03.png" style="background-color: green;"></div>
</div>
</div>

А там используйте любой цвет, какой захочется (в пределах таблицы цветов).
CropImage_r.png

А можно чутка подробнее , попробовал не получилось.
У меня ubuntu server 20.04

Берете две картинки (иконки). Одна для включенного состояния, другая -- для выключенного. Можно взять и одну иконку, как в моем примере, но с прозрачным фоном, который для включенного состояния будет заливаться цветом (в моем примере зеленым). Кладете картинку(ки) по какому-нибудь пути в Мажордомо (в моем примере "\cms\scenes\").

Теперь по коду. Стиль CSS "gorizontalno" отвечает за горизонтальное расположение элемента в html-блоке относительно предыдущего. Для единственного элемента в блоке это не особо актуально, а для нескольких (например, для расположения нескольких подобных выключателей в строке меню) будет необходимо.
Стиль CSS "button" отвечает за имитацию нажатия на иконку, когда мы на нее кликаем.

Затем в коде идут две главные строчки, отвечающие за условие отображения картинки, действие при нажатии и внешний вид самой картики. Вот тут задано условие отображения, при котором картинка будет отображаться, когда значение свойства "Status" объекта "Lamp_0380_SP05_205z" равно "0". Картинка из следующей строки будет отображаться при "1". Тут прописано действие при клике на элемент. В данном случае будет запущен метод "turnOn". В самом методе "turnOn" происходит присвоение свойству "Status" значения "1" (помимо команды на включение реле/светильника). После этого картинка из данной строки отображаться перестанет и будет отображаться картинка из второй строки (залитая цветом). Тут идет ссылка на картинку иконки.

Во второй строке наша картинка с прозрачным фоном заливается цветом: Можете использовать любой цвет, который нравится: https://colorscheme.ru/html-colors.html

Можно ещё проще сделать.
Для красоты - gif. Если красота не нужна, только функциональность - png картинки.

Создаете в сцене элемент с типом - изображение.
Под каждое состояние - своя картинка. Можно украсить чуть чуть html-ом стандартным

Несколько сумбурно получилось, но с временем как всегда, очень плохо ))

видео как создать на сцене кнопки 2 и 3 режима, просто и расширенное условие.

Сегодня было пол дня свободного времени))
Решила выделить в отдельную рубрику про управление со сцены
и сделала первое видео.
Прошу посмотреть и высказать мнение, что лишнее, чего не хватает.
Спасибо.