Сервис для
сео - оптимизаторов

Найди ошибки на сайте
Ошибки мешают продвижению сайта
Исправь ошибки на сайте
Сайт без ошибок продвигать легче
Получи новых клиентов
Новые клиенты принесут больше прибыль

Стратегия WebView для разработки под iOS и Android

  1. ЧАСТЬ 1 ВКЛЮЧАЕТ:
  2. 80% раствор
  3. Стратегия WebView
  4. Где живут ваши веб-файлы?
  5. Механика WebViews (на разных платформах)
  6. Примеры для конкретной платформы
  7. PhoneGap может заполнить остальные 20% (один вариант)
  8. Простой дизайн приложения

ЧАСТЬ 1 ВКЛЮЧАЕТ:   Соревнование   Разработка для Android и iPhone (iOS) - разные звери

ЧАСТЬ 1 ВКЛЮЧАЕТ:

Соревнование

Разработка для Android и iPhone (iOS) - разные звери. Например, если вы создаете приложение для Android, вы должны переписать его как порт для iPhone. Вся эта тяжелая работа х2. Это не идеально, но мы делаем то, что должны, чтобы обойти ограничения, налагаемые на то, что мы можем развивать.

80% раствор

Тем не менее, есть надежда. Существует способ повторно использовать 80% кода нашего приложения для ОБА разработки под iOS и Android. Стратегия для этого состоит в том, чтобы написать свое приложение, используя веб-технологии: CSS, HTML и JavaScript, а затем настроить WebView (контейнер для веб-страниц) в своем родном приложении телефона для отображения страниц приложения (сохранение пользовательских настроек, динамического содержимого, графика и т.д…). HTML5, CSS и JavaScript должно быть достаточно для выполнения всех этих вещей ВНУТРИ WebView любого устройства, поддерживающего WebView.

Стратегия WebView

Приложение WebView состоит в основном из файлов Javascript, CSS и HTML. По сути, ваше приложение представляет собой одну или несколько веб-страниц. Эти веб-страницы составляют ваш интерфейс веб-интерфейса. « WebView » - это окно, через которое ваше устройство отображает эти веб-страницы.

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

Механически ваше приложение представляет собой набор веб-страниц. Однако, с эстетической точки зрения, это нормальное приложение. Это стратегия WebView.

Где живут ваши веб-файлы?

С помощью стратегии WebView вы можете хранить большую часть кода вашего приложения на устройстве ИЛИ вы можете просто разместить свой код на странице веб-сайта. В любом случае, существуют преимущества и недостатки обоих хранилищ. Выберите, где хранить файлы кода вашего приложения, исходя из ваших уникальных потребностей. Этот пост в равной степени относится к обоим методам, поэтому, что бы вы ни выбрали, эта статья по-прежнему относится к вам:

Веб-приложение в комплекте с приложением для телефона:

Основные преимущества:

  • Работает в автономном режиме . Для устройств, обращающихся к приложению, не требуется подключение к Интернету, если только часть содержимого вашего приложения не зависит от внешних данных.
  • Время начальной загрузки . Приложение загружается локально на устройстве, поэтому теоретически время начальной загрузки должно быть быстрее.

Основные недостатки:

  • Развертывание обновлений . Любые изменения в коде приложения должны быть развернуты в магазине приложений, где размещено ваше приложение (до того, как обновление сможет распространиться на пользовательские устройства).
  • Размер приложения . Ваше приложение должно содержать больше локального кода / данных на устройстве. Таким образом, распределенное приложение будет большего размера.

Таким образом, распределенное приложение будет большего размера

Веб-приложение хранится в центральном месте:

Основные преимущества:

  • Развертывание обновлений . Любое обновление, внесенное вами в ваш централизованный код, немедленно вступит в силу на всех устройствах, которые обращаются к этому централизованному коду. Пользователям даже не нужно обновлять ваше приложение, чтобы ваши изменения вступили в силу.
  • Размер приложения . Поскольку большая часть вашего кода хранится в одном месте, загружаемое приложение очень легкое. Телефоны, которые запускают приложение, не должны хранить очень много файлов или данных.

