GyverPortal - простой конструктор веб интерфейса.

Пользовательские блоки для коммкникации и связи GSM, GPRS, IR, Bluetooth и другие
Правила форума
Рекомендации по размещению блоков:
Автор блока создает подробное описание блока, отличие от подобных(если есть на данный момент).Сложные блоки очень желательно с примерами.
При выходе новых версий редактирует/дополняет свой первый пост с указанием даты, версии, причины.
В каждой теме обсуждается только выложенный автором блок - баги, возможность (или предложение) доработки и прочие хотелки.
Свои блоки, переработанные, с другими библиотеками, протоколами и т.д.- размещаем либо сами отдельно, либо обсуждаем и дорабатываем в форуме Разработка блоков.
Пользователи улучшив блок автора и проверив его работоспособность - могут обратиться к автору или модераторам с просьбой добавить их версию блока в первое сообщение темы.
aidar_i
Полковник
Сообщения: 3120
Зарегистрирован: 24.12.2016{, 16:55}
Репутация: 674
Откуда: Уфа
Имя: Айдар
Контактная информация:

GyverPortal - простой конструктор веб интерфейса.

#1

Сообщение aidar_i » 13.05.2022{, 21:12}

ЗДЕСЬ обсуждалась эта тема.
В начале сообщения блоки старой версии, ниже выложил новую версию.
1 версия.
Выкладываю ПБ и измененную библиотеку.
GyverPortal_.ubl
(2.12 МБ) 1011 скачиваний
GyverPortal_mod7.rar
(337.26 КБ) 1009 скачиваний
Кто скачивал с вышеуказанной темы для испытаний блоки и библиотеки, удалите все.
Нижеуказанные примеры и блоки со старыми не работают.
В библиотеке добавил выбор цвета фона , эффект нажатия, выбор положения (слева , справа, по умолчанию по центру), ширину и высоту компонента, высоту и цвет шрифта, радиус закругления.
Добавил дополнительно желтый и синий светодиоды. Замените файлы в библиотеке отсюда.

Ниже блоки, которые можно настроить по своему вкусу(это не проект,выложены просто блоки, настройки по умолчанию):
ПБ Клик настройки.flp
(423.26 КБ) 688 скачиваний
ПБ Обновление настройки.flp
(424.87 КБ) 560 скачиваний
ПБ Форма настройки.flp
(539.94 КБ) 556 скачиваний
Настраиваемые блоки режима Форм.
СпойлерПоказать
Настройки блоки форм.png
Отрисовка блоков для размещения компонентов
Пример удалил для изменения.
СпойлерПоказать
Отрисовка блоков.png
Вывод картинок
Вывод картинок.flp
(129.52 КБ) 566 скачиваний
СпойлерПоказать
Вывод картинок.png
Вывод картинок.png (12.23 КБ) 48921 просмотр
Иконки можно брать здесь icons8.ru, код тоже там же.
Вывод графиков
Вывод графика.flp
(218.4 КБ) 545 скачиваний
СпойлерПоказать
Графики.png
------------------------------------------------------------------------------
2 версия , измененные блоки, библиотека и примеры.
Библиотека
GyverPortal_3.2.rar
(44.52 КБ) 608 скачиваний
Примеры, блок
Примеры GP.rar
(1.53 МБ) 570 скачиваний
Проверил все примеры на ЕСП32. Блоки меню пока не работают, ждем новую версию.
Хорошо работает многостраничность. Видео
GPМногостраничность.rar
(259.5 КБ) 502 скачивания
Привел пример с подробным описанием блоков многостраничности, придерживаться порядок расположения и компиляции блоков, иначе не будет работать. Что бы не путаться.
Старые и новые блоки и библиотеки не совместимы.
Оригинальная библиотека не совместима с блоками, устанавливайте выложенные здесь.

Внимание! Тело проекта расположите в платах выше плат с блоками портала.
Блоки портала должны быть последними в проекте.
Расположите блоки портала отдельно на своих платах, тогда порядок компиляции будет так, как они стоят в проекте. Можно их и сдвигать вместе с платой куда надо.
Для уменьшения плат можно располагать по 2-3 блока в плате, их корректировать проще.
Можно блоки вырезать и снова поставить, тогда они будут компилироваться ниже блоков, которые остались на плате.
ОТА тоже работает.

