Как создать приложение под windows phone

Что такое appmakr?

appmakr — это онлайн-сервис для создания мобильных приложений под разные платформы, включая Windows Phone. Особенность сервиса в том, что для создания приложения не надо ничего программировать — он заточен под специальные сценарии потребления данных, которые позволяют генерировать приложения на основании указанных вами параметров (например, источника новостей в виде RSS-ленты).

Как это работает?

Первым делом, вам будет необходимо зарегистрироваться. После этого вы сможете попасть в панель управления (dashboard). Далее выберите создание нового приложения:

Чтобы сделать приложение под Windows Phone, выберите соответствующую опцию:

На следующем экране укажите источник для ваших данных (сайт на котором есть RSS/Atom или сразу ссылку на соответствующий фид) — я буду создавать приложение для нашего
студенческого блога:

Далее необходимо сделать базовые настройки: указать название приложения, выбрать иконку и экран загрузки из числа предложенных изображений (поиск можно уточнить), по ссылке или с диска:

Справа можно сразу посмотреть, как будет выглядеть ваше приложение в эмуляторе телефона:

Далее можно перейти к настройкам содержания (вкладка Tabs). Здесь можно скорректировать и добавить источники для контента (я добавлю RSS для постов и комментариев, а также RSS нашего твиттера Imagine Cup):

Следующий пункт — кастомизация приложения. Здесь можно изменить шапку приложения, а также поменять цвета:

Дальше остается добавить описание и во вкладке Publish сгенерировать приложение:

После этого приложение ставится в очередь на генерацию — вам остается лишь подождать какое-то время, пока приложение будет собрано и разместить его в Marketplace для всех желающих!

Готовый файл, генерируемый appmakr — это обычный zip-архив, который необходимо переименовать в xap-файл.

При большом желании приложение можно дополнительно настроить с помощью CSS и JavaScript.

Публикация в Marketplace

Теперь, когда у вас на руках есть готовый xap-файл, самое время опубликовать приложение в Marketplace. Часть графических элементов вы наверняка уже подготовили в процессе работы над приложением (например, иконки и экран загрузки), а часть еще понадобится сделать для публикации в магазине.
Напомню, что студенты (и аспиранты) могут зарегистрироваться в Marketplace бесплатно через программу DreamSpark. Также до 20 октября у Softkey действует специальная акция для размещения бесплатных приложений.

Полный набор графических объектов (не все из них обязательные) выглядит так: квадратные иконки шириной 99, 173 и 200px, фоновое изображение 1000x800px, а также набор скриншотов приложения. Скриншоты удобно делать с помощью встроенного в эмулятор средства для снятия снимков экрана.

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

Через несколько дней ваше приложение будет доступно в магазине приложений.

Итог

Если вы хотите быстро и без лишних затрат сделать приложение для Windows Phone,
appmakr — сделает для вас решение этой задачи очень простым! Все что вам нужно, это браузер, источники данных и, возможно, несколько картинок.

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

Бонус

Наконец, небольшой бонус. Мой коллега, Стас Павлов будет проводить вебинар «Основы разработки для платформы Windows Phone 7», на котором будет рассказано, как начать разрабатывать и зарабатывать на платформе Windows Phone 7.

Участие бесплатно. Регистрация обязательна.

An Overview of Developing a Basic Application on Windows Phone 7.5

Having recently acquired a Nokia Lumia 800, natively a Windows 7.5 Phone to use whilst in the United States, I decided it was time to see how easy (or hard) it would be to build a quick app, and break out of the world of the web browser.

Ingredients

• Visual Studio 2010 Express for Windows Phone*
• Windows Phone SDK 7.1
• A pinch of Silverlight, XAML and VB.NET
• A phone to test it on!

For some inexplicable reason, known only to folk in Redmond, the Windows Phone 8 SDK is not yet released, and is only supported in Visual Studio 2012. As such, for this project, I’ve had to use VS2010.

According to the Win Phone Dev Team, this will be updated with the Windows Phone 8 SDK later this year.

The Challenge

I quite enjoy the odd game of scrabble on my iPhone, although I can’t say I’m overly skillful. I regularly find myself stuck with a set of letters from which I can’t derive any intelligible words. No fear, my trusty English word list is here!