Основные недостатки:

  • Требуется онлайн . Для доступа к приложению требуется подключение к интернету. Если устройство пытается использовать ваше приложение, например, в режиме полета, то пользователь должен получить сообщение «Нет соединения».
  • Время начальной загрузки . Устройства получают доступ к вашей кодовой базе удаленно. Это может добавить дополнительное время фронтальной загрузки.
    Скорость фронтальной загрузки будет зависеть от качества подключения пользователя к интернету.

Отказ от ответственности: этот список плюсов и минусов не все включено. Например, вы должны также подумать о том, что должно произойти, если ваш централизованный хост выходит из строя. Вместо того, чтобы устройства пытались получить доступ к сломанному серверу, вы можете разработать процедуру резервного копирования, при которой устройства будут использовать локально кэшированные данные. Но такие дополнительные соображения выходят за рамки данной статьи. Давайте пока все упростим. Где должно жить ваше приложение? Это зависит от вас.

Механика WebViews (на разных платформах)

Остальные 20%

Да, WebView - это окно, через которое пользователи получают доступ к большей части вашего приложения. Большая часть вашего приложения может быть написана на не зависящем от устройства Javascript, CSS и HTML. Однако для корректной работы WebView вам потребуется реализовать некоторый код для конкретного устройства: например, IOS WebView отличаются от Android WebView, поэтому вам нужно написать код для каждого отдельного типа WebView.

  • Устройства Android используют класс «WebView» . Связанный код написан на Java .
  • Устройства IOS используют класс «UIWebView» . Связанный код написан на Objective-C .

Если вы планируете писать свое приложение для ОБА платформ, вам придется работать с уникальной механикой WebView в двух разных « мирах ».

Примеры для конкретной платформы

Какая механика вашего приложения не может быть написана на веб-языках, таких как Javascript, HTML и CSS? Вот некоторые из механизмов, с которыми мне пришлось столкнуться (для каждой платформы) при создании двухплатформенного приложения WebView.

Примечание: 80% против 20% - это очень грубые приближения для отношения WebView к времени разработки для конкретной платформы. Проценты могут варьироваться для разных проектов и в зависимости от того, что вы хотели бы достичь.

Это некоторые примеры соображений развития, которые могут составлять оставшиеся 20% развития; вещи, которые Javascript, HTML и CSS могут не обрабатывать в приложении.
Только специфичный для платформы код может справиться с этими вещами:

Это работа для Objective-C, IOS / Java, Android ...

  • Приложение запускается . Вам нужен код, чтобы сообщить приложению, что делать при запуске. Есть ли заставка? Какой URL откроет ваш WebView? Вам нужно будет отображать значок загрузки, пока URL-адрес полностью не загрузится внутри вашего WebView?
  • Строки заголовка . По умолчанию ваше приложение может отображать строку заголовка. Но если вы используете стратегию WebView, вы можете написать код платформы, чтобы скрыть строку заголовка. Строка заголовка может быть написана внутри WebView с использованием HTML и CSS.
  • Кнопка Назад . В Android вам, возможно, придется написать немного Java, чтобы сообщить WebView, как обрабатывать нажатия кнопок назад. В противном случае поведение кнопки «Назад» по умолчанию может просто закрыть ваше приложение вместо перехода к предыдущему виду.
  • Удалить почтовый бокс . iPhone может «почтовый ящик» вашего приложения ... пока вы не добавите заставку. Приложение смотрит на изображение заставки, чтобы определить размеры приложения (без буквенного бокса).
  • Ориентация меняется . На Android ваш WebView может перезагрузиться при изменении ориентации. В большинстве случаев вы хотите предотвратить это, написав собственный код Java.
  • Внешние ссылки . Есть ли в вашем приложении внешние ссылки? Когда пользователь нажимает один, что должно произойти? Должно ли оно открывать отдельное приложение для браузера или внешняя ссылка должна отображаться внутри вашего приложения?
  • Нет подключения к интернету . Если ваш WebView соединяется с внешним хостом, что произойдет, если устройство НЕ подключится, когда пользователь откроет приложение? Возможно, вам придется написать немного дополнительного кода, чтобы обнаружить эту ошибку и отобразить сообщение.

