Планы

Новые релизы, обновления и т.п.

Модератор: immortal

Аватара пользователя
mab
Сообщения: 7
Зарегистрирован: Сб янв 19, 2019 1:26 am
Благодарил (а): 0
Поблагодарили: 1 раз

Re: Планы

Сообщение mab » Чт мар 14, 2019 7:10 pm

devoff писал(а):
Чт мар 14, 2019 6:48 pm
Вот чутка доделал, но еще поковыряю, но это просто бомба, наконец то можно просто рисовать, без всяких хтмл php, просто красота.
Круг с температурой - это так же реле света
Весь план добавил на сцену, только отдельно добавил чат.
чайнику подскажите как план добавить на сцену: тип элемента какой выбрать?
devoff
Сообщения: 179
Зарегистрирован: Пт апр 04, 2014 10:17 pm
Благодарил (а): 34 раза
Поблагодарили: 51 раз

Re: Планы

Сообщение devoff » Чт мар 14, 2019 7:27 pm

mab писал(а):
Чт мар 14, 2019 7:10 pm
devoff писал(а):
Чт мар 14, 2019 6:48 pm
Вот чутка доделал, но еще поковыряю, но это просто бомба, наконец то можно просто рисовать, без всяких хтмл php, просто красота.
Круг с температурой - это так же реле света
Весь план добавил на сцену, только отдельно добавил чат.
чайнику подскажите как план добавить на сцену: тип элемента какой выбрать?
Чуть выше писал - HTML элемент
Туда вставить КОД который появляется в разделе Планы - Просмотр - Код встраивания:
VAndrey
Сообщения: 101
Зарегистрирован: Ср окт 11, 2017 1:09 pm
Откуда: Краснодар
Благодарил (а): 92 раза
Поблагодарили: 1 раз

Re: Планы

Сообщение VAndrey » Чт мар 14, 2019 11:44 pm

devoff писал(а):
Чт мар 14, 2019 6:48 pm
Вот чутка доделал, но еще поковыряю, но это просто бомба, наконец то можно просто рисовать, без всяких хтмл php, просто красота.
Круг с температурой - это так же реле света
Весь план добавил на сцену, только отдельно добавил чат.

SVG плана - https://yadi.sk/i/13vLkKuCXnG6tg, если кто то хочет поковырять, иконки брал с https://thenounproject.com/
Как ты такую прикольную подложку под меню сделал?
Сервер на Orange Pi РС (Armbian 5.60 stable Debian GNU/Linux 9 4.14.84-sunxi)
Аватара пользователя
nick7zmail
Сообщения: 5979
Зарегистрирован: Пн окт 28, 2013 8:14 am
Откуда: Екатеринбург
Благодарил (а): 115 раз
Поблагодарили: 1480 раз

Re: Планы

Сообщение nick7zmail » Пт мар 15, 2019 7:08 am

VAndrey писал(а):
Чт мар 14, 2019 11:44 pm
devoff писал(а):
Чт мар 14, 2019 6:48 pm
Вот чутка доделал, но еще поковыряю, но это просто бомба, наконец то можно просто рисовать, без всяких хтмл php, просто красота.
Круг с температурой - это так же реле света
Весь план добавил на сцену, только отдельно добавил чат.

SVG плана - https://yadi.sk/i/13vLkKuCXnG6tg, если кто то хочет поковырять, иконки брал с https://thenounproject.com/
Как ты такую прикольную подложку под меню сделал?
Эт в svg скорее всего нарисовано. или в html который поверх svg. Это не меню, как таковое.
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
:arrow: Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
devoff
Сообщения: 179
Зарегистрирован: Пт апр 04, 2014 10:17 pm
Благодарил (а): 34 раза
Поблагодарили: 51 раз

Re: Планы

Сообщение devoff » Пт мар 15, 2019 10:30 am

VAndrey писал(а):
Чт мар 14, 2019 11:44 pm
Как ты такую прикольную подложку под меню сделал?
Это все сделано в SVG (я скинул же исходник) все данные свойств подставлены и отображаются, кайф в том что я могу в Кореле или инскейп менять цвет, размер, расположение, шрифт да все что угодно, хоть тень сделать, или плавная анимация включения, открытие двери - любой графический каприз и просто сохранить, не нужно ковырять CSS подгонять отступы, цвета, размеры, нет всяких пересечений со встроенным CSS в систему, были моменты когда все разъезжалось просто потому что где то пересекалось с шаблоном из другой сцены.


В данном скрине это сцена в которой всего 2 элемента, ХТМЛ со вставкой ПЛАНА и история сообщений (чуть поправить CSS для цвета шрифта)
Пока один только не приятный косяк - раньше при наведение на кнопку менялся курсор мышки и видно что можно нажать, теперь это просто картинка, но на планшете это не существенно )
Chainik
Сообщения: 764
Зарегистрирован: Вс янв 10, 2016 11:05 am
Благодарил (а): 85 раз
Поблагодарили: 211 раз

