Как создать свое первое приложение для Windows Phone. Пример разработки на конструкторе Microsoft App Studio.

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

Это такой тип приложений, которые можно реализовать при помощи javascript-кода в браузере, или при помощи конструктора Access, и поэтому для разработки подобных мобильных или настольных приложений вам вовсе не обязательно обзаводиться полноценным набором инструментов. Пришло новое поколение конструкторов приложений, веб-сервисов, которые позволяют вам создавать и запускать собственные приложения.

Недавно компания Microsoft запустила собственную студию для создания приложений — Windows Phone App Studio. Это простой инструмент, который позволит вам создавать работающие приложения с нуля. Например, на разработку простого приложения о котором идет речь в статье, вам потребуется менее 15 минут, так как в данном конструкторе представлены стандартные шаблоны. Конечно, мы сейчас не говорим о разработке сложных программ или игр, но для начала этой статьи вам будет достаточно.

Как только вы будете авторизованы, Microsoft предложит вам выбор шаблонов, с которых можно начать, либо вы можете начать разработку приложения с нуля. Смело выбирайте App Studio, как это показано на скриншоте ниже:

Подобно приложениям Access, программы созданные при помощи Windows Phone App Studio используют подключения к данным, то есть они построены по модели просмотра master/detail. Вы можете подключить фид контента (будь то RSS, Youtube и т.п.), либо использовать его для публикации собственного контента. Конечно же, приложение способно и на то, и на другое одновременно. Кроме фидов, у вас также будет возможность размещать собственный контент, будь то скомпилированные в код HTML-страницы, или страницы, организованные при помощи простых баз данных, которые Microsoft называет “collections”.

1. На первом шаге, вам нужно определиться с содержимым вашего приложения, вы можете отредактировать или удалить те страницы и элементы, которые стоят по умолчанию.

Поскольку, нашей целью, является предоставление возможности нашим читателям ленту публикаций great-world.ru и удобно читать свежие статьи. мы привязали наше тестовое приложение к RSS-фиду great-world. Все, что нам нужно, это URL фида, и конструктор автоматически создаст окно просмотра, на котором отображается список свежих статей, а также второе окно просмотра с отображением подробной информации о статьях.

Однако стоит отметить, что процесс создания собственного приложения не такой уж и простой, так как RSS-парсер, используемый в App Studio, иногда не справляется с форматированием RSS-лент, генерируемых сайтом. То есть, иногда это может стать реальной проблемой, потому что текст статьи просто не будет отображаться, и при этом возможность отладки будет сильно ограничена, как в случае с любыми облачными инструментами разработки.

2. Далее, мы сразу перешли ко второму шагу — настойки внешнего вида. Здесь, можно выбрать цветовую гамму шрифтов и общий стиль отображения содержимого.

3. Теперь, нужно будет задать название, описание, а также выставить логотип размером 160х160 пикселей.

4. Ну и завершающая стадия — генерация и публикация приложения. Вот, что получилось у нас:

На финише, доступен предосмотр созданного приложения, можете проверить как оно будет работать на смартфоне или планшете. Если все хорошо, нажимайте кнопку «Generate», появляется всплывающее окно:

Два варианта на выбор, первый — сгенерировать приложение для мобильных устройств, второй — для планшетов и обычных ПК. Сервис тратит на генерацию менее 10 минут, поэтому вы можете по очереди сделать продукт под каждую платформу. Процесс установки очень прост благодаря встроенной поддержке QR-кодов в Windows Phone. Для начала, вам нужно установить сертификат на телефон, и реализуется это посредством QR-кода, который позволено скачивать сертификат прямо на телефон.

• Чтобы выложить получившееся чудо в Windows Phone Store т.е. в магазин приложений, чтобы его мог скачать любой желающий, а не только вы, необходим сертификат разработчика. Стоит он около 600 рублей.

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

Это одна из веских причин, из-за которых Microsoft позволяет вам скачивать исходный код, который подготовлен к работе в Visual Studio. Он будет укомплектован в проект Visual Studio, и его можно будет импортировать напрямую в настольный IDE, а затем провести работу над ошибками. Отладка приложения при помощи любимого симулятора устройств поможет вам быстро выявить проблему – вставленное в начало статьи изображение было удалено на сервере. Можно быстро изменить код, и приложение снова заработает.

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

Относительно создания подобных приложений очевидно лишь одно: они не предназначены для создания комплексных приложений. Они похожи на пластиковые игрушки для детей: все перед нами, и нам остается лишь сложить что-то со смыслом. По мере накопления опыта за счет подобных «игровых» площадок, вы можете постепенно переходить к оформлению кода, и использовать его для создания более сложных вещей. При помощи наборов инструментов типа Windows Phone App Studio, вы можете получать определенный опыт работы с приложениями, основанными на контенте, с RSS-фидами, веб-контентом и локальным контентом.

Конечно, этот набор вряд ли представляет все, что вам потребуется для создания коммерческого приложения, вне зависимости от того, насколько простым оно должно быть. Но дело не в этом, так как генерируемый код дает вам основу, с которой вы можете работать, а также возможность понять, как устроен процесс создания приложения. Одно можно скачать точно: если вы планируете начать разрабатывать собственные приложения, то это отличная точка для старта. Читайте далее: сколько стоит разработать мобильное приложение и как на нем заработать?