Это лишь некоторые из соображений, которые вам, возможно, придется принять вне рамок мира WebView; Не все механические требования могут быть решены с помощью Javascript, HTML или CSS внутри вашего WebView.

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

PhoneGap может заполнить остальные 20% (один вариант)

Если вы НЕ заинтересованы в том, чтобы тратить время на настройку WebView на двух разных платформах, вам следует проверить PhoneGap как ярлык.

PhoneGap постарается свести к минимуму объем кода, специфичного для платформы, который вы должны написать, предоставив предварительно упакованные «шаблоны». PhoneGap предназначен для обработки механики вашего WebView на разных платформах. Вы можете сосредоточиться на разработке веб-контента, чтобы заполнить предварительно написанный WebView PhoneGap.

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

Если вы новичок в разработке приложений и никогда не использовали PhoneGap, я рекомендую сначала изучить ios / android development.

Без адекватного понимания то, что должно облегчить жизнь, только усложнит ее.

PhoneGap отлично, если используется хорошо. Однако, если вы пытаетесь использовать его, потому что вы хотите получить ярлык от изучения чего-то нового, то вам, скорее всего, придется потратить много времени на изучение PhoneGap. Затем, в любом случае, вам также придется научиться разрабатывать приложения (при разработке чего-то, что PhoneGap не делает «из коробки»).

Легенды говорят, что команда «легкая кнопка» существует для каждого языка. Его функциональность такова: все, что вы хотите, произойдет, если это будет детализировано одним или несколькими расплывчатыми предложениями. Вот пример:

ipconfig //: easy button :: "Создайте приложение или что-то в этом роде. Если вам нужно что-то добавить в птичку. Пипз, как они, в какую-то птичку апц. Бросьте tha dollah $ -dollah $"

До открытия команды «легкая кнопка» люди однажды прибегали к тому, чтобы тратить время и силы на вещи.

Простой дизайн приложения

Хватит со стратегией. Давайте предложим простое приложение WebView для предоставления контекста.

Наше приложение может иметь сотни разных «экранов». Тем не менее, есть только две разные WebViews. WebView 1 отображает весь НАШ контент. Все наше приложение отображается через этот основной WebView 1. В качестве альтернативы, WebView 2 будет отображать любой внешний контент, который мы хотим « встроить » в наше приложение. Например, если мы хотим включить внешнюю ссылку на что-либо, мы будем использовать WebView 2 для отображения внешнего контента.

  • Экран загрузки (WebView 1) Даже если ваши веб-файлы размещены локально на устройстве, будет период времени, когда первый WebView должен загрузить домашний экран. В течение этого времени отображайте какой-то индикатор загрузки вместо белого экрана. Код нативного устройства должен обрабатывать
    этот индикатор загрузки, поскольку ваши веб-файлы еще не загружены полностью.
  • Ошибка подключения к Интернету (WebView 1) Если ваши веб-файлы размещены вне вашего приложения, вам нужно будет отобразить сообщение об ошибке, когда ваше приложение не сможет получить доступ к этим внешним файлам. Например, если пользователь находится в режиме полета, собственный код устройства должен отобразить это сообщение, если WebView не может загрузить ваши веб-файлы.
  • Главный экран (WebView 1) Первый правильный экран, который появляется после завершения загрузки приложения.
    Этот экран сделан из коллекции файлов Javascript, HTML и CSS (вместо того, чтобы использовать собственный код устройства для генерации этого контента).
  • Подстраница (WebView 1) Как и домашний экран, подстраницы состоят из HTML, CSS и Javascript. Нет необходимости привлекать собственный код устройства к созданию такого контента.
  • Внешняя страница (WebView 2) Что если ваше приложение содержит ссылку на внешнюю веб-страницу? Когда пользователь нажимает на эту ссылку, вы хотите, чтобы пользователь видел внешний контент БЕЗ выхода из вашего приложения. Для этого у вас может быть второй WebView, который открывает внешний URL.