Снял видео инструкцию по блокам GP:
СпойлерПоказать
СпойлерПоказать
Здесь дополнительные блоки с возможностью установки любого цвета светодиодов и фона страницы.
—--------------------------------------------------------------------------------------------------------------------------------------------------------------------
Для работы с точкой доступа нужно использовать файловую систему ЕСП. Так как появились вопросы форумчан, выкладываю папку tools, которую нужно положить в папку ...\FLProg_8-0-2_Win64\ideV8\portable\sketchbook, тогда у вас будет работать файловая система. В Ардуино Иде в Tools появится надписи “ESP8266 LittleFS Data Upload“ и “ESP32 Sketch Data Upload“. Сохранить скетч, положить в папку со скетчем папку data. в которую положить нужные файлы для сохранения в файловую систему. В Ардуино Иде нажать нужную надпись и ФС прошьется, потом загрузите скетч. Далее вы можете прошивать только скетч, если файлы из ФС используются те же. Для GP прошейте файлы из библиотеки, там есть папка data, в примерах я его использую.
tools.rar
(13.73 КБ) 232 скачивания
----------------------------------------------------------------------------
3 версия по библиотеке 3.5.2. (В библиотеке ничего не менял) , выложил блоки, примеры и библиотеку.
Блоки:
GPv3.5.rar
(191.32 КБ) 320 скачиваний
Примеры GPv3.5.rar
(366.42 КБ) 342 скачивания
Бимблиотека:
GyverPortal-3.5.2.rar
(319.78 КБ) 348 скачиваний
Внимание!
Пользуйтесь только одной версией портала.
В каждой версии я выложил библиотеку этой версии.
Видео для прежней версии в основном подходит и для последней версии для понимания блоков.
4я версия ТУТ.

ArtemArable
Сержант
Сообщения: 139
Зарегистрирован: 23.11.2020{, 16:46}
Репутация: 10
Имя: Artem

GyverPortal - простой конструктор веб интерфейса.

#61

Сообщение ArtemArable » 30.05.2022{, 16:20}

aidar_i писал(а):
30.05.2022{, 13:51}
Блок для настройки страницы: цвета фона , высоту и цвет и стиль шрифтов и тп
Настройки страницы BODY.flp
Ставьте блок add.BODY(......) после add.THEME(......);
Для фона создайте дополнительно сами классы с нужными цветами в файле themes.h
".backgroundgreen_4CAF50 {background-color:#4CAF50!important;}\n"
меняя эти выделенные названия и хекс код цвета.
Библиотеку с последними изменениями выложу в первую тему 6 версия.

Отправлено спустя 11 минут :
Всё на этом нужно остановиться, думаю. Что то затянуло. Эстафету примите :)
Жаль. Моих знаний не хватит на весь охват.

aidar_i
Полковник
Сообщения: 3120
Зарегистрирован: 24.12.2016{, 16:55}
Репутация: 674
Откуда: Уфа
Имя: Айдар
Контактная информация:

GyverPortal - простой конструктор веб интерфейса.

#62

Сообщение aidar_i » 30.05.2022{, 17:17}

ArtemArable писал(а):
30.05.2022{, 16:20}
Жаль. Моих знаний не хватит на весь охват
Хватит. Это нужно делать, если Вам нужен другой цвет, кроме находящихся в библиотеке.
Просто откройте вышеуказанный файл в notepad++, найдите темной или в светлой теме такую строку, скопируйте и вставьте ниже, его то будете изменять, например, цвет светлее сделаем, пишем вместо выделенного кода, можно отсюда https://colorscheme.ru/html-colors.html , greenyellow и #ADFF2F.
И соохраните файл.

Аватара пользователя
Rovki
Полковник
Сообщения: 4872
Зарегистрирован: 22.04.2016{, 17:25}
Репутация: 269
Откуда: Чехов
Имя: Анатолий
Контактная информация:

GyverPortal - простой конструктор веб интерфейса.

#63

Сообщение Rovki » 30.05.2022{, 17:24}

Совершенству нет предела ,в отличии от жизни человека :smile37:
Электронщик до мозга костей и не только

ArtemArable
Сержант
Сообщения: 139
Зарегистрирован: 23.11.2020{, 16:46}
Репутация: 10
Имя: Artem

GyverPortal - простой конструктор веб интерфейса.

#64

Сообщение ArtemArable » 30.05.2022{, 18:31}

ArtemArable писал(а):
30.05.2022{, 16:20}
aidar_i писал(а):
30.05.2022{, 13:51}
Блок для настройки страницы: цвета фона , высоту и цвет и стиль шрифтов и тп
Настройки страницы BODY.flp
Ставьте блок add.BODY(......) после add.THEME(......);
Для фона создайте дополнительно сами классы с нужными цветами в файле themes.h
".backgroundgreen_4CAF50 {background-color:#4CAF50!important;}\n"
меняя эти выделенные названия и хекс код цвета.
Библиотеку с последними изменениями выложу в первую тему 6 версия.

