Разработка для мобильных устройств, планшетов и компьютеров одновременно

Когда вы начинаете создавать мобильное приложение для каждой крупной платформы, вы быстро понимаете, что это невероятная задача со многими языками и инструментами для изучения в процессе. За последние несколько лет появилось несколько продуктов, которые дают вам свободу заботиться только об одном языке и наборе инструментов, а мечта о том, чтобы они позаботились обо всем остальном. Работает ли этот тип подхода? DXTREME неплохо справляется с ответом на этот вопрос. Да.

Недавний продукт, с которым я играл, называется  DXTREME  от DevExpress. Он стоит 899 долларов США и позволяет создавать гибридные приложения для iOS, Android, Windows 8 и Интернета в одном наборе инструментов с единой кодовой базой. Хотя это не обязательно что-то новое, DevExpress делает нечто большее, чем просто кросс-компиляция, развивая ее, дополняя дизайн своего приложения, так что вы можете создавать нативно  выглядящие приложения для каждой платформы, не выполняя такой большой работы. Одна кодовая база, но ваше приложение для iOS выглядит как интерфейс с сенсорным экраном какао, а ваше приложение для Android соответствует аналогичным моделям проектирования современных современных устройств droid.

Разработка для Интернета, когда она не разрабатывается для Интернета.

Когда я впервые отправился в кроссплатформенное приключение, я много читал об инструменте DXTREME от DevExpress. Вскоре я понял, что это действительно пакет инструментов и инструментов для написания мобильных приложений, обернувшись вокруг  Apache Cordova (PhoneGap) , а затем добавив поддержку Visual Studio для сборки, дизайна и эмуляции. И это  хорошо . PhoneGap существует уже довольно много времени. Он стабильный и принят как надежное решение для мобильной разработки. Чего  крайне не хватало На сегодняшний день PhoneGap для Windows заключается в том, что для него не было хорошей поддержки IDE — и именно здесь DXTREME выбивает его из парка. Настолько, что даже если бы он больше ничего не делал, я бы купил его только для этого: он добавляет поддержку PhoneGap в Visual Studio, в том числе при использовании функций Visual Studio Designer и Script Debugging.

Поскольку приложения, создаваемые DXTREME, являются действительно гибридными приложениями HTML и JavaScript, по сути, вы пишете одностраничное приложение HTML / JavaScript (SPA). Я бы рискнул предположить, что эти два языка являются самыми известными в мире, что позволяет разработчикам всех уровней квалификации легко приступить к разработке приложений. Как Microsoft сделала с ASP.Net MVC, DevExpress также использовал технологию, которая уже широко распространена в вашем наборе инструментов веб-разработки, при этом приложения, созданные DXTREME, используют ряд распространенных JavaScript-фреймворков, таких как jQuery, Knockout и jQuery Globalize.

Еще одна область, где DXTREME перестает быть просто PhoneGap, — это, где, как я упоминал выше, он добавляет массу пользовательских CSS и JavaScript-магии, чтобы страницы просмотра вашего приложения выглядели  платформенно,  чтобы ваши пользователи никогда не знали, что вы этого не делали. написать отдельные приложения для каждой платформы. Он делает все это, не поднимая палец — сам по себе это очень изящный трюк.

Пример страницы и ее код:

<div data-dx-role="view" data-dx-name="Index" data-dx-title="Home">
    <div data-dx-target-placeholder="content">
        <p style="padding: 5px;">
            My First DXTREME mobile app.       
        </p>
        <p style="padding: 5px;">
            Cross device development is off-the-chain!
        </p>
    </div>
</div>

Как это выглядит при экспорте в iPhone, iPad, Android Phone и Microsoft Surface. Обратите внимание на внешний вид платформы .

На вершине кросс устройства конструктивные особенности. Встроенный эмулятор Visual Studio, созданный на предыдущих экранах, поддерживает впечатляющий список устройств, которые помогут вам лучше понять, как будет выглядеть ваше приложение:

• Ай фон 4
• iPhone 5
• IPad
• Ipad мини
• iPad 3
• Галактика Нексус
• Galaxy Tab
• Нексус 7
• MS Surface

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

Привет мир.