Мы рассмотрели стратегию приложения и базовый план дизайна для простого приложения. Далее, давайте обсудим реальный, специфичный для устройства код (Android / iOS), который вы можете использовать, чтобы действительно сделать это удивительное приложение…

Конец на данный момент ...

Похожие

Как запустить Linux на Android
... для Android. Его можно бесплатно загрузить и использовать как в коммерческих, так и в некоммерческих целях. прерогативы: Android телефон / планшет Limbo PC Emulator DSL Linux OS Следуйте приведенным ниже инструкциям, чтобы запустить небольшую ОС Linux на своем планшете. Здесь мы пытаемся запустить DSL Linux OS, но вы также можете запустить другую легкую ОС Linux. Windows XP и более новая версия Ubuntu и все другие
Любой, кто хорошо меня знает, знает, что я люблю монополию. Я также довольно безжалостный бизнесмен, ког...
Любой, кто хорошо меня знает, знает, что я люблю монополию. Я также довольно безжалостный бизнесмен, когда играю, с небольшим сочувствием к моим коллегам-игрокам. Поэтому, когда я услышал, что новая версия
Обзор Nokia Lumia 530: наш обзор
Lumia 530 является частью категории смартфонов начального уровня, которые люди выбирают по цене, а не по производительности. Его технические характеристики как раз достаточны для выполнения основных функций для досуга и социальных сетей. Он ограничен сотовой связью 3G +. 5-мегапиксельная камера с фиксированным фокусом без вспышки не позволяет делать крупные планы, а ввод текста на диагонали экрана 4 дюйма является трудоемким. Однако четырехъядерный процессор не лишен недостатков. Это
2D-освещение в реальном времени в GameMaker Studio 2 - Часть 2
Технология В последний пост Я показал вам, как создать основы 2D-системы освещения, поэтому в этом примере я хочу продолжить текущий пример и сделать его больше похожим на реальный точечный источник света. Мы также представим небольшое использование шейдеров, чтобы немного упростить процесс - да, шейдеры могут быть простыми! - а затем
Android Google Map - рисование маршрута между двумя точками - JournalDev
В этом уроке мы создадим приложение для Android, которое нарисует возможный маршрут карты Google между двумя точками. Мы будем использовать API Карт Google в нашем приложении. Создайте новый ключ API Google Map из консоли API, выполнив действия, описанные в этот руководство. Создайте новый проект Android Studio и выберите шаблон в качестве Google Maps Activity . Добавьте ключ API
Один год бесплатного регистрационного ключа для McAfee VirusScan Plus
... для получения полнофункционального подлинного серийного ключа для последней версии пакета защиты от вредоносных программ McAfee Virus Plus, есть еще один бесплатный купон, позволяющий вам пользоваться годичным доступом к McAfee® VirusScan Plus"> McAfee VirusScan Plus является одним из ведущих программ безопасности, доступных сегодня, мы поделились
Несколько доменов на одном хостинге
Несколько доменов на одном хостинге Если вы хотите запустить несколько сайтов на разных доменах с одного хостинга , вы можете использовать его псевдонимы , В этом случае вы вы покупаете хостинг один домен и другой домен только у нас арена , Вы будете настраивать отдельные сайты
Обзор Doogee X6 Pro - экран, дизайн, аккумулятор и технические характеристики.
Может ли недавно выпущенный Doogee X6 Pro противостоять своему чрезвычайно популярному младшему брату X5 Pro? Маловероятно, что вы слышали о Дуги раньше, но они прилагают все усилия, чтобы изменить это. В последнее время эта тяжелая работа окупилась с Doogee X5, превратившимся в 100 самых продаваемых смартфонов Amazon. Doogee (дочерняя компания KVD International Group в Китае) производит бюджетные смартфоны с 2013 года, уделяя особое внимание созданию доступных, но качественных
Польша их ограничила. Сейчас они выпускают приложение и собираются на миллион пользователей.
BitBay является одной из крупнейших криптовалютных бирж в мире. До недавнего времени он действовал из Польши, но теперь хвалит переезд на Мальту. Недавно BitBay выпустила мобильное приложение для iOS и Android. BitBay в настоящее время является крупнейшей фондовой биржей в нашем регионе Центральной и Восточной Европы. Имеет 800 тысяч пользователи, которые совершают 4 миллиона транзакций в год. Компания рассчитывает превысить порог
Как использовать Android без Google: все, что вам нужно знать
Реклама За последние несколько лет я сильно изменил способ использования телефона. Я решил использовать Android без Google. Могу ли я использовать Android без учетной записи Google? Как оказалось, отказ от Google возможен, и опыт не так плох, как вы думаете. Это взгляд на то, что я все еще могу сделать на Android, не полагаясь ни на какие сервисы Google, включая Сервисы Google Play, и от чего мне пришлось отказаться. Во-первых, зачем использовать
Smart Display UI от Google - взгляд на голосо-ориентированную эволюцию Android в Fuchsia
... для Google Assistant прибыл. Совместными усилиями Google и Lenovo, он запускает новую волну ориентированных на экран интеллектуальных колонок, которые хорошо смотрятся на прилавке, хорошо звучат при воспроизведении музыки и делают Эхо Шоу менее хорошо по сравнению. Но лучшая часть Lenovo Smart Display - это не промышленный дизайн или 10-дюймовый Full HD дисплей. Это интерфейс

