Дизайн сцен 2
Модератор: immortal
-
- Сообщения: 186
- Зарегистрирован: Вс май 28, 2017 9:24 am
- Благодарил (а): 8 раз
- Поблагодарили: 22 раза
Re: Дизайн сцен 2
Сижу, потихоньку курочу под себя сцены...
Проблема в том, что то, что хорошо на ноуте или планшете - отвратно выглядит на смартфоне с МажорДроидом...
К примеру, если даже повернуть смартфон на бок - кнопки приложения сдвигают интерфейс вниз и часть оказывается за прокруткой.
В вертикальном - или прокрутка вправо-влево, или маааахонькое окошко вверху...
Сейчас сижу, прикидываю как бороться: то-ли разные сцены для разных устройств, то-ли в сцене динамически подстраиваться под размер экрана...
Проблема в том, что то, что хорошо на ноуте или планшете - отвратно выглядит на смартфоне с МажорДроидом...
К примеру, если даже повернуть смартфон на бок - кнопки приложения сдвигают интерфейс вниз и часть оказывается за прокруткой.
В вертикальном - или прокрутка вправо-влево, или маааахонькое окошко вверху...
Сейчас сижу, прикидываю как бороться: то-ли разные сцены для разных устройств, то-ли в сцене динамически подстраиваться под размер экрана...
- nick7zmail
- Сообщения: 7573
- Зарегистрирован: Пн окт 28, 2013 8:14 am
- Откуда: Екатеринбург
- Благодарил (а): 121 раз
- Поблагодарили: 2010 раз
Re: Дизайн сцен 2
Для телефона использую интерфейс только /menu.html, сцены - для всего остального...можете попробовать на основе дашборда интерфейс набросать...он по идее автоматически перестраиваться должен...
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
- profx5016
- Сообщения: 21
- Зарегистрирован: Вт май 23, 2017 12:08 pm
- Откуда: Беларусь
- Благодарил (а): 13 раз
- Поблагодарили: 0
Re: Дизайн сцен 2
Приветствую всех участников! Помогите разобраться, что не так. На главной сцене сделал кнопки.
https://www.dropbox.com/s/haitixi4s4litoc/1.JPG?dl=0
По задумке, каждая кнопка должна подсвечиваться, когда активная.
В элемнте general css добавил стили для кнопок:
Cоздал элемент panel-newmenu, в нем прописал кнопки:
В "дополнительный код JavaScript", добавил код (его написал уважаемый Рони с форума javascript.ru, за что ему отдельное спасибо!):
Но ничего не происходит... Если создать отдельный html документ и открыть в браузере - все работает. В сцене - не работает. Помогите разобраться, в чем затык, что не так? Спасибо!
https://www.dropbox.com/s/haitixi4s4litoc/1.JPG?dl=0
По задумке, каждая кнопка должна подсвечиваться, когда активная.
В элемнте general css добавил стили для кнопок:
Код: Выделить всё
.button-style{
display:inline-block;
box-sizing:border-box;
text-align:center;
width:93px;
height:93px;
color:#fff;
padding:2px;
margin:2px 0px 0px 0px;
cursor:pointer;
border:3px solid rgba(138,43,226,1);
-webkit-transform:translateZ(0);
-webkit-backface-visibility:hidden;
-moz-border-radius:10px 10px 10px 10px;
-webkit-border-radius:10px;
border-radius:10px 10px 10px 10px;
background-color:rgba(0,0,0,0.4);
}
.button-style.s2{
background-color:rgba(138,43,226,0.5);
}
.button-style:hover {
background-color: rgba(138, 43, 226, 0.5);
}
.button-style a {
text-decoration: none;
margin: 0;
padding: 0;
text-transform: uppercase;
font-family:italic;
font-weight: 600;
font-size:14px;
}
.button-style a:hover {
color: #fff;
}
Код: Выделить всё
<div class="button-style"><a href="#tab1"><i class="fa fa-list fa-4x" aria-hidden="true"></i>заметки</a></div>
<div class="button-style"><a href="#tab2"><i class="fa fa-android fa-4x" aria-hidden="true"></i>Алиса</a></div>
<div class="button-style"><a href="#tab3"><i class="fa fa-question fa-4x" aria-hidden="true"></i>UNKNOWN</a></div>
<div class="button-style"><a href="#tab4"><i class="fa fa-tint fa-4x" aria-hidden="true"></i>Погода</a></div>
<div class="button-style"><a href="#tab5"><i class="fa fa-laptop fa-4x" aria-hidden="true"></i>система</a></div>
Код: Выделить всё
window.addEventListener('DOMContentLoaded', function() {
var button = document.querySelectorAll('.button-style');
[].forEach.call(button, function(but) {
but.addEventListener('click', function() {
[].forEach.call( button, function(el) {
el == but ? el.classList.add("s2"):
el.classList.remove('s2');
});
});
});
});
-
- Сообщения: 37
- Зарегистрирован: Ср апр 26, 2017 11:52 am
- Благодарил (а): 2 раза
- Поблагодарили: 1 раз
Re: Дизайн сцен 2
Подскажите пожалуйста.
Как убрать фон у лампочки на сцене?
Сделал кнопку с лампочкой на планировке. При выключенном состоянии лампочка белая при включенном желтая, а как фон подсветки убрать?
Как убрать фон у лампочки на сцене?
Сделал кнопку с лампочкой на планировке. При выключенном состоянии лампочка белая при включенном желтая, а как фон подсветки убрать?
- nick7zmail
- Сообщения: 7573
- Зарегистрирован: Пн окт 28, 2013 8:14 am
- Откуда: Екатеринбург
- Благодарил (а): 121 раз
- Поблагодарили: 2010 раз
Re: Дизайн сцен 2
В этой теме есть ответ...но я хз где он...
UPD: А, вот он viewtopic.php?t=2588&p=31207#p31207 ...еле нашел)) Пора начинать собирать полезные ссылки.
UPD: А, вот он viewtopic.php?t=2588&p=31207#p31207 ...еле нашел)) Пора начинать собирать полезные ссылки.
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
- lanket
- Сообщения: 1168
- Зарегистрирован: Вт окт 14, 2014 11:27 pm
- Откуда: Санкт-Петербург
- Благодарил (а): 260 раз
- Поблагодарили: 163 раза
Re: Дизайн сцен 2
Может костыльно, но я конвертил в gif с альфаканалом.Kas-11 писал(а):Подскажите пожалуйста.
Как убрать фон у лампочки на сцене?
Сделал кнопку с лампочкой на планировке. При выключенном состоянии лампочка белая при включенном желтая, а как фон подсветки убрать?
Отправлено с моего Redmi Note 3 через Tapatalk
Разработка голосового асистента для Мажордомо по любому ключевому слову.
Обсужение
gitHub 2й версии терминала
GitHub модуля для МД
gitHub сырого модуля 2й версии
Connect
Rasberry Pi 2, MDM, MySensors. И говорящий апельсин.
Обсужение
gitHub 2й версии терминала
GitHub модуля для МД
gitHub сырого модуля 2й версии
Connect
Rasberry Pi 2, MDM, MySensors. И говорящий апельсин.
-
- Сообщения: 37
- Зарегистрирован: Ср апр 26, 2017 11:52 am
- Благодарил (а): 2 раза
- Поблагодарили: 1 раз
Re: Дизайн сцен 2
Я скачал две иконки лампочки, которые мне понравились, одна белого цвета вторая желтого. (размером в 2 раз меньше чем стандартные).lanket писал(а):
Может костыльно, но я конвертил в gif с альфаканалом.
Установил их на сцену. При включенном состоянии у меня показывает желтая картинка с лампочкой при выключенном состоянии белая.
Фон остался прежнего размера и тоже цвет меняет. Как убрать его не пойму.
- nick7zmail
- Сообщения: 7573
- Зарегистрирован: Пн окт 28, 2013 8:14 am
- Откуда: Екатеринбург
- Благодарил (а): 121 раз
- Поблагодарили: 2010 раз
Re: Дизайн сцен 2
Блин...я ж вам 2 сообщения назад написал, как сделать.
Отправлено с моего Xperia Z через Tapatalk
Отправлено с моего Xperia Z через Tapatalk
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
- nick7zmail
- Сообщения: 7573
- Зарегистрирован: Пн окт 28, 2013 8:14 am
- Откуда: Екатеринбург
- Благодарил (а): 121 раз
- Поблагодарили: 2010 раз
Re: Дизайн сцен 2
http://www.iconarchive.com/tag/battery
Ещё можно при помощи шрифта font-awesome сделать...были примеры уже.
Ещё можно при помощи шрифта font-awesome сделать...были примеры уже.
- За это сообщение автора nick7zmail поблагодарили (всего 2):
- vshuka911 (Вс июл 02, 2017 10:46 pm) • wozowik (Чт фев 15, 2018 1:16 pm)
- Рейтинг: 2.33%
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<