Посмотрите, когда вы впервые запускаете Visual Studio после установки DXTREME, если вы собираетесь создать новый проект, вас встречают несколько новых шаблонов проектов:

Первые два являются кроссплатформенными приложениями, первое из которых представляет собой базовый шаблон с одним проектом, который кросс-компилируется на несколько устройств, а второе — это шаблон, который помогает вам создавать приложения на основе модели домена OData с удаленного (или локального) веб-сервис.

Это интересный выбор подхода для источника данных скаффолдинга, и когда я впервые поиграл с ним, я протестировал  общедоступные источники OData Stack Exchange, так  как в моем списке быстрого набора не было сервисов OData. Хотя я понимаю, что OData — отличный способ подключить доступный через Интернет источник данных, тот факт, что нет другого источника данных, поддерживаемого инструментом скаффолдинга, выглядит немного ограничивающим, особенно если вам требуется какая-либо более продвинутая поддержка аутентификации для ваши удаленные данные.

Вторые два шаблона на самом деле являются решением вышеупомянутого недостатка, заключающегося в том, что они создают шаблоны проектов для веб-служб WCF, которые позволяют вам предоставлять OData. Сами эти шаблоны создаются из источника данных Entity Framework. Это означает, что даже если у вас сегодня нет службы OData, инструментальные средства стараются изо всех сил, чтобы убедиться, что это не слишком замедляет работу.

Получение ответов

Когда вы изучаете какой-либо новый инструмент или фреймворк, я часто немного волнуюсь, когда речь заходит о том, как быстро вы можете приступить к написанию кода приложения. В то время как DXTREME неплохо начал с того факта, что они используют HTML и JavaScript для своей языковой поддержки, автоматические магические компоненты CSS и JavaScript между устройствами все еще являются новыми для меня. Меня беспокоило, что я буду тратить время на изучение (стучать головой о стену?) Абстракции, когда я действительно смогу научиться реальному, проводя время с помощью Objective-C или Java — но мне повезло, потому что Немного официальной  документации  для своих элементов.

Остальные используемые компоненты находятся в исходном состоянии. JQuery — реальная вещь, использование привязки Knockout для модели MVVM также точно так же, как можно загрузить с их  сайта . Вы также можете обновить эти файлы вне диапазона, загрузив их последние версии, хотя одной из пропущенных функций была возможность использовать Nuget для добавления Knockout и jQuery в качестве пакетов для простого обновления (Visual Studio не позволяла мне открывать менеджер пакетов для типа проекта DXTREME) — надеюсь, они добавят эту поддержку в более позднюю версию.

Есть публикации с документацией и примеры использования jQuery и Knockout буквально повсюду в Интернете; Это был большой шаг в выборе использования общих структур.

То же самое относится и к любым аппаратным вызовам конкретного устройства, поскольку они выполняются оболочкой PhoneGap / Apache Cordova, поэтому документацию также можно легко найти  повсюду .

Аппаратное взаимодействие

Современные смартфоны часто требуют, чтобы вы были немного ближе к металлу, когда вы планируете писать код, который взаимодействует с оборудованием на устройстве. Возможно, вы хотите использовать камеру устройства, чтобы сделать снимок, или попросить службы определения местоположения на устройстве указать ваши текущие координаты GPS. Как вы делаете это, когда вы просто пишете HTML-приложение? HTML и JavaScript пока не поддерживают аппаратное взаимодействие на этом уровне, а API-интерфейсы для конкретных устройств для iPhone, Android и Surface отличаются, так как же приложение DXTREME позволяет вам делать фотографии?

К счастью, тяжелая работа проделывается в другом месте благодаря инфраструктуре PhoneGap, которая уже давно поддерживает это:

function takePhoto() {
    navigator.camera.getPicture(onSuccess, onFail, { quality: 50 });
}

function onSuccess(imageData) {
    var image = document.getElementById('photo');
    image.src = "data:image/jpeg;base64," + imageData;
}

function onFail(message) {
    alert('Failed because: ' + message);
}

О локальном хранилище заботится аналогичное расширенное соединение JavaScript с технологией баз данных SQLite, которая выполняет только слегка урезанную  спецификацию SQLite SQL :