Отправлено спустя 11 минут :
Всё на этом нужно остановиться, думаю. Что то затянуло. Эстафету примите :)
Жаль. Моих знаний не хватит на весь охват.
Я про доводку основных блоков имел ввиду. Красота для меня на третьем месте после надежност и функциональности.

aidar_i
Полковник
Сообщения: 3120
Зарегистрирован: 24.12.2016{, 16:55}
Репутация: 674
Откуда: Уфа
Имя: Айдар
Контактная информация:

GyverPortal - простой конструктор веб интерфейса.

#65

Сообщение aidar_i » 30.05.2022{, 19:42}

Ааа, Вы на счёт этого, найдется человек, который воплотит в новом редакторе. По возможности, конечно постараюсь, что то делать, но времени будет мало. Я, главное, дал наработки, развивать и переделывать будет уже легче. У одного форумчанина, например, есть идея, чтобы порядок компиляции не зависел от очереди вытаскивания блоков.

ArtemArable
Сержант
Сообщения: 139
Зарегистрирован: 23.11.2020{, 16:46}
Репутация: 10
Имя: Artem

GyverPortal - простой конструктор веб интерфейса.

#66

Сообщение ArtemArable » 31.05.2022{, 18:47}

aidar_i писал(а):
30.05.2022{, 09:26}
ArtemArable писал(а):
30.05.2022{, 08:43}
1. Планируете Вы как автор дополнить блоки входами предустановки? Пример выложил выше. В практике необходимо для сохранения настроек.
Вот блок для слайдера, подправил Вашу. Да, нужно все аналогично сделать, может поможете?
Слайдер со стартовым значением.flp
Удалите в ПБ и добавьте эту.
Я занимаюсь. Как закончу или упрусь - скину Вам.

Отправлено спустя 2 часа 4 минуты 36 секунд:
Есть затруднение с Date и Time. Выход типа String, но в библиотеке привязывается к структуре GPtime.

aidar_i
Полковник
Сообщения: 3120
Зарегистрирован: 24.12.2016{, 16:55}
Репутация: 674
Откуда: Уфа
Имя: Айдар
Контактная информация:

GyverPortal - простой конструктор веб интерфейса.

#67

Сообщение aidar_i » 31.05.2022{, 22:36}

