Разработка приложений для Windows 8

Подготовка к публикации

Разбить на страницы
Показывать лекцию целиком

HTML + JS: Практическое занятие №6

Задание: продолжая проект, полученный в результате выполнения пятого практического задания, подготовьте приложение к публикации и отправьте его на сертификацию в Windows Store.

  • Добавьте поддержку плиток
  • Обновите используемые в приложении изображения (иконки и экран загрузки)
  • Пройдите проверку через WACK
  • Зарегистрируйтесь в Windows Store
  • Отправьте приложение на сертификацию
  • При необходимости исправьте ошибки и отправьте приложение повторно.
  • В качестве подтверждения выполнения лабораторной работы от вас потребуется предоставить скриншот размещенного в Windows Store приложения.
  • ЗАМЕЧАНИЕ: напоминаем, что ваше приложение должно быть уникальным:

  • Использовать в качестве источников данных источники, отличные от тех, которые приводятся в инструкциям к практическим занятиям
  • Внешний вид приложения должен соответствовать выбранной вами тематике приложения (для всех страниц приложения).
  • В вашем приложении должны быть ваши собственные название, изображения и описание.
  • Политика конфиденциальности (Privacy Policy) должна соответствовать вашему приложению и быть доступна внутри приложения.
  • Живые плитки

    Последним добавлением в наше приложение будут живые плитки, отображающие свежие новости, полученные из RSS. В идеале плитки должны отображать состояние приложения или самого сервиса (источника информации) без необходимости его специальной загрузки, но в данном случае для упрощения разработки мы ограничимся простым сценарием: после получения RSS мы будем добавлять в ротацию некоторое количество плиток.

    Откройте файл data.js, найдите функцию getItemsFromRSSFeed и в конце внутри цикла добавьте следующие строчки:

    if (postIndex == 0) {
        addLiveTile(postItem.title, (image != null) ? image.src : null);
    }

    Функцию addLiveTile мы определим ниже. Обратите внимание, что мы добавляем плитку только для первой (самой свежей) новости в каждом источнике.

    Ниже опишите функцию addLiveTile:

    function addLiveTile(title, img) {
        var notifications = Windows.UI.Notifications;
        
        var squareTemplate, wideTemplate,
            squareTileXML, wideTileXML;
    
        // Выбираем шаблоны с картинками и без
        if (img) {
            squareTemplate = notifications.TileTemplateType.tileSquarePeekImageAndText04;
            wideTemplate = notifications.TileTemplateType.tileWideImageAndText01;
        } else {
            squareTemplate = notifications.TileTemplateType.tileSquareText04;
            wideTemplate = notifications.TileTemplateType.tileWideText03;
        }
    
        squareTileXML = notifications.TileUpdateManager.getTemplateContent(squareTemplate);
        wideTileXML = notifications.TileUpdateManager.getTemplateContent(wideTemplate);
    
        // Обновляем текст
        squareTileXML.getElementsByTagName("text")[0].appendChild(squareTileXML.createTextNode(title));
        wideTileXML.getElementsByTagName("text")[0].appendChild(wideTileXML.createTextNode(title));
    
        // Обновляем картинки
        if (img) {
            squareTileXML.getElementsByTagName("image")[0].setAttribute("src", img);
            wideTileXML.getElementsByTagName("image")[0].setAttribute("src", img);
            squareTileXML.getElementsByTagName("image")[0].setAttribute("alt", title);
            wideTileXML.getElementsByTagName("image")[0].setAttribute("alt", title);
        }
    
        // Сшиваем шаблоны в один
        var node = wideTileXML.importNode(squareTileXML.getElementsByTagName("binding").item(0), true);
        wideTileXML.getElementsByTagName("visual").item(0).appendChild(node);
    
        // Разрешаем очередь
        notifications.TileUpdateManager.createTileUpdaterForApplication().enableNotificationQueue(true);
    
        // Отправляем обновление
        var tileNotification = new notifications.TileNotification(wideTileXML);
        notifications.TileUpdateManager.createTileUpdaterForApplication().update(tileNotification);
    } 

    В функции вы одновременно добавляем квадратный и широкий шаблоны (полный каталог шаблонов можно найти тут http://msdn.microsoft.com/ru-ru/library/windows/apps/hh761491.aspx). Также мы дополнительно включаем очередь, чтобы в цикле могли отображаться несколько плиток (по одной для каждого источника).

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

    Откройте манифест приложения, на первой вкладке Application UI найдите описание плиток. Достаточно добавить картинки для масштаба 100%, но при желании вы можете поддержать и другие масштабы отображения.

    Добавьте необходимые логотипы в проект и укажите их в манифесте:

    Не забудьте про экран загрузки (Splash Screen).

    Попробуйте запустить приложение и проверьте, как ведет себя ваша новая живая плитка:

    Windows App Certification Kit

    Теперь самое время приступить к подготовке нашего приложения к размещению в Windows Store. Одна из крайне рекомендуемых (и фактически обязательных) процедур заключается в локальном тестировании приложения с помощью WACK.

    Перейдите на экран Пуск и в поиске наберите cert. Отобразится список приложений – запустите из него Windows App Cert Kit:

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

    Щелкните по Validate Windows Store App и дождитесь отображения списка установленных приложений:

    В списке выберите ваше приложение:

    Нажмите кнопку Next, запустится тестирование приложения. Не взаимодействуйте с системой и дождитесь окончания тестирования:

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

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

    И если нажать на ссылку, откроется подробный отчет. Например, если вы тестировали локальную сборку для отладки, то отчет предупредит об этом:

    Если вы не поменяли логотипы на собственные, приложение падает и т.п., это все будет в отчете.

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

    Размещение приложения в Windows Store

    Тут мы подходим к кульминации!

    1. Вам необходим аккаунт разработчика приложений для Windows Store. Начать регистрацию можно по этой ссылке: https://appdev.microsoft.com/StorePortals/Account/Signup/Start/

  • При регистрации вам понадобится Microsoft Account (ранее LiveID). Убедитесь, что в нем правильно указан возраст и страна, из которой вы регистрируетесь.
  • Вам нужно будет выбрать тип аккаунта (индивидуальный или для компании).
  • При регистрации для подтверждения аккаунта будет необходимо привязать банковскую карточку, на которой на момент регистрации будет заблокирована некоторая сумма (около 30 рублей), после чего в процессе будет также заблокирована вторая случайная сумма (в небольшом диапазоне) – вам нужно будет выяснить эту сумму или код, указанный в транзакции, чтобы подтвердить свой аккаунт.
  • Важно: карта должна поддерживать платежи через интернет и вам будет необходимо иметь доступ к информации о заблокированных суммах.
  • Важно: представители Microsoft или Интуита не смогу вам подсказать, какие карточки и каких банков подходят или почему не подходит конкретно ваша в случае возникновения проблем. Эти вопросы необходимо решать с вашим банком и, возможно, службой поддержки Windows Store (getsupport.microsoft.com).
  • Регистрация в магазине приложений в качестве разработчика платная, однако, в рамках платной подписки MSDN, а также программ DreamSpark (http://dreamspark.ru) и BizSpark (http://ms-start.ru), если вы удовлетворяете условиям участия в них, вы можете получить код для бесплатной регистрации.
  • 2. После заведения и подтверждения аккаунта, можно приступать к процессу публикации приложения.

    Перейдите в информационную панель (https://appdev.microsoft.com/StorePortals/ru-ru/Home/Index) и выберите слева в меню пункт "Отправить приложение". Вам откроется страница создания описания приложения:

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

    В разделе "пакет приложения" вам будет необходимо передать сборку вашего приложения. Для этого перейдите к своему проекту в Visual Studio. В меню выберите пункт Project -> Store -> Create App Packages…

    Укажите "yes" и нажмите Sign In. Вам будет необходимо ввести данные своего аккаунта разработчика:

    После входа выберите имя своего приложения из числа зарезервированных и нажмите Next:

    Укажите, какие сборки необходимо собрать (если у вас нет явных причин на обратное, выбирайте Any CPU):

    Созданная сборка будет доступна внутри вашего проекта в папке AppPackages. Загрузите файл с расширением .appxupload на сертификацию в информационной панели.

    Добавьте описание приложения и скриншоты.

    Важно: все описание должно быть на том языке, которое у вас указано в настройках проекта. В манифесте приложения это пункт Default Language. Для приложений на русском там необходимо указать ru-RU.

    При необходимости добавьте заметки для инженеров.

    Наконец, можно отправлять на сертификацию!

    Далее остается дождаться прохождения всех тестов, либо, получив сообщение об обнаруженных ошибка, исправить недочеты и отправить еще раз свежую версию:

    Готово!

    XAML+C#. Практическое занятие №6

    Задание: продолжая проект, полученный в результате выполнения пятого практического задания, подготовьте приложение к публикации и отправьте его на сертификацию в Windows Store.

  • Добавьте поддержку плиток
  • Обновите используемые в приложении изображения (иконки и экран загрузки)
  • Пройдите проверку через WACK
  • Зарегистрируйтесь в Windows Store
  • Отправьте приложение на сертификацию
  • При необходимости исправьте ошибки и отправьте приложение повторно.
  • В качестве подтверждения выполнения лабораторной работы от вас потребуется предоставить скриншот размещенного в Windows Store приложения.
  • ЗАМЕЧАНИЕ: напоминаем, что ваше приложение должно быть уникальным:

  • Использовать в качестве источников данных источники, отличные от тех, которые приводятся в инструкциям к практическим занятиям
  • Внешний вид приложения должен соответствовать выбранной вами тематике приложения (для всех страниц приложения).
  • В вашем приложении должны быть ваши собственные название, изображения и описание.
  • Политика конфиденциальности (Privacy Policy) должна соответствовать вашему приложению и быть доступна внутри приложения.
  • Добавляем живые плитки

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

    Перейдем в файл RSSDataSource.cs и добавим в класс RSSDataSource метод UpdateTile:

    public static void UpdateTile()
    {
    var news = RSSDataSource.AllGroups[0].Items.ToList();            
    var xml = new XmlDocument();
    xml.LoadXml(
        string.Format(
            @"<?xml version=""1.0"" encoding=""utf-8"" ?>
    <tile>
        <visual branding=""none"">
            <binding template=""TileSquarePeekImageAndText03"">
                <image id=""1"" src=""ms-appx:///Assets/Logo.png"" alt=""alt text""/>
                <text id=""1"">{0}</text>
                <text id=""2"">{1}</text>
                <text id=""3"">{2}</text>
                <text id=""4"">{3}</text>
            </binding>
            <binding template=""TileWidePeekImageAndText02"">                        
                <image id=""1"" src=""ms-appx:///Assets/WideLogo.png"" alt=""alt text""/>
                <text id=""1"">{0}</text>
                <text id=""2"">{1}</text>
                <text id=""3"">{2}</text>
                <text id=""4"">{3}</text>
            </binding>  
        </visual>
    </tile>",
            news.Count > 0 ? System.Net.WebUtility.HtmlEncode(news[0].Title) : "",
            news.Count > 1 ? System.Net.WebUtility.HtmlEncode(news[1].Title) : "",
            news.Count > 2 ? System.Net.WebUtility.HtmlEncode(news[2].Title) : "",
            news.Count > 3 ? System.Net.WebUtility.HtmlEncode(news[3].Title) : ""));
    TileUpdateManager.CreateTileUpdaterForApplication().Update(new TileNotification(xml));
    }

    Не забудте добавить в блок using следующие директивы:

    using Windows.Data.Xml.Dom;
    using Windows.UI.Notifications;

    Здесь мы создаем XML для обновления плиток, используя шаблоны, и собственно обновляем сами плитки. Код полностью прозрачен. Поскольку это пример, то я всегда беру просто первый RSS поток.

    Чтобы это заработало, надо добавить вызов этого метода в любое место, где уже достпен RSS. Давайте добавим await к вызываемым методам AddGroupForFeedAsync загрузки RSS и тогда сможем спокойно вызывать нашу функцию, после добавления первого фида.

    Переходим к методу LoadState в файле GroupedItemsPage.xaml.cs, добавляем к нему и добавляем вызов UpdateTile после foreach (var feed in feeds) (в двух местах)

    RSSDataSource.UpdateTile();

    Я специально отставил один вызов без await – позже – обратите внимание, как это выглядит, при старте приложения.

    Теперь осталось добавить к приложению поддержку WideLogo. Для этого создайте файл WideLogo.png размером 310 на 150, содержащий картинку, относящуюся к вашему проекту, и добавьте его в папку Asset проекта. Далее двойным щелчком по файлу Package.appxmanifest откройте его визуальный редактор и добавьте WideLogo в приложение:

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

    Обновляем логотипы и стартовый экран приложения

    Далее двойным щелчком по файлу Package.appxmanifest откройте его визуальный редактор. WideLogo мы добавили, теперь нам нужно добавить Logo, Small Logo, Store Logo и Splash Screen.

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

    100% масштаб для Logo: 150 на 150, Store Logo 50 на 50 и Small Logo – 30 на 30. Размер 100% картинки для стартового экрана 620 на 300.

    Учтите, что приложение не пройдет сертификацию со стандартными картинками, которые включены в шаблон.

    Создайте картинки необходимого размера и добавьте их в Package.appxmanifest. Соберите и выполните развертывание Retail сборки приложение из Visual Studio (Deploy в меню Build) – это необходимо, чтобы можно было запустить WACK (Windows App Cert Kit).

    Windows App Cert Kit

    Перейдите на экран Пуск и в поиске наберите cert. Отобразится список приложений – запустите из него Windows App Cert Kit:

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

    Щелкните по Validate Windows Store App и дождитесь отображения списка установленных приложений:

    В списке выберите ваше приложение:

    Нажмите кнопку Next, запустится тестирование приложения. Не взаимодействуйте с системой и дождитесь окончания тестирования:

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

    Через некоторое время появится приглашение сохранить отчет в виде XML:

    После сохранения – отобразится окно с финальным результатом:

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

    Если дать работать тесту спокойно, эта ошибка уйдет.

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

    Перед тем, как пытаться послать приложение в Windows Store на публикацию, необходимо удостовериться, что вы проходите локальное тестирование, потому что это первые тесты, которые будут запущены на сервере.

    Размещение приложения в Windows Store

    Тут мы подходим к кульминации!

    1. Вам необходим аккаунт разработчика приложений для Windows Store. Начать регистрацию можно по этой ссылке: https://appdev.microsoft.com/StorePortals/Account/Signup/Start/

  • При регистрации вам понадобится Microsoft Account (ранее LiveID). Убедитесь, что в нем правильно указан возраст и страна, из которой вы регистрируетесь.
  • Вам нужно будет выбрать тип аккаунта (индивидуальный или для компании).
  • При регистрации для подтверждения аккаунта будет необходимо привязать банковскую карточку, на которой на момент регистрации будет заблокирована некоторая сумма (около 30 рублей), после чего в процессе будет также заблокирована вторая случайная сумма (в небольшом диапазоне) – вам нужно будет выяснить эту сумму или код, указанный в транзакции, чтобы подтвердить свой аккаунт.
  • Важно: карта должна поддерживать платежи через интернет и вам будет необходимо иметь доступ к информации о заблокированных суммах.
  • Важно: представители Microsoft или Интуита не смогу вам подсказать, какие карточки и каких банков подходят или почему не подходит конкретно ваша в случае возникновения проблем. Эти вопросы необходимо решать с вашим банком и, возможно, службой поддержки Windows Store (getsupport.microsoft.com).
  • Регистрация в магазине приложений в качестве разработчика платная, однако, в рамках платной подписки MSDN, а также программ DreamSpark (http://dreamspark.ru) и BizSpark (http://ms-start.ru), если вы удовлетворяете условиям участия в них, вы можете получить код для бесплатной регистрации.
  • 2. После заведения и подтверждения аккаунта, можно приступать к процессу публикации приложения.

    Перейдите в информационную панель (https://appdev.microsoft.com/StorePortals/ru-ru/Home/Index) и выберите слева в меню пункт "Отправить приложение". Вам откроется страница создания описания приложения:

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

    В разделе "пакет приложения" вам будет необходимо передать сборку вашего приложения. Для этого перейдите к своему проекту в Visual Studio. В меню выберите пункт Project -> Store -> Create App Packages…

    Укажите "yes" и нажмите Sign In. Вам будет необходимо ввести данные своего аккаунта разработчика:

    После входа выберите имя своего приложения из числа зарезервированных и нажмите Next:

    Укажите, какие сборки необходимо собрать (если у вас нет явных причин на обратное, выбирайте Any CPU):

    Созданная сборка будет доступна внутри вашего проекта в папке AppPackages. Загрузите файл с расширением .appxupload на сертификацию в информационной панели.

    Добавьте описание приложения и скриншоты.

    Важно: все описание должно быть на том языке, которое у вас указано в настройках проекта. В манифесте приложения это пункт Default Language. Для приложений на русском там необходимо указать ru-RU.

    При необходимости добавьте заметки для инженеров.

    Наконец, можно отправлять на сертификацию!

    Далее остается дождаться прохождения всех тестов, либо, получив сообщение об обнаруженных ошибка, исправить недочеты и отправить еще раз свежую версию:

    Готово!

    Страницы:

    HTML + JS: Практическое занятие №6

    Задание: продолжая проект, полученный в результате выполнения пятого практического задания, подготовьте приложение к публикации и отправьте его на сертификацию в Windows Store.

  • Добавьте поддержку плиток
  • Обновите используемые в приложении изображения (иконки и экран загрузки)
  • Пройдите проверку через WACK
  • Зарегистрируйтесь в Windows Store
  • Отправьте приложение на сертификацию
  • При необходимости исправьте ошибки и отправьте приложение повторно.
  • В качестве подтверждения выполнения лабораторной работы от вас потребуется предоставить скриншот размещенного в Windows Store приложения.
  • ЗАМЕЧАНИЕ: напоминаем, что ваше приложение должно быть уникальным:

  • Использовать в качестве источников данных источники, отличные от тех, которые приводятся в инструкциям к практическим занятиям
  • Внешний вид приложения должен соответствовать выбранной вами тематике приложения (для всех страниц приложения).
  • В вашем приложении должны быть ваши собственные название, изображения и описание.
  • Политика конфиденциальности (Privacy Policy) должна соответствовать вашему приложению и быть доступна внутри приложения.
  • Живые плитки

    Последним добавлением в наше приложение будут живые плитки, отображающие свежие новости, полученные из RSS. В идеале плитки должны отображать состояние приложения или самого сервиса (источника информации) без необходимости его специальной загрузки, но в данном случае для упрощения разработки мы ограничимся простым сценарием: после получения RSS мы будем добавлять в ротацию некоторое количество плиток.

    Откройте файл data.js, найдите функцию getItemsFromRSSFeed и в конце внутри цикла добавьте следующие строчки:

    if (postIndex == 0) {
        addLiveTile(postItem.title, (image != null) ? image.src : null);
    }

    Функцию addLiveTile мы определим ниже. Обратите внимание, что мы добавляем плитку только для первой (самой свежей) новости в каждом источнике.

    Ниже опишите функцию addLiveTile:

    function addLiveTile(title, img) {
        var notifications = Windows.UI.Notifications;
        
        var squareTemplate, wideTemplate,
            squareTileXML, wideTileXML;
    
        // Выбираем шаблоны с картинками и без
        if (img) {
            squareTemplate = notifications.TileTemplateType.tileSquarePeekImageAndText04;
            wideTemplate = notifications.TileTemplateType.tileWideImageAndText01;
        } else {
            squareTemplate = notifications.TileTemplateType.tileSquareText04;
            wideTemplate = notifications.TileTemplateType.tileWideText03;
        }
    
        squareTileXML = notifications.TileUpdateManager.getTemplateContent(squareTemplate);
        wideTileXML = notifications.TileUpdateManager.getTemplateContent(wideTemplate);
    
        // Обновляем текст
        squareTileXML.getElementsByTagName("text")[0].appendChild(squareTileXML.createTextNode(title));
        wideTileXML.getElementsByTagName("text")[0].appendChild(wideTileXML.createTextNode(title));
    
        // Обновляем картинки
        if (img) {
            squareTileXML.getElementsByTagName("image")[0].setAttribute("src", img);
            wideTileXML.getElementsByTagName("image")[0].setAttribute("src", img);
            squareTileXML.getElementsByTagName("image")[0].setAttribute("alt", title);
            wideTileXML.getElementsByTagName("image")[0].setAttribute("alt", title);
        }
    
        // Сшиваем шаблоны в один
        var node = wideTileXML.importNode(squareTileXML.getElementsByTagName("binding").item(0), true);
        wideTileXML.getElementsByTagName("visual").item(0).appendChild(node);
    
        // Разрешаем очередь
        notifications.TileUpdateManager.createTileUpdaterForApplication().enableNotificationQueue(true);
    
        // Отправляем обновление
        var tileNotification = new notifications.TileNotification(wideTileXML);
        notifications.TileUpdateManager.createTileUpdaterForApplication().update(tileNotification);
    } 

    В функции вы одновременно добавляем квадратный и широкий шаблоны (полный каталог шаблонов можно найти тут http://msdn.microsoft.com/ru-ru/library/windows/apps/hh761491.aspx). Также мы дополнительно включаем очередь, чтобы в цикле могли отображаться несколько плиток (по одной для каждого источника).

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

    Откройте манифест приложения, на первой вкладке Application UI найдите описание плиток. Достаточно добавить картинки для масштаба 100%, но при желании вы можете поддержать и другие масштабы отображения.

    Добавьте необходимые логотипы в проект и укажите их в манифесте:

    Не забудьте про экран загрузки (Splash Screen).

    Попробуйте запустить приложение и проверьте, как ведет себя ваша новая живая плитка:

    Windows App Certification Kit

    Теперь самое время приступить к подготовке нашего приложения к размещению в Windows Store. Одна из крайне рекомендуемых (и фактически обязательных) процедур заключается в локальном тестировании приложения с помощью WACK.

    Перейдите на экран Пуск и в поиске наберите cert. Отобразится список приложений – запустите из него Windows App Cert Kit:

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

    Щелкните по Validate Windows Store App и дождитесь отображения списка установленных приложений:

    В списке выберите ваше приложение:

    Нажмите кнопку Next, запустится тестирование приложения. Не взаимодействуйте с системой и дождитесь окончания тестирования:

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

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

    И если нажать на ссылку, откроется подробный отчет. Например, если вы тестировали локальную сборку для отладки, то отчет предупредит об этом:

    Если вы не поменяли логотипы на собственные, приложение падает и т.п., это все будет в отчете.

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

    Размещение приложения в Windows Store

    Тут мы подходим к кульминации!

    1. Вам необходим аккаунт разработчика приложений для Windows Store. Начать регистрацию можно по этой ссылке: https://appdev.microsoft.com/StorePortals/Account/Signup/Start/

  • При регистрации вам понадобится Microsoft Account (ранее LiveID). Убедитесь, что в нем правильно указан возраст и страна, из которой вы регистрируетесь.
  • Вам нужно будет выбрать тип аккаунта (индивидуальный или для компании).
  • При регистрации для подтверждения аккаунта будет необходимо привязать банковскую карточку, на которой на момент регистрации будет заблокирована некоторая сумма (около 30 рублей), после чего в процессе будет также заблокирована вторая случайная сумма (в небольшом диапазоне) – вам нужно будет выяснить эту сумму или код, указанный в транзакции, чтобы подтвердить свой аккаунт.
  • Важно: карта должна поддерживать платежи через интернет и вам будет необходимо иметь доступ к информации о заблокированных суммах.
  • Важно: представители Microsoft или Интуита не смогу вам подсказать, какие карточки и каких банков подходят или почему не подходит конкретно ваша в случае возникновения проблем. Эти вопросы необходимо решать с вашим банком и, возможно, службой поддержки Windows Store (getsupport.microsoft.com).
  • Регистрация в магазине приложений в качестве разработчика платная, однако, в рамках платной подписки MSDN, а также программ DreamSpark (http://dreamspark.ru) и BizSpark (http://ms-start.ru), если вы удовлетворяете условиям участия в них, вы можете получить код для бесплатной регистрации.
  • 2. После заведения и подтверждения аккаунта, можно приступать к процессу публикации приложения.

    Перейдите в информационную панель (https://appdev.microsoft.com/StorePortals/ru-ru/Home/Index) и выберите слева в меню пункт "Отправить приложение". Вам откроется страница создания описания приложения:

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

    В разделе "пакет приложения" вам будет необходимо передать сборку вашего приложения. Для этого перейдите к своему проекту в Visual Studio. В меню выберите пункт Project -> Store -> Create App Packages…

    Укажите "yes" и нажмите Sign In. Вам будет необходимо ввести данные своего аккаунта разработчика:

    После входа выберите имя своего приложения из числа зарезервированных и нажмите Next:

    Укажите, какие сборки необходимо собрать (если у вас нет явных причин на обратное, выбирайте Any CPU):

    Созданная сборка будет доступна внутри вашего проекта в папке AppPackages. Загрузите файл с расширением .appxupload на сертификацию в информационной панели.

    Добавьте описание приложения и скриншоты.

    Важно: все описание должно быть на том языке, которое у вас указано в настройках проекта. В манифесте приложения это пункт Default Language. Для приложений на русском там необходимо указать ru-RU.

    При необходимости добавьте заметки для инженеров.

    Наконец, можно отправлять на сертификацию!

    Далее остается дождаться прохождения всех тестов, либо, получив сообщение об обнаруженных ошибка, исправить недочеты и отправить еще раз свежую версию:

    Готово!

    XAML+C#. Практическое занятие №6

    Задание: продолжая проект, полученный в результате выполнения пятого практического задания, подготовьте приложение к публикации и отправьте его на сертификацию в Windows Store.

  • Добавьте поддержку плиток
  • Обновите используемые в приложении изображения (иконки и экран загрузки)
  • Пройдите проверку через WACK
  • Зарегистрируйтесь в Windows Store
  • Отправьте приложение на сертификацию
  • При необходимости исправьте ошибки и отправьте приложение повторно.
  • В качестве подтверждения выполнения лабораторной работы от вас потребуется предоставить скриншот размещенного в Windows Store приложения.
  • ЗАМЕЧАНИЕ: напоминаем, что ваше приложение должно быть уникальным:

  • Использовать в качестве источников данных источники, отличные от тех, которые приводятся в инструкциям к практическим занятиям
  • Внешний вид приложения должен соответствовать выбранной вами тематике приложения (для всех страниц приложения).
  • В вашем приложении должны быть ваши собственные название, изображения и описание.
  • Политика конфиденциальности (Privacy Policy) должна соответствовать вашему приложению и быть доступна внутри приложения.
  • Добавляем живые плитки

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

    Перейдем в файл RSSDataSource.cs и добавим в класс RSSDataSource метод UpdateTile:

    public static void UpdateTile()
    {
    var news = RSSDataSource.AllGroups[0].Items.ToList();            
    var xml = new XmlDocument();
    xml.LoadXml(
        string.Format(
            @"<?xml version=""1.0"" encoding=""utf-8"" ?>
    <tile>
        <visual branding=""none"">
            <binding template=""TileSquarePeekImageAndText03"">
                <image id=""1"" src=""ms-appx:///Assets/Logo.png"" alt=""alt text""/>
                <text id=""1"">{0}</text>
                <text id=""2"">{1}</text>
                <text id=""3"">{2}</text>
                <text id=""4"">{3}</text>
            </binding>
            <binding template=""TileWidePeekImageAndText02"">                        
                <image id=""1"" src=""ms-appx:///Assets/WideLogo.png"" alt=""alt text""/>
                <text id=""1"">{0}</text>
                <text id=""2"">{1}</text>
                <text id=""3"">{2}</text>
                <text id=""4"">{3}</text>
            </binding>  
        </visual>
    </tile>",
            news.Count > 0 ? System.Net.WebUtility.HtmlEncode(news[0].Title) : "",
            news.Count > 1 ? System.Net.WebUtility.HtmlEncode(news[1].Title) : "",
            news.Count > 2 ? System.Net.WebUtility.HtmlEncode(news[2].Title) : "",
            news.Count > 3 ? System.Net.WebUtility.HtmlEncode(news[3].Title) : ""));
    TileUpdateManager.CreateTileUpdaterForApplication().Update(new TileNotification(xml));
    }

    Не забудте добавить в блок using следующие директивы:

    using Windows.Data.Xml.Dom;
    using Windows.UI.Notifications;

    Здесь мы создаем XML для обновления плиток, используя шаблоны, и собственно обновляем сами плитки. Код полностью прозрачен. Поскольку это пример, то я всегда беру просто первый RSS поток.

    Чтобы это заработало, надо добавить вызов этого метода в любое место, где уже достпен RSS. Давайте добавим await к вызываемым методам AddGroupForFeedAsync загрузки RSS и тогда сможем спокойно вызывать нашу функцию, после добавления первого фида.

    Переходим к методу LoadState в файле GroupedItemsPage.xaml.cs, добавляем к нему и добавляем вызов UpdateTile после foreach (var feed in feeds) (в двух местах)

    RSSDataSource.UpdateTile();

    Я специально отставил один вызов без await – позже – обратите внимание, как это выглядит, при старте приложения.

    Теперь осталось добавить к приложению поддержку WideLogo. Для этого создайте файл WideLogo.png размером 310 на 150, содержащий картинку, относящуюся к вашему проекту, и добавьте его в папку Asset проекта. Далее двойным щелчком по файлу Package.appxmanifest откройте его визуальный редактор и добавьте WideLogo в приложение:

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

    Обновляем логотипы и стартовый экран приложения

    Далее двойным щелчком по файлу Package.appxmanifest откройте его визуальный редактор. WideLogo мы добавили, теперь нам нужно добавить Logo, Small Logo, Store Logo и Splash Screen.

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

    100% масштаб для Logo: 150 на 150, Store Logo 50 на 50 и Small Logo – 30 на 30. Размер 100% картинки для стартового экрана 620 на 300.

    Учтите, что приложение не пройдет сертификацию со стандартными картинками, которые включены в шаблон.

    Создайте картинки необходимого размера и добавьте их в Package.appxmanifest. Соберите и выполните развертывание Retail сборки приложение из Visual Studio (Deploy в меню Build) – это необходимо, чтобы можно было запустить WACK (Windows App Cert Kit).

    Windows App Cert Kit

    Перейдите на экран Пуск и в поиске наберите cert. Отобразится список приложений – запустите из него Windows App Cert Kit:

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

    Щелкните по Validate Windows Store App и дождитесь отображения списка установленных приложений:

    В списке выберите ваше приложение:

    Нажмите кнопку Next, запустится тестирование приложения. Не взаимодействуйте с системой и дождитесь окончания тестирования:

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

    Через некоторое время появится приглашение сохранить отчет в виде XML:

    После сохранения – отобразится окно с финальным результатом:

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

    Если дать работать тесту спокойно, эта ошибка уйдет.

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

    Перед тем, как пытаться послать приложение в Windows Store на публикацию, необходимо удостовериться, что вы проходите локальное тестирование, потому что это первые тесты, которые будут запущены на сервере.

    Размещение приложения в Windows Store

    Тут мы подходим к кульминации!

    1. Вам необходим аккаунт разработчика приложений для Windows Store. Начать регистрацию можно по этой ссылке: https://appdev.microsoft.com/StorePortals/Account/Signup/Start/

  • При регистрации вам понадобится Microsoft Account (ранее LiveID). Убедитесь, что в нем правильно указан возраст и страна, из которой вы регистрируетесь.
  • Вам нужно будет выбрать тип аккаунта (индивидуальный или для компании).
  • При регистрации для подтверждения аккаунта будет необходимо привязать банковскую карточку, на которой на момент регистрации будет заблокирована некоторая сумма (около 30 рублей), после чего в процессе будет также заблокирована вторая случайная сумма (в небольшом диапазоне) – вам нужно будет выяснить эту сумму или код, указанный в транзакции, чтобы подтвердить свой аккаунт.
  • Важно: карта должна поддерживать платежи через интернет и вам будет необходимо иметь доступ к информации о заблокированных суммах.
  • Важно: представители Microsoft или Интуита не смогу вам подсказать, какие карточки и каких банков подходят или почему не подходит конкретно ваша в случае возникновения проблем. Эти вопросы необходимо решать с вашим банком и, возможно, службой поддержки Windows Store (getsupport.microsoft.com).
  • Регистрация в магазине приложений в качестве разработчика платная, однако, в рамках платной подписки MSDN, а также программ DreamSpark (http://dreamspark.ru) и BizSpark (http://ms-start.ru), если вы удовлетворяете условиям участия в них, вы можете получить код для бесплатной регистрации.
  • 2. После заведения и подтверждения аккаунта, можно приступать к процессу публикации приложения.

    Перейдите в информационную панель (https://appdev.microsoft.com/StorePortals/ru-ru/Home/Index) и выберите слева в меню пункт "Отправить приложение". Вам откроется страница создания описания приложения:

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

    В разделе "пакет приложения" вам будет необходимо передать сборку вашего приложения. Для этого перейдите к своему проекту в Visual Studio. В меню выберите пункт Project -> Store -> Create App Packages…

    Укажите "yes" и нажмите Sign In. Вам будет необходимо ввести данные своего аккаунта разработчика:

    После входа выберите имя своего приложения из числа зарезервированных и нажмите Next:

    Укажите, какие сборки необходимо собрать (если у вас нет явных причин на обратное, выбирайте Any CPU):

    Созданная сборка будет доступна внутри вашего проекта в папке AppPackages. Загрузите файл с расширением .appxupload на сертификацию в информационной панели.

    Добавьте описание приложения и скриншоты.

    Важно: все описание должно быть на том языке, которое у вас указано в настройках проекта. В манифесте приложения это пункт Default Language. Для приложений на русском там необходимо указать ru-RU.

    При необходимости добавьте заметки для инженеров.

    Наконец, можно отправлять на сертификацию!

    Далее остается дождаться прохождения всех тестов, либо, получив сообщение об обнаруженных ошибка, исправить недочеты и отправить еще раз свежую версию:

    Готово!

    Вернуться к учебному плану