var db = window.openDatabase("Database", "1.0", "My App", 200000);
function queryDB(tx) {
    db.executeSql('SELECT * FROM MYCONTACTSTABLE', [], querySuccess, errorCB);
}

function querySuccess(tx, results) {
    alert("Contacts found in DB: " + results.rows.length);
}

Из всех аппаратных устройств, которые DXTREME поддерживает посредством использования PhoneGap, единственное, что немного подводит это, — поддержка этих технологий в эмуляторе. Было бы замечательно, чтобы в эмуляторе поддерживалась каждая аппаратная оболочка устройства, чтобы упростить тестирование и отладку без развертывания на устройстве. Будучи JavaScript, он может быть легко загружен для тестирования.

Squashing Bugs

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

Отладка приложения DXTREME работает очень похоже на обычное одностраничное приложение, которое вы разрабатываете для Интернета. Вы запускаете свое приложение в Visual Studio, которое запускает ваш любимый браузер, но вместо того, чтобы смотреть на ваше приложение напрямую, оно дает вам очень крутой абстрагированный вид эмулятора, который позволяет переключаться между устройствами (и, следовательно, гибридными представлениями DXTREME):

Навигация по вашему приложению и отладка его JavaScript работает так же, как если бы вы отлаживали приложение JavaScript. Поскольку я использую комбинацию инструментов отладки Firefox или Chrome, это прекрасно работает для меня, но если вы используете Internet Explorer, это означает, что у вас есть полная поддержка  отладки скриптов Visual Studio .

Еще одна интересная вещь, которую стоит отметить, если вы посмотрите на мои снимки экрана, вы увидите QR-код в эмуляторе (внизу слева):

Если вы отсканируете это на своем устройстве, вы сможете играть с приложением, используя удобную технологию обратного прокси, которая направляет запросы в вашу локальную среду IDE / dev через веб-сайт DevExpress, и хотя вы не можете протестировать определенные функции устройства, такие как камера и сервисы определения местоположения, таким образом, если вы загрузите  приложение iPhone «Courier»  из DevExpress, вы можете таким же образом протестировать всю эту встроенную функциональность, отсканировав QR-код (очевидно, приложение для Android уже скоро в разработке, нет слов о Surface или поддержка Windows Phone пока).

Получение его на устройстве

После того как вы разработали свое приложение, избавились от ошибок и готовы на самом деле попробовать свое приложение на устройстве, DXTREME также, кажется, покрывает вас пакетом интегрированного приложения, встроенным в Visual Studio. На странице свойств вашего приложения вы можете назначать значки приложений, добавлять свой сертификат подписи Android и профиль публикации iOS и фактически создавать пакет iOS IPA или Android APK.

Это сдуло меня. Раньше я не знал, что существует какой-либо способ создания приложений для iOS  на Windows . К сожалению, вы все еще не можете на самом деле протестировать публикацию своего приложения на устройстве iOS без Mac, но, как и во многих традициях разработки Apple, это обусловлено Apple, а не недостатком DXTREME.

Кроме того, поскольку вы действительно разрабатываете приложение, которое расположено поверх PhoneGap, вы также можете использовать такой сервис, как PhoneGap Build,  чтобы избавить вас  от хлопот, связанных с комплектацией вашего приложения. Для Android это может быть удобно: PhoneGap Build позволяет загрузить приложение на ваше устройство из Интернета, как только оно будет готово ».

В конце концов

Если бы я завтра придумал свой собственный кроссплатформенный инструмент разработки, он не был бы столь же хорошим или многофункциональным, как продукт, который DevExpress создал в DXTREME. Продуманный способ, которым фреймворк был спроектирован для использования общих языков и фреймворков JS, позволяет легко его освоить, а сама по себе тяжелая интеграция с Visual Studio делает его стоящим на покупке, чтобы помочь ускорить любую текущую разработку PhoneGap, которой вы могли бы быть делает.

При разработке кроссплатформенных приложений при изучении гибридной среды разработки возникают вопросы: действительно ли этот подход работает? Это на  самом деле  делает вас более продуктивным? Стоит ли изучать родной язык? Проведя несколько недель с DXTREME, я твердо верю, что  мой ответ  на эти вопросы — решительное «Да». Поскольку вы можете попробовать это сами, почему бы не проверить  бесплатную пробную версию ?