Комментарии

Почему тогда только один браузер в Модерне, а все остальные на Рабочем столе?
Почему тогда только один браузер в Модерне, а все остальные на Рабочем столе? Ответ Microsoft странный. «Создать единый пользовательский интерфейс». Я понятия не имею, что это значит. Этот ответ соответствует проблеме под заголовком «почему я не могу настроить свой браузер для запуска ссылок, нажимаемых на рабочем столе в современном режиме (или наоборот)». Это имеет смысл. Напротив, нажатие на плитку с закрепленным Chrome и наличие другого браузера по умолчанию для его запуска на рабочем
Вы когда-нибудь пытались перенести свои закладки с iPhone на Android?
Вы когда-нибудь пытались перенести свои закладки с iPhone на Android? Вы использовали какой-либо из методов, описанных здесь? Если нет, какой метод вы использовали? Поделитесь своим опытом с нами в поле для комментариев ниже. (с участием Элмер Монтехо )
5. Если по какой-то причине вы были вынуждены выбрать один кодек для вашего видео, какой из них вы должны выбрать?
5. Если по какой-то причине вы были вынуждены выбрать один кодек для вашего видео, какой из них вы должны выбрать? Это зависит. Рассмотрим варианты: H.264 Из трех стандартов H.264 имеет импульс, качество и признание среди профессионалов в области медиа. Он также имеет поддержку огромного консорциума некоторых крупнейших компаний отрасли, включая Microsoft и Apple, через MPEG LA. И в этом заключается главная жалоба его критиков: H.264 не является бесплатным. Для потребителей
Какие приложения вы можете использовать из коробки?
Какие приложения вы можете использовать из коробки? Даже без установки одного приложения наши смартфоны уже способны на многое. Вы можете совершать звонки, отправлять текстовые сообщения, делать фотографии, вести календарь, слушать музыку, решать математические задачи, делать заметки и просматривать веб-страницы без поиска дополнительного программного обеспечения. Это уже больше, чем то, что могут делать телефоны, и давайте будем реальными, миллионы людей все еще носят
Но как вы можете протестировать свою систему во время разработки и избежать проблем при работе и переключении между несколькими устройствами?
Но как вы можете протестировать свою систему во время разработки и избежать проблем при работе и переключении между несколькими устройствами? К счастью, все современные браузеры предлагают инструменты мобильной эмуляции, и один из лучших можно найти в Chrome. Это может помочь выявить ранние проблемы, не выходя из комфорта вашего ПК и среды разработки. Запустите Chrome, перейдите на веб-страницу, которую вы хотите протестировать, и откройте Инструменты разработчика
Может ли недавно выпущенный Doogee X6 Pro противостоять своему чрезвычайно популярному младшему брату X5 Pro?
Может ли недавно выпущенный Doogee X6 Pro противостоять своему чрезвычайно популярному младшему брату X5 Pro? Маловероятно, что вы слышали о Дуги раньше, но они прилагают все усилия, чтобы изменить это. В последнее время эта тяжелая работа окупилась с Doogee X5, превратившимся в 100 самых продаваемых смартфонов Amazon. Doogee (дочерняя компания KVD International Group в Китае) производит бюджетные смартфоны с 2013 года, уделяя особое внимание созданию доступных, но качественных
Что может сделать Google Drive?
Что может сделать Google Drive? Вот основные функции Google Диска для потребителей: Хранение файлов: на диске появляется 15 ГБ бесплатного онлайн-хранилища. Вы можете хранить широкий спектр типов файлов и папок - даже файлы Office. Создание файлов: вы можете создавать документы и файлы на лету с помощью встроенного Документы ,
Может возникнуть вопрос: зачем нужны хэштеги?
Может возникнуть вопрос: зачем нужны хэштеги? Я неправильно использую Twitter, если не пользуюсь ими? И люди ... Прочитайте больше , #instagood #instagood - это широко используемый хэштег, который следует использовать
Почему DSpace в качестве платформы?
Почему DSpace в качестве платформы? Центр информационных технологий исследовал и сравнил имеющиеся программные решения, используемые ведущими академическими учреждениями для централизованного хранения электронных материалов. В результате было определено, что более 70% из них используют один из следующих автоматизированных систем: DSpace, E-prints или Digital Commons (Bepress). Согласно данным Реестр репозиториев открытого доступа (Registry of
Может ли мобильная фотография, сделанная Finns, стать жизнеспособной альтернативой цифровым CD?
Может ли мобильная фотография, сделанная Finns, стать жизнеспособной альтернативой цифровым CD? Конечно, Nokia Lumia 1020, потому что она упоминалась на рынке и в головах потенциальных покупателей, которые сейчас сталкиваются с серьезной дилеммой. Может ли флагман быть жизнеспособной альтернативой специализированному фотографическому оборудованию? Мы приглашаем вас прочитать наш обзор. Технические параметры Двухъядерный процессор Qualcomm Snapdragon S4, оперативная память
5. Может ли ребенок меньшинства быть доверенным лицом для учетной записи?
5. Может ли ребенок меньшинства быть доверенным лицом для учетной записи? Нет, потому что доверенным лицом может быть только физическое лицо с полной дееспособностью. 6. Может ли доверенность предоставляться на совместный счет? Владельцы совместных счетов могут установить доверенность на этот счет при условии, что доверенность установлена ​​на основании инструкций всех совладельцев.

Где живут ваши веб-файлы?
Где должно жить ваше приложение?
Есть ли заставка?
Какой URL откроет ваш WebView?
Вам нужно будет отображать значок загрузки, пока URL-адрес полностью не загрузится внутри вашего WebView?
Есть ли в вашем приложении внешние ссылки?
Когда пользователь нажимает один, что должно произойти?
Должно ли оно открывать отдельное приложение для браузера или внешняя ссылка должна отображаться внутри вашего приложения?
Если ваш WebView соединяется с внешним хостом, что произойдет, если устройство НЕ подключится, когда пользователь откроет приложение?
Может ли недавно выпущенный Doogee X6 Pro противостоять своему чрезвычайно популярному младшему брату X5 Pro?