Страница 1 из 15

Активные объекты на сценах

Добавлено: Пт июл 25, 2014 9:57 pm
Vit
Открыл тему для вопросов связанных с размещением примеров по добавление активных элементов на сцены.



Первый вопрос.


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


просьба помочь примерами....
думаю многие хотят "оживить" свои сцены как по поводу оформления , так и функционала.

вот страница примеров кучи кнопок http://shpargalkablog.ru/2012/04/css-knopki.html


как подобное реализовать на сценах? чтобы кнопка на пульте http://smartliving.ru/forum/viewtopic.php?f=8&t=1360, например именно нажиалась и меняла цвет и т.д.

нарисовать думаю для себя многие смогут, а вот написать код для придания сценам активности не все.

Re: Активные объекты на сценах

Добавлено: Ср июл 30, 2014 11:52 am
Vit
Может кто поможет с примерами?

Заранее благодарен.

Re: Активные объекты на сценах

Добавлено: Пн авг 04, 2014 3:44 pm
sergejey
Так-с, немного поколдовал с исходниками (читай -- надо обновиться), и добавил новое поле "Дополнительный код CSS" в настройку элементов сцены.

Сейчас можно задать блок CSS кода (1), в котором указать класс элемента состояния (2), к которому этот код применится.

Как это выглядит в админке:
Изображение

Как выглядит на сцене:
Изображение

Я взял для примера блок с указанного выше сайта, но немного его передал:

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

div.element_6 {
  display: inline-block;
  color: black;
  font-size: 125%;
  font-weight: 700;
  text-decoration: none;
  user-select: none;
  padding: .25em .5em;
  outline: none;
  border: 1px solid rgb(250,172,17);
  border-radius: 7px;
  background: rgb(255,212,3) linear-gradient(rgb(255,212,3), rgb(248,157,23));
  box-shadow: inset 0 -2px 1px rgba(0,0,0,0), inset 0 1px 2px rgba(0,0,0,0), inset 0 0 0 60px rgba(255,255,0,0);
  transition: box-shadow .2s, border-color .2s;
} 
div.element_6:hover {
  box-shadow: inset 0 -1px 1px rgba(0,0,0,0), inset 0 1px 2px rgba(0,0,0,0), inset 0 0 0 60px rgba(255,255,0,.5);
}
div.element_6:active {
  padding: calc(.25em + 1px) .5em calc(.25em - 1px);
  border-color: rgba(177,159,0,1);
  box-shadow: inset 0 -1px 1px rgba(0,0,0,.1), inset 0 1px 2px rgba(0,0,0,.3), inset 0 0 0 60px rgba(255,255,0,.45);
}
Т.е. было всё тоже самое, только вместо "div.element_6" было "a.button10". Заменить нужно было для того, чтобы указанный CSS применялся к нашему элементу, класс которого теперь выводится в подсказке (2).

При желании можно наворотить чего-нибудь по-сложнее с анимацией элементов с помощью уже присутствующего jquery, обращаясь по id к отдельным состояниям элементов. Но это уже совсем другая история :)

Re: Активные объекты на сценах

Добавлено: Вс сен 14, 2014 12:09 am
Dragon
подскажите а как на сцене сделать значек который бы при нажатии кнопки менял свое состояние например, имеется значек не горящей лампы, при нажатии кнопки он менялся на горящюю лампу.

Re: Активные объекты на сценах

Добавлено: Вс сен 14, 2014 8:33 am
Jager
Dragon писал(а):подскажите а как на сцене сделать значек который бы при нажатии кнопки менял свое состояние например, имеется значек не горящей лампы, при нажатии кнопки он менялся на горящюю лампу.
http://smartliving.ru/Main/ModuleScenes

Re: Активные объекты на сценах

Добавлено: Вс сен 14, 2014 9:16 am
Dragon
Jager писал(а):
Dragon писал(а):подскажите а как на сцене сделать значек который бы при нажатии кнопки менял свое состояние например, имеется значек не горящей лампы, при нажатии кнопки он менялся на горящюю лампу.
http://smartliving.ru/Main/ModuleScenes
Спасибо за ссылку, я ее видел и дела по ней, я не совсем все там понял, и естественно ничего у меня не получилось

Re: Активные объекты на сценах

Добавлено: Вс сен 14, 2014 10:21 am
Vit
Там просто интеофейс сцен не новый. Принцип такой же.

На сцене добавьте элемент например картинку, в нем два состояния например вкл/выкл и условие status=1 вкл и наоборот .

Re: Активные объекты на сценах

Добавлено: Вс сен 14, 2014 11:54 am
Dragon
Vit писал(а):
На сцене добавьте элемент например картинку, в нем два состояния например вкл/выкл и условие status=1 вкл и наоборот .
добавил элемент ..лампы.. сделал два состояния On и Off. но при запуска интерфейса сцены элемент пропадает.

дается мне что где то и что то еще надо прописывать. а что и где я без понятия.

Re: Активные объекты на сценах

Добавлено: Вс сен 14, 2014 12:47 pm
Jager
Dragon писал(а): добавил элемент ..лампы.. сделал два состояния On и Off. но при запуска интерфейса сцены элемент пропадает.
дается мне что где то и что то еще надо прописывать. а что и где я без понятия.
У меня вот так
Изображение
когда настраивал помню что не выполнялось действие пока не указал «выполнить сценарий при клике» подставил туда пустой сценарий.
Это было давно, наверное пофиксил автор данную проблему.

Re: Активные объекты на сценах

Добавлено: Вс сен 14, 2014 1:05 pm
Vit
Можно сценарий. Можно просто метод объекта и сценарий не обязательно.