As Windows Phone development is based on a derivative of Silverlight and is expressed using XAML, neither of which I’ve used more than to tinker with a traditional ‘hello world’.

My challenge is to build an application with a number of basic features, to allow people to enter a set of letters from their tile rack, with the rack returning a set of possible words.

Functions Needed For This Application

• Entry of letters or tiles
• Remote call to web service (to retrieve the results)
• Display of results

Step 1 – Build the App Framework

The first step is to create an empty Windows Phone Application project in VS.  This will create a default page (MainPage.xaml) and a default set of application icons – the tile, background tile and splash screen.

I chose to use VB.NET as the base language, although the next app I’ll build will be in C#.  I won’t describe every line of code and object in this application, but just enough to get you started in building the next Angry Birds. Hopefully.

Step 2 – Add Functionality

An application bar is a great way to navigate throughout your application, and meets the guidelines provided by Microsoft for usability. Simply add an application bar using XAML to the bottom of your pages, and customize it with your own links and images.

A set of Application Bar icons that can be used as guides for creating your own icons is automatically installed as part of the Windows Phone SDK. You can find the sample icons at one of the following locations:

• C:Program FilesMicrosoft SDKsWindows Phonev7.1Iconsdark
• C:Program Files (x86)Microsoft SDKsWindows Phonev7.1Iconsdark
• Or wherever you’ve installed the SDK

The following is an example of my Application Bar.

I’ve chosen to store my images in a subfolder /images/, followed by further folders for specific purposes. If your images don’t appear, check out Step 3.5.

In the above code, you can see that each menu item has an event handler called Click, with an undefined function. I’ve added these using the code-behind file, MainPage.xaml.vb.

You can see in this code snippet how to navigate to other pages within your app.

As a handy aside, it is also really simple to return to the previous page, without needing to specify the actual filename. Simply use this homage to classic JavaScript:

On the main page, I’ve added a textbox, a button and an image. I will assume you know how to utilize these controls – the functionality is the same in ASP.NET C# and VB.NET.

Adding a textbox or other interactive control automatically enables the popup keyboard feature to appear, so you don’t need to worry about that.

From the textbox on the main page, I need to pass the text that the user enters into my results page. There are a number of ways to pass values between pages, but I’ve chosen to use the State system, which is analogous to Sessions in ASP.NET.

Now we have a functioning main page, and can now use the button to move to the results page.

Step 3 – Code Behind to Call the Web Service

To generate the results – in this application, a set of words that contain the letters or tiles entered by the user – I am passing the letters to my hosted API, which returns a comma separated list of words.

There are two popular methods for calling remote web services, WebClient and HTTPWebRequest. Whilst HTTPWebRequest is by far more flexible and configurable, I’ve chosen to use WebClient as it is essentially a simplified wrapper around HTTPWebRequest.

You can learn more about both functions in the system.net namespace, or by reading the MSDN article Downloading Content on Demand.

To request the results, I’m using the OpenReadAsync method, which returns the content to the OpenReadCompleted event.  In VB.NET, we need to add a handler to our WebClient instance to refer to our own function to handle the OpenReadCompleted event.

The code above assumes you are passing a fully qualified URL in the string url, and displays a popup box with the results.  In my app, I use the returning string to display the results on the page.

Step 3.5 – Important Hint!

It may be obvious to everyone else on the planet (or at least those who take the time to read documentation), but images need to be explicitly configured as content before they will display in the emulator or an actual published app.

Why is this not set by default?  No idea.  Simply set the Build Action to “Content“, and ensure your preferred Copy option is set.

Step 4 – Display the Results

The hosted web service simply returns a comma separated list of words which contain the letters the user entered. For example, if the use entered A-P-P-L-E, the system would return a list containing:

pelican,leopard,palates,pedlars,exempla,outleap,paliest,scalped,lapse,etc..

(Note that I’m not forcing the existence of double-letters, such as the two P’s in this example)

To display the results, I am using the RichTextBlock control, which supports the addition of other controls dynamically – similar to the ASP.NET placeholder control.

To achieve this, I parsed the results, and then added each as a string to the RichTextBlock.

However this looks fairly boring, so I’ve enhanced the results by parsing each individual word, and adding an image for each letter. In the end, I’ve used scrabble generic image tiles to display the words, and it looks great!

