Разработка моб. приложения - конструктора 2.X

Возобновляю разработку, теперь уже кроссплатформенного приложения

 
Посетитель
small user social cms
Медаль
Сообщений: 180
Доброго времени суток, дорогие друзья!

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

Сразу оговорюсь - это будет полностью бесплатный проект с открытым исходным кодом, в рамках которого мною будут предприняты попытки по реализации приложения-конструктора для CMS.

На начало разработки (31.01.2020 г.) реализовано очень мало:

- Формирование sideMenu на стороне CMS (в админ-панели добавляется новое меню с зарезервированным названием, пункты парсятся в моб. приложение)
Разработка моб. приложения - конструктора
- Вывод списка записей любого типа контента. Шаблоны вывода списка ограничены двумя прессетами на стороне приложения, а так же уже реализован функционал, по самостоятельному созданию и выбору шаблона для каждого имеющегося типа контента в админ-панели в настройках компонента API.

Разработка моб. приложения - конструктора
Для создания шаблона списка используется HTML подобный синтаксис, который называется JSX и разработан специально для фреймворка React js/React Native.
В дальнейшем обязательно запишу подробную инструкцию, по созданию шаблонов.


- Реализован функционал, по выбору цветовой схемы для приложения (пока только основной цвет текста и интерфейса)

Очень скоро:
- Ленивая загрузка (реализована на 90%, мелкие корректировки)
- PullToRefresh (потянуть список => перезагрузить) - аналогично;
- Вывод объекта любого типа контента (реализовано на 90%);
- Добавление/удаление/редактирование объекта типа контента;
- Авторизация/Регистрация/Восстановление по email (жду, когда в коробку CMS добавят функционал, который позволит авторизоваться по любому из полей - после этого будет реализована авторизация/регистрация/восстановление по СМС.


Предлагайте, обсуждайте - давайте вместе расставим приоритеты в необходимом функционале. Разработка моб. приложения - конструктора


06.02.2020 г.

Вся информация здесь:

https://github.com/VunderkindMedia/Instantcms-2-mobile-app/blob/master/README.md


22.02.2020 г.


07.05.2020 г.

Дароботана авторизация, грид сетка в списках.

https://play.google.com/store/apps/details?id=com.vunderkind.media
Редактировалось: 3 раз (Последний: 7 мая 2020 в 16:24)
Игорь Дмитриевич =)
Посетитель
small user social cms
МедальПочетный донор проекта
Сообщений: 942
Круто, конструктор правится в админке на компьютере или как то иначе? У меня пока предложений нет, походу дела появятся)) Вы главное не исчезайте вот первая рекомендация)))
Реклама
cms
Посетитель
small user social cms
Медаль
Сообщений: 180
Заралик:
Круто, конструктор правится в админке на компьютере или как то иначе? У меня пока предложений нет, походу дела появятся)) Вы главное не исчезайте вот первая рекомендация)))

под конструктором подразумевается приложение, максимально настраиваемое с админки CMS.

Настройка визуальной составляющей;
Полное взаимодействие с системой типов контента (уже реализован вывод списка записей любых типов контента);

Это база, которую необходимо реализовать.

Нужны хотелки и приоритеты, без них нет четкого понятия, что люди хотят видеть в приложении.

Заралик:
Вы главное не исчезайте вот первая рекомендация)))

На самом деле мотивация большая, так как сам заинтересован в мобильном приложении для своего проекта.
Реализация прошлой версии моб. приложения (было приложение под Android) не была остановлена - я доделал его под свои нужды и свернул разработку, ввиду отсутствия свободного времени и появления серьезных семейных обстоятельств.

Обещать ничего не хочу, но одно могу сказать точно - буду стараться, есть огромная мотивация в этом. Мне очень нравится эта CMS, за что я активно ее хвалю среди всех мобильных разработчиков, которых встречаю, как хороший бэкенд для проектов.

P.S. Разработать приложение индивидуально под конкретный сайт на instantcms 2 гораздо проще, нежели делать клиент, максимально адаптированный под архитектуру CMS.
Редактировалось: 1 раз (Последний: 31 января 2020 в 08:06)
Игорь Дмитриевич =)
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 3780
Vunderkind, молодец! Думаю надо реализовать только вывод всех типов контента с удобной навигацией. Обязательно фото галерею. Ну и конечно виджеты основные.
Регистрацию и авторизацию.
Добавление контента обязательно
Комментарии
Посетитель
small user social cms
Медаль
Сообщений: 180
Алексей Тимофеев:
Vunderkind, молодец! Думаю надо реализовать только вывод всех типов контента с удобной навигацией. Обязательно фото галерею. Ну и конечно виджеты основные.
Регистрацию и авторизацию.
Добавление контента обязательно
Комментарии