aidar_i писал(а):
30.05.2022{, 13:51}
Блок для настройки страницы: цвета фона , высоту и цвет и стиль шрифтов и тп
Настройки страницы BODY.flp
Ставьте блок add.BODY(......) после add.THEME(......);
Для фона создайте дополнительно сами классы с нужными цветами в файле themes.h
".backgroundgreen_4CAF50 {background-color:#4CAF50!important;}\n"
меняя эти выделенные названия и хекс код цвета.
Библиотеку с последними изменениями выложу в первую тему 6 версия.
С помощью этого блока можно вставить фоном любое изображение свое или с интернета. Если свое, то нужно не очень большой файл, его нужно конвертировать в код, как в блоке вставки изображения.
С интернета - вставить ссылку на изображение в файле themes.h в этих строках (можно их вставить в файл и изменить имя класса и ссылку на картинку.

//рисунок фона по ссылке, три строки вставлять и изменить название класса и поставить свою ссылку.
".backgroundimage1{background: url(https://cdn.pixabay.com/photo/2018/04/3 ... 60_720.jpg) !important;"
"background-repeat: no-repeat !important;background-position: center center !important;background-attachment: fixed !important;"
"-webkit-background-size: cover !important;-moz-background-size: cover !important;-o-background-size: cover !important;background-size: cover !important;}\n"
Попробуйте в параметрах настройки поставить backgroundimage, backgroundimage1,2,3.
Замените этот файл в библиотеке, там созданы классы под картинки backgroundimage(простой маленький рисунок размножается и заполняет страницу), backgroundimage1,2,3(растягивается по странице).
themes.h
(6.36 КБ) 38 скачиваний
СпойлерПоказать
Фон картинкой1.png
СпойлерПоказать
Фон картинкой.png

aidar_i
Полковник
Сообщения: 3120
Зарегистрирован: 24.12.2016{, 16:55}
Репутация: 674
Откуда: Уфа
Имя: Айдар
Контактная информация:

GyverPortal - простой конструктор веб интерфейса.

#68

Сообщение aidar_i » 05.06.2022{, 08:36}

Запустил многостраничность
GyverPortal многостраничностьESP8266.flp
(547.34 КБ) 82 скачивания
Пример с двумя страницами , кнопка для перехода на другую страницу. Чтобы перейти из белой темы (стр 2) на черную(стр1) нажмите 2 раза.
Блоками из примера замените блоки в ПБ.

aidar_i
Полковник
Сообщения: 3120
Зарегистрирован: 24.12.2016{, 16:55}
Репутация: 674
Откуда: Уфа
Имя: Айдар
Контактная информация:

GyverPortal - простой конструктор веб интерфейса.

#69

Сообщение aidar_i » 07.06.2022{, 10:51}

Обновил блоки и библиотеку в первом сообщении.
Создал блоки для вывода графиков в разделе режима Обновления.
Далее постараюсь сделать примеры по использованию блоков и снять видео.

Аватара пользователя
Imran
Сержант
Сообщения: 228
Зарегистрирован: 08.11.2017{, 20:53}
Репутация: 8
Имя: Имран

GyverPortal - простой конструктор веб интерфейса.

#70

Сообщение Imran » 07.06.2022{, 17:17}

https://prnt.sc/MiGW0jy7OTTf появляется вот такая ошибка
Вложения
752_W_D1_M_P_v_1.flp
(826.96 КБ) 41 скачивание

aidar_i
Полковник
Сообщения: 3120
Зарегистрирован: 24.12.2016{, 16:55}
Репутация: 674
Откуда: Уфа
Имя: Айдар
Контактная информация:

GyverPortal - простой конструктор веб интерфейса.

#71

Сообщение aidar_i » 07.06.2022{, 17:50}

Imran писал(а):
07.06.2022{, 17:17}
https://prnt.sc/MiGW0jy7OTTf появляется вот такая ошибка
Параметр Настройка не имеет класс Privet, его вставьте в Параметр Текст. Что входит в Настройка смотрите описание блока. Проверил , компилируется.
Скачайте последние блоки и библиотеку(можно сказать, стабильная версия), придется пересобрать проект.

Аватара пользователя
Imran
Сержант
Сообщения: 228
Зарегистрирован: 08.11.2017{, 20:53}
Репутация: 8
Имя: Имран

GyverPortal - простой конструктор веб интерфейса.

#72

Сообщение Imran » 08.06.2022{, 10:54}

Объясните пожалуйста что не так делаю.Я понимаю что проблема во мне, большинство блоков у меня выходят с одинаковой ошибкой, направьте меня на мою ошибку.
aidar_i писал(а):
07.06.2022{, 10:51}
Обновил блоки и библиотеку в первом сообщении
07 июн 2022 11:51
aidar_i писал(а):
07.06.2022{, 17:50}
Скачайте последние блоки и библиотеку
перед тем как начать удалил все старое , время сборки 07 июн 2022 18:17

ошибка похоже та же самая
https://prnt.sc/C_nPY9yWC7Cd

Может построение и очередность не правильная ?
проект
752_W_D1_M_P_v_2.flp
(884.55 КБ) 26 скачиваний

aidar_i
Полковник
Сообщения: 3120
Зарегистрирован: 24.12.2016{, 16:55}
Репутация: 674
Откуда: Уфа
Имя: Айдар
Контактная информация:

GyverPortal - простой конструктор веб интерфейса.

#73

Сообщение aidar_i » 08.06.2022{, 16:55}

Лучше сделать так, тело программы расположить выше блоков портала.
752_W_D1_M_P_v_3.flp
(662.23 КБ) 43 скачивания
А то сетап дисплея оказывается внутри build()
У меня не заработала точка доступа, работает , если только убрать блоки дисплея, пока не могу разобраться, почему. Портал работает без дисплея.
Asoled перестал работать с ЕСП8266 через вайфай.

Отправлено спустя 1 час 40 минут 42 секунды:
Imran писал(а):
08.06.2022{, 10:54}
ошибка похоже та же самая
Пока поставьте блоки для дисплея из другой библиотеки

Аватара пользователя
Imran
Сержант
Сообщения: 228
Зарегистрирован: 08.11.2017{, 20:53}
Репутация: 8
Имя: Имран

GyverPortal - простой конструктор веб интерфейса.

#74

Сообщение Imran » 09.06.2022{, 15:30}

Может я не правильно настраиваю блоки ? включить отключить что то работает, а вывод не работают и еше сам контроллер Wemos D1 Mini Pro а я пишу на Wemos D1 Mini , это серьёзную роль играет ??
aidar_i писал(а):
08.06.2022{, 18:36}
Пока поставьте блоки для дисплея из другой библиотеки
вообще удалил блоки дисплея

https://prnt.sc/doRiJUOcG0uP

вот проект
752_W_D1_M_P_v_4.flp
(496.59 КБ) 31 скачивание

aidar_i
Полковник
Сообщения: 3120
Зарегистрирован: 24.12.2016{, 16:55}
Репутация: 674
Откуда: Уфа
Имя: Айдар
Контактная информация:

GyverPortal - простой конструктор веб интерфейса.

#75

Сообщение aidar_i » 10.06.2022{, 06:26}

Imran писал(а):
09.06.2022{, 15:30}
Может я не правильно настраиваю блоки ? включить отключить что то работает, а вывод
У Вас стоят 2 библиотеки старой версии, удалите их все. В ошибках путь написана, где находятся библиотеки. Потом установите GyverPortal_mod7

Отправлено спустя 7 минут 28 секунд:
Imran писал(а):
09.06.2022{, 15:30}
Wemos D1 Mini Pro а я пишу на Wemos D1 Mini , это серьёзную роль играет ??
Нет, в иде поставьте про, если и не поставите, все равно будет работать, только как простой вемос.

Аватара пользователя
Imran
Сержант
Сообщения: 228
Зарегистрирован: 08.11.2017{, 20:53}
Репутация: 8
Имя: Имран

GyverPortal - простой конструктор веб интерфейса.

#76

Сообщение Imran » 10.06.2022{, 10:48}

aidar_i писал(а):
10.06.2022{, 06:33}
GyverPortal_mod7
название должен быть GyverPortal_mod7 ? или GyverPortal_mod ?

aidar_i
Полковник
Сообщения: 3120
Зарегистрирован: 24.12.2016{, 16:55}
Репутация: 674
Откуда: Уфа
Имя: Айдар
Контактная информация:

GyverPortal - простой конструктор веб интерфейса.

#77

Сообщение aidar_i » 10.06.2022{, 12:13}

Imran писал(а):
10.06.2022{, 10:48}
aidar_i писал(а):
10.06.2022{, 06:33}
GyverPortal_mod7
название должен быть GyverPortal_mod7 ? или GyverPortal_mod ?
Название папки не важно, внутри папки файлы не трогайте, но лучше как у меня, чтобы видеть GyverPortal_mod7

Аватара пользователя
Imran
Сержант
Сообщения: 228
Зарегистрирован: 08.11.2017{, 20:53}
Репутация: 8
Имя: Имран

GyverPortal - простой конструктор веб интерфейса.

#78

Сообщение Imran » 10.06.2022{, 16:30}

Спасибо заработало :)
aidar_i писал(а):
10.06.2022{, 06:33}
У Вас стоят 2 библиотеки старой версии, удалите их все. В ошибках путь написана, где находятся библиотеки. Потом установите GyverPortal_mod7