To achieve this, I’ve simply added each image after the next, with a line break at the end of each word.

This results in a nice display of tiles with the words that were found.

It’s Done!

Finally, the application is complete!  It’s quite a simple application, being just two actual pages (apart from the about page and the settings page, which is not yet functional).

From the home page, you can simply enter or type the letters you have on your tile rack, and click ‘go’.

The app will communicate with the server, and return up to 6 English words randomly chosen from the database that contain all the selected letters. Remarkably simple and very fast.

Extra Steps – Personalizing the App

Currently the application uses a pool of around 115,000 common English words. My next task will be to allow users to select from a variety of word lists, including complex and scientific words.

Tile design

It’s recommended that you create your own tile artwork for your application, especially if you plan to publish to the Marketplace.

There’s a great guide to the numerous options located on MSDN.  For this application, I created a very simple title tile using paint.net.

Testing my App

Aside from testing using the standard Windows Phone Emulator, Visual Studio 2010 Express for Windows Phone also includes a tool called the Marketplace Test Kit.  This fantastic tool automatically runs a number code check and unit tests, ensuring your application will pass the basic tests of the real Windows Marketplace.

This tool also allows you to run your app directly on your own Windows Phone, although it requires Zune to be active at the time.

What’s Next?

There’s a bunch of improvements I would like to make, primarily sharing the application bar across pages to minimize code duplication, and adding a local data cache to avoid errors when internet connectivity is not available.

Useful Links

• Windows Phone Dev Centre
• Windows Phone Development on MSDN

Source Code

I’m happy to give the source code out for this app to anyone who wants it – just send me an email or post a comment and I’ll send you the zip file.  It’s not elegant, but it works!

App Store

This app is now available via the Windows Phone Store – click here.

An Overview of Developing a Basic Application on Windows Phone 7.5

Having recently acquired a Nokia Lumia 800, natively a Windows 7.5 Phone to use whilst in the United States, I decided it was time to see how easy (or hard) it would be to build a quick app, and break out of the world of the web browser.

Ingredients

• Visual Studio 2010 Express for Windows Phone*
• Windows Phone SDK 7.1
• A pinch of Silverlight, XAML and VB.NET
• A phone to test it on!

For some inexplicable reason, known only to folk in Redmond, the Windows Phone 8 SDK is not yet released, and is only supported in Visual Studio 2012. As such, for this project, I’ve had to use VS2010.

According to the Win Phone Dev Team, this will be updated with the Windows Phone 8 SDK later this year.

The Challenge

I quite enjoy the odd game of scrabble on my iPhone, although I can’t say I’m overly skillful. I regularly find myself stuck with a set of letters from which I can’t derive any intelligible words. No fear, my trusty English word list is here!

As Windows Phone development is based on a derivative of Silverlight and is expressed using XAML, neither of which I’ve used more than to tinker with a traditional ‘hello world’.

My challenge is to build an application with a number of basic features, to allow people to enter a set of letters from their tile rack, with the rack returning a set of possible words.

Functions Needed For This Application

• Entry of letters or tiles
• Remote call to web service (to retrieve the results)
• Display of results

Step 1 – Build the App Framework

The first step is to create an empty Windows Phone Application project in VS.  This will create a default page (MainPage.xaml) and a default set of application icons – the tile, background tile and splash screen.

I chose to use VB.NET as the base language, although the next app I’ll build will be in C#.  I won’t describe every line of code and object in this application, but just enough to get you started in building the next Angry Birds. Hopefully.

Step 2 – Add Functionality

An application bar is a great way to navigate throughout your application, and meets the guidelines provided by Microsoft for usability. Simply add an application bar using XAML to the bottom of your pages, and customize it with your own links and images.

A set of Application Bar icons that can be used as guides for creating your own icons is automatically installed as part of the Windows Phone SDK. You can find the sample icons at one of the following locations:

• C:Program FilesMicrosoft SDKsWindows Phonev7.1Iconsdark
• C:Program Files (x86)Microsoft SDKsWindows Phonev7.1Iconsdark
• Or wherever you’ve installed the SDK

The following is an example of my Application Bar.

I’ve chosen to store my images in a subfolder /images/, followed by further folders for specific purposes. If your images don’t appear, check out Step 3.5.