Большое спасибо.
Единственное - с виджетами немного не понятно, куда и как их применять в мобильном приложении. Разве что если использовать систему для интернет магазина. В остальном, полагаю, виджеты будут занимать полезное пространство на мобильных устройствах.
Редактировалось: 1 раз (Последний: 31 января 2020 в 08:56)
Игорь Дмитриевич =)
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1399
Виджеты можно в сайд меню выводить. И не только в главное но и по нажатие на некую плавающую кнопку. А виджеты в основной колонке можно прятать под спойлер или даже меню используя соответствующие обёртки виджетов.
Не понятно почему стоит такой вопрос - где выводить?
А вёрстка для виджетов и в целом для выводимого контента как формируются? Так же в файлах шаблонах?
Веб разработка Готовые решения, ответы на вопросы, объявления. skype:gdvden
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1399
Тут нужно обязательно учитывать юзабилити и возможность вёрстки шаблонов под виджеты и контент.
Толку не много будет от моб приложения если не учитывать эти моменты, или просто стыдно за свой сайт если будет выглядеть как на снимках выше. Я бы мог помочь с этим, если можно и нужно )
Веб разработка Готовые решения, ответы на вопросы, объявления. skype:gdvden
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1399
Алексей Тимофеев:

надо реализовать только вывод всех типов контента

Нет, это будет что-то очень странное )) хотя, если код будет в свободной доступе, то можно по примеру и с другими разделами поработать )
Веб разработка Готовые решения, ответы на вопросы, объявления. skype:gdvden
Посетитель
small user social cms
Медаль
Сообщений: 180
GoodMade:

Виджеты можно в сайд меню выводить. И не только в главное но и по нажатие на некую плавающую кнопку. А виджеты в основной колонке можно прятать под спойлер или даже меню используя соответствующие обёртки виджетов.
Не понятно почему стоит такой вопрос - где выводить?
А вёрстка для виджетов и в целом для выводимого контента как формируются? Так же в файлах шаблонах?

Вопрос возник по той причине, что концепция дизайна мобильного приложения в целом кординально отличается от адаптации web версии под моюильные устройства.
Как раз material design и cupertino style (стандарты android и ios) все это описывают для повышения юзабилити. Рекомендуют отступы, размеры шрифта, размеры элементов. И при минимальном соблюдении этих норм, виджеты будут занимать полезное пространство.
Я вижу лишь один виджет, который может существовать в моб. приложении - это карусель обектов типа контента.

Что касается прицнипа создания шаблонов - могу показать и обьяснить в лс, как я это вижу и как реализовал это для списка.

Любой помощи буду только рад.
Игорь Дмитриевич =)
Посетитель
small user social cms
Медаль
Сообщений: 180
Vunderkind:
Нет, это будет что-то очень странное )) хотя, если код будет в свободной доступе, то можно по примеру и с другими разделами поработать )

Как правило, почти все дополнения имеют вывод на основе типов контента - с этим проблем не будет.

Что касается контроллеров, которые имеют свои шаблоны вывод - необходимо будет дописывать api, но проблем я с этим не вижу, главное чтоб был доступен исходный код этих контроллеров или описание модели.
Игорь Дмитриевич =)
Посетитель
no avatar
Почетный донор проектаМедаль
Сообщений: 580
Vunderkind:
прицнипа создания шаблонов - могу показать и обьяснить в лс
Как в лс, не надо в лс. Просьба выкладывайте всё сюда, если это конечно возможно и вы этого хотите.
Очень интересная и нужная тема.
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1399
Vunderkind, а почему например не карусель виджетов?
Можно и в ЛС но лучше в теме форума обсудить )
Веб разработка Готовые решения, ответы на вопросы, объявления. skype:gdvden
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1399
 уже реализован функционал, по самостоятельному созданию и выбору шаблона для каждого
Упустил ) Обычный php html шаблон? А для виджетов?
Веб разработка Готовые решения, ответы на вопросы, объявления. skype:gdvden
Посетитель
small user social cms
Медаль
Сообщений: 180
GoodMade:

 уже реализован функционал, по самостоятельному созданию и выбору шаблона для каждого