Re: Планы

Сообщение Chainik » Пт мар 15, 2019 11:36 am

devoff писал(а):
Пт мар 15, 2019 10:30 am
... да все что угодно, хоть тень сделать, или плавная анимация включения, открытие двери - любой графический каприз и просто сохранить...
А можно пример анимации двери/окна/штор по типу такого:
viewtopic.php?f=7&t=6178&start=21
Ну хотя бы в 2D, если в 3D невозможно.
Заранее спасибо!
devoff
Сообщения: 179
Зарегистрирован: Пт апр 04, 2014 10:17 pm
Благодарил (а): 34 раза
Поблагодарили: 51 раз

Re: Планы

Сообщение devoff » Пт мар 15, 2019 12:25 pm

Chainik писал(а):
Пт мар 15, 2019 11:36 am
devoff писал(а):
Пт мар 15, 2019 10:30 am
... да все что угодно, хоть тень сделать, или плавная анимация включения, открытие двери - любой графический каприз и просто сохранить...
А можно пример анимации двери/окна/штор по типу такого:
viewtopic.php?f=7&t=6178&start=21
Ну хотя бы в 2D, если в 3D невозможно.
Заранее спасибо!
Создаешь 2 картинки, одна открытая, другая закрытая, в СОСТОЯНИЕ ставишь ПОКАЗАТЬ, в иначе - СПРЯТАТЬ, во второй картинке обратное - спрятать\показать.
Картинку просто вырежи квадратом именно где окно, что бы на другие элементы не влияло

Если ты хочешь плавное открытие окно, то нужен сам элемент окна, а дальше вот инструкция - https://webdesign.tutsplus.com/ru/tutor ... -cms-22296
но я сам еще полноценно не пробовал, но плавное смещение сделать можно.

Вот пример как сделали ребята из системы home-assistant.io - обрати внимания на двери.
Вложения
ecaad9a580e5310bf4869aa1f579b9575a82bd0d.gif
ecaad9a580e5310bf4869aa1f579b9575a82bd0d.gif (2.28 МБ) 116 просмотров
За это сообщение автора devoff поблагодарил:
Chainik (Пт мар 15, 2019 12:50 pm)
Рейтинг: 1.37%
Аватара пользователя
nick7zmail
Сообщения: 5979
Зарегистрирован: Пн окт 28, 2013 8:14 am
Откуда: Екатеринбург
Благодарил (а): 115 раз
Поблагодарили: 1480 раз

Re: Планы

Сообщение nick7zmail » Пт мар 15, 2019 12:52 pm

На самом деле можно даже 1 картинкой и фоном обойтись.
На фоне рисуешь закрытое, поверх накладываешь открытое (со шторами та же фигня). И показываешь/прячешь только открытое.
С анимацией чуть сложнее...либо css как то прикручивать (как по ссылке выше), либо гифку записывать)) но это уже прошлый век как то...
Последний раз редактировалось nick7zmail Пт мар 15, 2019 12:56 pm, всего редактировалось 2 раза.
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
:arrow: Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
devoff
Сообщения: 179
Зарегистрирован: Пт апр 04, 2014 10:17 pm
Благодарил (а): 34 раза
Поблагодарили: 51 раз

Re: Планы

Сообщение devoff » Пт мар 15, 2019 12:55 pm

nick7zmail писал(а):
Пт мар 15, 2019 12:52 pm
На самом деле можно даже 1 картинкой и фоном обойтись.
На фоне рисуешь закрытое, поверх накладываешь открытое (со шторами та же фигня). И показываешь/прячешь только открытое.
С анимацией чуть сложнее...либо css как то прикручивать (как по ссылке выше), либо гифку записывать)) но это уже прошлый век как то...
Можно одной - да, как удобнее.
Анимация прописывается в SVG через animateTransform
Гифкой конечно удобно, но она топорней будет, по ссылке есть примеры как плавно работает SVG и как GIF
Аватара пользователя
nick7zmail
Сообщения: 5979
Зарегистрирован: Пн окт 28, 2013 8:14 am
Откуда: Екатеринбург
Благодарил (а): 115 раз
Поблагодарили: 1480 раз

Re: Планы

Сообщение nick7zmail » Пт мар 15, 2019 12:58 pm

animateTranform работет только для svg объектов. C картинками, боюсь, будет что то уродливое =D
на примере двери как раз прямоугольником svg нарисованы. А пользователь выше хочет анимацию 3-д шного окна на плане сделать.
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
:arrow: Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Ответить