In the above code, you can see that each menu item has an event handler called Click, with an undefined function. I’ve added these using the code-behind file, MainPage.xaml.vb.

You can see in this code snippet how to navigate to other pages within your app.

As a handy aside, it is also really simple to return to the previous page, without needing to specify the actual filename. Simply use this homage to classic JavaScript:

On the main page, I’ve added a textbox, a button and an image. I will assume you know how to utilize these controls – the functionality is the same in ASP.NET C# and VB.NET.

Adding a textbox or other interactive control automatically enables the popup keyboard feature to appear, so you don’t need to worry about that.

From the textbox on the main page, I need to pass the text that the user enters into my results page. There are a number of ways to pass values between pages, but I’ve chosen to use the State system, which is analogous to Sessions in ASP.NET.

Now we have a functioning main page, and can now use the button to move to the results page.

Step 3 – Code Behind to Call the Web Service

To generate the results – in this application, a set of words that contain the letters or tiles entered by the user – I am passing the letters to my hosted API, which returns a comma separated list of words.

There are two popular methods for calling remote web services, WebClient and HTTPWebRequest. Whilst HTTPWebRequest is by far more flexible and configurable, I’ve chosen to use WebClient as it is essentially a simplified wrapper around HTTPWebRequest.

You can learn more about both functions in the system.net namespace, or by reading the MSDN article Downloading Content on Demand.

To request the results, I’m using the OpenReadAsync method, which returns the content to the OpenReadCompleted event.  In VB.NET, we need to add a handler to our WebClient instance to refer to our own function to handle the OpenReadCompleted event.

The code above assumes you are passing a fully qualified URL in the string url, and displays a popup box with the results.  In my app, I use the returning string to display the results on the page.

Step 3.5 – Important Hint!

It may be obvious to everyone else on the planet (or at least those who take the time to read documentation), but images need to be explicitly configured as content before they will display in the emulator or an actual published app.

Why is this not set by default?  No idea.  Simply set the Build Action to “Content“, and ensure your preferred Copy option is set.

Step 4 – Display the Results

The hosted web service simply returns a comma separated list of words which contain the letters the user entered. For example, if the use entered A-P-P-L-E, the system would return a list containing:

pelican,leopard,palates,pedlars,exempla,outleap,paliest,scalped,lapse,etc..

(Note that I’m not forcing the existence of double-letters, such as the two P’s in this example)

To display the results, I am using the RichTextBlock control, which supports the addition of other controls dynamically – similar to the ASP.NET placeholder control.

To achieve this, I parsed the results, and then added each as a string to the RichTextBlock.

However this looks fairly boring, so I’ve enhanced the results by parsing each individual word, and adding an image for each letter. In the end, I’ve used scrabble generic image tiles to display the words, and it looks great!

To achieve this, I’ve simply added each image after the next, with a line break at the end of each word.

This results in a nice display of tiles with the words that were found.

It’s Done!

Finally, the application is complete!  It’s quite a simple application, being just two actual pages (apart from the about page and the settings page, which is not yet functional).

From the home page, you can simply enter or type the letters you have on your tile rack, and click ‘go’.

The app will communicate with the server, and return up to 6 English words randomly chosen from the database that contain all the selected letters. Remarkably simple and very fast.

Extra Steps – Personalizing the App

Currently the application uses a pool of around 115,000 common English words. My next task will be to allow users to select from a variety of word lists, including complex and scientific words.

Tile design

It’s recommended that you create your own tile artwork for your application, especially if you plan to publish to the Marketplace.

There’s a great guide to the numerous options located on MSDN.  For this application, I created a very simple title tile using paint.net.

Testing my App

Aside from testing using the standard Windows Phone Emulator, Visual Studio 2010 Express for Windows Phone also includes a tool called the Marketplace Test Kit.  This fantastic tool automatically runs a number code check and unit tests, ensuring your application will pass the basic tests of the real Windows Marketplace.

This tool also allows you to run your app directly on your own Windows Phone, although it requires Zune to be active at the time.

What’s Next?

There’s a bunch of improvements I would like to make, primarily sharing the application bar across pages to minimize code duplication, and adding a local data cache to avoid errors when internet connectivity is not available.

Useful Links

• Windows Phone Dev Centre
• Windows Phone Development on MSDN

Source Code