Упустил ) Обычный php html шаблон? А для виджетов?


Нет. Шаблон строится на JSX разметке, свойственной для React Native.

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

Код HTML:
  1. <TouchableOpacity onPress={myHandler}>
  2. <View
  3. style={{
  4. borderRadius: 6,
  5. marginTop: 2,
  6. marginBottom: 2,
  7. marginLeft: 4,
  8. marginRight: 4,
  9.  
  10. }}
  11. >
  12. <View
  13. style={{
  14. flexDirection: "row",
  15. backgroundColor: '#fff'
  16. }}
  17. >
  18. <Image
  19. imageStyle={{ borderRadius: 4 }}
  20. source={{
  21. uri: photo.big
  22. }}
  23. style={{
  24. width: 80,
  25. height: 80,
  26. borderTopLeftRadius: 6,
  27. borderBottomLeftRadius: 6
  28. }}
  29. />
  30. <View
  31. style={{
  32. flexDirection: "column",
  33. flex: 1
  34. }}
  35. >
  36. style={{
  37. color: main_color,
  38. flex: 1,
  39. margin: 7
  40. }}
  41. >
  42. {title}
  43. </Text>
  44. <View
  45. style={{
  46. margin: 10,
  47. flexDirection: "row"
  48. }}
  49. >
  50. <Ionicons
  51. style={{
  52. color: main_color,
  53. fontSize: 14
  54. }}
  55. name={Platform.OS === "ios" ? "ios-calendar" : "md-calendar"}
  56. />
  57. style={{
  58. fontSize: 12,
  59. color: main_color,
  60. marginRight: 7,
  61. marginLeft: 3
  62. }}
  63. >
  64. {date_pub}
  65. </Text>
  66. <Ionicons
  67. style={{
  68. color: main_color,
  69. fontSize: 14
  70. }}
  71. name={Platform.OS === "ios" ? "ios-eye" : "md-eye"}
  72. />
  73. style={{
  74. fontSize: 12,
  75. color: main_color,
  76. marginRight: 7,
  77. marginLeft: 3
  78. }}
  79. >
  80. {hits_count}
  81. </Text>
  82. <Ionicons
  83. style={{
  84. color: main_color,
  85. fontSize: 14
  86. }}
  87. name={Platform.OS === "ios" ? "ios-text" : "md-text"}
  88. />
  89. style={{
  90. fontSize: 12,
  91. color: main_color,
  92. marginRight: 7,
  93. marginLeft: 3
  94. }}
  95. >
  96. {rating}
  97. </Text>
  98. <Ionicons
  99. style={{
  100. color: main_color,
  101. fontSize: 14
  102. }}
  103. name={Platform.OS === "ios" ? "ios-heart" : "md-heart"}
  104. />
  105. style={{
  106. fontSize: 12,
  107. color: main_color,
  108. marginRight: 7,
  109. marginLeft: 3
  110. }}
  111. >
  112. {comments}
  113. </Text>
  114. </View>
  115. </View>
  116. </View>
  117. </View>
  118. </TouchableOpacity>
Вот таким образом задан шаблон для элемента списка объявлений.
Разметка очень напоминает HTML. Тег View - аналог тега div, стили так же CSS подобные - практически все те же свойства, но в кэмелКейс стиле.
На стороне приложения этот код парится и переводится в реальные объекты.

TouchableOpacity - это тег, который вешает слушатель нажатия на элемент списка, поэтому если речь о шаблоне для списка, то в данной реализации он обязателен. myHandler - это функция на стороне приложения, которая вызывается по нажатию на элемент (она статично прописана в приложении) и позволяет перейти на страницу объекта.
Редактировалось: 2 раз (Последний: 1 февраля 2020 в 06:55)
Игорь Дмитриевич =)
Посетитель
small user social cms
Медаль
Сообщений: 180
GoodMade:
Vunderkind, а почему например не карусель виджетов?
Можно и в ЛС но лучше в теме форума обсудить )

Сделать на самом деле можно, только нужно видеть, что мы хотим получить в конечном результате. Я пока не могу представить карусель виджетов scratch
Покажите на примере - может где-то такая карусель в моб. версии реализована?
Игорь Дмитриевич =)
В начало страницы
Предыдущая темаСледующая тема Перейти на форум:
Быстрый ответ
Чтобы писать на форуме, зарегистрируйтесь или авторизуйтесь.