Windows Phone 8: Создаем приложение. Матрица. Часть 1

Создавая приложение на конкурс появилась так же идея поделиться процессом его создания, так как сам столкнулся с трудностями нахождения информации по созданию приложений для Windows Phone 8. Почему «Матрица»? Потому, что еще с выхода фильма она меня завораживала. Потом нашел заставку на экран. Мог часами смотреть на нее. А теперь решил уже перенести ее на телефон, что б всегда была под рукой. И так начнем.

Принт скрин с экрана Lumia 520

Года 2 назад я уже создавал нечто похожее, но на JQuery. Однако тогда все получилось, кроме полноценности: максимальный размер матрицы, при котором она не «тормозила» составлял приблизительно 15 Х 20 клеточек, что явно мало для современных FULL HD мониторов. При выяснении причин такого поведения выяснил, что оно все грузило только 1 ядро и как я тогда понял, только в 1 потоке (могу ошибаться, но больше на эту тему разбора полетов не устраивал). Да и создавал только с целью освоиться в этом JS фреймворке. C# лишен этих недостатков, да и мощности современных смартфонов должно хватить для обработки большого количество элементов и множества случайных чисел на каждый такой элемент. Забегая наперед, скажу что при тестировании на моей слабенькой Lumia 520 все мои надежды оправдались.

Для начала определим, что именно хотим создать

1. Сетка ячеек, в которой случайным образом выбираются координаты начала змейки
2. Змейки будут разной случайной длины
3. В каждой ячейке змейки элементы меняются случайным образом случайное количество раз
4. Присутствует эффект затухания цвета. Яркость каждой составляющей змейки зависит от ее длины

Что использовал для создания приложения

• Windows 8 Pro x64 (RU)
• VS 2012 SP1 (RU)
• Windows Phone SDK 8.0 (RU)
• Только стандартные элементы, входящие в VS
• Тестировал на эмуляторе с настройками WVGA 512 MB (RU)

Пару слов про тестирование. На эмуляторе результаты не сильно правдоподобны. При запуске большого количества змеек он показывал больше FPS чем на реальном телефоне. При отладке на телефоне — телефон тормозит ужасно. Однако после остановки отладки и простого запуска приложения производительность была адекватная.

Перейдем к работе в Visual Studio

Создаем проект: Шаблоны — Visual C# — Windows Phone — Приложение Windows Phone.
Выбираем .NET Framework 4.5.
Имя проекта у меня SE_Matrix_2d_v_1. Оно же будет и namespace.
Выбираем Windows Phone OS 8.0.

MainPage.xaml

Теперь отредактируем XAML код. Нам нужен будет только Grid с именем LayoutRoot и событие нажатия(Tap) Event_Grid_Tap_LayoutRoot, в который динамически, в зависимости от расширения экрана будем вписывать нужное количество ячеек TextBlock. Смотрим:

Запускаем эмулятор. Должен быть просто черный экран.

MainPage.xaml.cs

Сразу подключаем необходимые библиотеки:

В конструкторе вызовем метод CreateElement, который с создаст матрицу элементов, в которой и будут проходить все дальнейшие действия:

Для того, что б создать матрицу, нужно определить расширение экрана. Добавим в класс MainPage свойства ScreenWidth и ScreenHeight:

Приступим к созданию метода CreateElement.
В первую очередь нужно определить количество строк и столбцов в матрице, которую будем создавать:

Если Вы начали изучение C# после освоения других языков, то может так будет понятней:

Так (используя this) Вы однозначно указываете, что обращаться нужно именно к свойству класса.
Если this не использовать, то сначала ищется переменная с таким именем внутри метода, а если не находится, то поиск продолжается по свойствам класса.

Теперь зная количество строк и столбцов, создаем с помощью обычного перебора (2 цикла for ) нужное количество элементов TextBlock с необходимыми начальными настройками:

Margin задается для того, что б они не были все друг над другом.
Имя каждого TextBlock формируется с участием координаты Х и У для облегчения последующего доступа к ним и возможности случайно задавать координаты начала змейки.

Если добавить в этот метод элемент Border, то можно визуально оценить размеры ячеек и их расположение. Смотрим:

В таком случае в Grid добавляем уже элемент Border (LayoutRoot.Children.Add(elementBorder);), так как что б получить видимые границы нужного элемента необходимо его обернуть в тег Border:

Далее продолжим работу с первым вариантом, без границ.

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

Если в этом обработчике вызвать метод Start в цикле, то получим несколько одновременных змеек. Но это чуть позже.

Метод Start определяет начальные настройки змейки, такие как координаты Х и У начала змейки, длину змейки, скорость смены символов в каждой ячейке TextBlock.случайным образом, количество змеек после нажатия на экран в очереди:

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

И последний простенький метод, меняющий символы и их цвет в нужной ячейке нужное количество раз:

Ну вот и готова первая часть приложения. Костяк.
В следующей части мы переведем приложение на шаблон «Приложение Windows Phone с панорамой», расширим функционал приложения добавлением различных настроек матрицы, изменение которых будут сразу же отображаться на экране вашего смартфона.

П.С. Старался максимально передать последовательность своих мыслей, что б для людей начавших изучение WP8 приложение не казалось черным ящиком. А так же максимально упростить код и постепенно наращивать его сложность в следующих частях. Если есть непонятные моменты — спрашивайте.

Создание приложения для Windows Phone 7 от начала до конца. Часть 1

Эта статья и прилагаемое к ней приложение-пример поможет вам начать создавать полноценные приложения для Windows Phone 7. Вы узнаете об общих вопросах разработки на примере создания простого приложения для отслеживания количества топлива, потребляемого вашим автомобилем. В этой статье описываются вещи, которые вы должны знать, прежде чем приступить к созданию приложений для Windows Phone.

Аудитория

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

Некоторый опыт работы с:

• .NET
• C #

Немного или никакого опыта работы с:

• Silverlight
• Windows Phone

Пример приложения Fuel Tracker

Эта статья сопровождена приложением-примером под названием Fuel Tracker. Fuel Tracker является полноценным приложением для Windows Phone 7, написанным на Silverlight. Fuel Tracker позволяет пользователю отслеживать расход топлива своих автомобилей. Вы можете скачать исходный код приложения по следующей ссылке:
Скачать исходный код приложения Fuel Tracker

Типы приложений

Платформа Windows Phone предлагает на выбор два фреймворка для разработки приложений:

• Silverlight
  Silverlight поддерживает разработку приложений, упраляемых событиями, на основе языка XAML.
• XNA
  XNA Framework поддерживает разработку цикличных игр.

В следующей таблице перечислены некоторые критерии, которые можно использовать, чтобы определить, следует ли вам использовать Silverlight или XNA Framework для вашего Windows Phone приложения.

Требование к приложению	Рекомендуемый тип приложения
Текстовые элементы управления и меню	Silverlight
Управляемое событиями приложение	Silverlight
Взаимодействие с элементами управления Windows Phone, такими как Pivot и Panorama	Silverlight
Встроенное видео	Silverlight
Hosted HTML	Silverlight
Совместимость с веб-браузером	Silverlight
Векторная графика	Silverlight
Цикличные игры	XNA
Высокопроизводительные, визуально сложные приложения	XNA
3D игры	XNA
Расширенные возможности графики, такие как текстуры, эффекты и территориb	XNA
Совместимость с Xbox	XNA

Эта статья описывает, как разрабатывать приложение с помощью Silverlight.

App Hub и Marketplace

Как разработчик, вы публикуете свои приложения для Windows Phone Marketplace через сайт App Hub, расположенный по адресу http://create.msdn.com. App Hub также предоставляет множество ресурсов по разработке для Windows Phone и Xbox. Чтобы узнать больше, смотрите App Hub Getting Started Guide.

Чтобы подать заявку, необходимо приобрести подписку App Hub, которая стоит 99 долларов США в год. Вы можете отправить до 100 бесплатных приложений и неограниченное количество платных приложений. Платные приложения должны иметь минимальную цену в 99 центов, из которых 30% оплачивается за размещение. Кроме того, вы должны завести учётную запись на App Hub, прежде чем вы сможете развернуть и протестировать приложения на физическом устройстве с Windows Phone. Чтобы узнать больше или зарегистрироваться, смотрите страницу App Hub Membership.

Оборудование

Терминология

Чтобы приступить к написанию приложений для Windows Phone, вы должны быть знакомы с некоторой терминологией. На следующем рисунке показаны некоторые элементы Windows Phone.

Дизайн под кодовым названием Metro: пользовательский интерфейс, используемый в Windows Phone 7. Вы должны следовать этому дизайну в своём приложении, чтобы оно интегрировалось с операционной системой и другими приложениями. Дизайн обеспечивает современный пользовательский интерфейс, простой в использовании и сводящий к минимуму потребление энергии на телефоне. Дополнительную информацию вы можете найти здесь: Windows Phone Design System: Code named Metro.

Плитка (tile): отображение приложений на стартовом экране. Плитка может быть динамической и отображать информацию для пользователя.

Строка состояния (status bar): показывает состояние работы телефонной части, например, уровень сигнала. Не обязательно особая для каждого приложения.

Название приложения (application title): название приложения, как правило, в верхнем регистре.

Название страницы (page title): дополнительный заголовок для страницы, непрокручиваемый. Названия страниц, как правило, в нижнем регистре.

Экранная клавиатура (on-screen keyboard): клавиатура, появляющаяся, когда пользователь изменяет текстовое поле. Также известна как программная панель ввода (SIP — soft input panel).

Панель приложения (application bar): дополнительная панель для навигации по приложению, содержит кнопки и/или пункты меню.

Аппаратные кнопки «Назад», «Start», «Поиск»: кнопки, присутствие которых обязательно на каждом устройстве с Windows Phone. Эти кнопки позволяют пользователю перейти назад, вернуться к стартовому экрану или выполнить поиск в текущем контексте.