Просто так закинул блоки что бы понять как работает GyverPortal_mod7, Вы писали соблюдать очередность блоков, тот блок который в Флпрог второй https://prnt.sc/Kj17u5PklFhk но в браузере он девятый https://prnt.sc/Znx0DiXTvHp9
и многие в разброску стоят не как в Флпрог

Что я не правильно понял?
Вложения
752_W_D1_M_P_v_6.flp
(602.98 КБ) 39 скачиваний

aidar_i
Полковник
Сообщения: 3120
Зарегистрирован: 24.12.2016{, 16:55}
Репутация: 674
Откуда: Уфа
Имя: Айдар
Контактная информация:

GyverPortal - простой конструктор веб интерфейса.

#79

Сообщение aidar_i » 10.06.2022{, 19:46}

Imran писал(а):
10.06.2022{, 16:30}
Что я не правильно понял?
Очередность вытаскивания блоков- вот порядок расположения компонентов в браузере! А не как они расположены в программе! Какой блок вытащил раньше, тот и выше. Если его даже перетащишь ниже, все равно он будет на своем прежнем месте.
Но если расположите каждый блок на своей плате, то порядок компиляции будет как в проекте.

Аватара пользователя
Imran
Сержант
Сообщения: 228
Зарегистрирован: 08.11.2017{, 20:53}
Репутация: 8
Имя: Имран

GyverPortal - простой конструктор веб интерфейса.

#80

Сообщение Imran » 13.06.2022{, 16:26}

aidar_i писал(а):
10.06.2022{, 19:46}
Очередность вытаскивания блоков- вот порядок расположения компонентов в браузере!
Все ТИП ТОП СПАСИБО

Ответить

Вернуться в «Коммуникация и связь»