I’m happy to give the source code out for this app to anyone who wants it – just send me an email or post a comment and I’ll send you the zip file.  It’s not elegant, but it works!

App Store

This app is now available via the Windows Phone Store – click here.

Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]

• #
• #
• #
• #
• #
• #
• #
• #
• #
• #
• #

Создание первого приложения

Последнее обновление: 31.10.2015

Запустим Visual Studio Express 2013 for Windows. В меню выберем File->New Project... Перед нами откроется окно создания проекта:

В левой части окна выберем Visual C#->Store Apps-> Windows Phone Apps. А среди шаблонов нового проекта выберем
Blank App (Windows Phone), дадим какое-нибудь название проекту, например, назовем его HelloApp. И нажмем ОК.

И Visual Studio создаст новый проект:

Проект по шаблону Blank App по умолчанию имеет следующие узлы:

• Каталог Assets, содержащий используемые файлы изображений

• App.xaml и App.xaml.cs — файл ресурсов приложения на xaml и файл кода приложения на c# соответственно

• MainPage.xaml и MainPage.xaml.cs — файл графического интерфейса окна приложения и файл кода окна на c# соответственно

• Package.appxmanifest — файл манифеста приложения

На данном начальном этапе пока для нас ценность представляют файлы MainPage.xaml и MainPage.xaml.cs. Откроем файл MainPage.xaml,
который представляет графический интерфейс:

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

Допустим, наше приложение будет считать сумму вклада после начисления процентов. Для этого нам нужно поле ввода суммы вклада,
поле для вывода результата и кнопку, с помощью которой мы будем инициировать вычисления итоговой суммы. Итак, изменим код файла MainPage.xaml следующим образом:

<Page
    x:Class="HelloApp.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:HelloApp"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid>
        <TextBox x:Name="textBox1" Width="200" PlaceholderText="Введите сумму" />
        <Button x:Name="button1" Content="Считать" Width="150" VerticalAlignment="Top" 
                Margin="140 60 0 0"/>
        <TextBlock x:Name="textBlock1" Width="150" Height="40" FontSize="24"
                   VerticalAlignment="Top" Margin="40 120 20 0" />
    </Grid>
</Page>

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

Мы добавили текстовое поле (элемент TextBox) для ввода некоторого значения, кнопку для инициации действия, и элемент
TextBlock для вывода результата действия.

С помощью атрибутов элементов мы задаем их внешний вид и позиционирование. Например, с помощью атрибута Margin задаются отступы от внешнего края. Более подробно об атрибутах и прочих элементах языка xaml мы поговорим в дальнейшем.

После добавления элементов и их атрибутов у нас автоматически обновится и окно дизайнера:

Теперь изменим код кнопки следующим образом:

<Button x:Name="button1" Content="Считать" Width="150" VerticalAlignment="Top" 
                Margin="140 60 0 0" Click="button1_Click"/>

С помощью выражения Click="button1_Click" мы добавили обработчик события Click. Таким образом, по нажатию кнопки будет срабатывать метод
button1_Click. Теперь определим этот метод.

Откроем файл MainPage.xaml.cs, который содержит логику страницы. По умолчанию он имеет следующий код:

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

namespace HelloApp
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();

            this.NavigationCacheMode = NavigationCacheMode.Required;
        }

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
        }
    }
}

В класс MainPage добавим новый метод:

private void button1_Click(object sender, RoutedEventArgs e)
{
    double capital;
    if(Double.TryParse(textBox1.Text,out capital))
    {
        capital+=capital * 0.12;
        textBlock1.Text = capital.ToString() + " долларов";
    }
    else
    {
        textBlock1.Text="Некорректное значение";
    }
}

В методе мы получаем введенное в текстовое поле значение и пытаемся его преобразовать к типу double. Если преобразование пройдет успешно, то выводим результат
несложных вычислений.

Запустим на выполнение:

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

При запуске приложения на смартфоне важно, чтобы смартфон не находился в состоянии блокировки. Итак, запустим:

Введем в текстовое поле какое-нибудь число и нажмем на кнопку:

При тестировании через смартфон важно помнить, что при запуске приложение автоматически устанавливается на телефон, и мы можем его найти в списке всех приложений:

И при необходимости потом, отключившись от компьютера, также сможем его запустить, либо удалить.

На этом создание первого приложения завершено.