Перенос XAML и пользовательского интерфейса среды выполнения Windows 8.x в UWP

Предыдущий раздел был посвящен устранению неполадок.

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

Императивный код

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

Адаптивный/отзывчивый пользовательский интерфейс

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

Обработка кнопки "Назад"

Для приложений универсальной версии 8.1 приложения среды выполнения Windows 8.x и приложения Магазина Windows Phone имеют различные подходы к отображаемму пользовательскому интерфейсу и событиям, которые вы обрабатываете для кнопки "Назад". Но для приложений Windows 10 можно использовать один подход в приложении. На мобильных устройствах кнопка предоставляется в виде сенсорной кнопки на устройстве или как кнопка в оболочке. На настольном устройстве вы добавляете кнопку к интерфейсу приложения, когда возможна навигация назад в приложении; это отображается в строке заголовка для оконных приложений или на панели задач для режима планшета (только для Windows 10). Событие кнопки "Назад" является универсальной концепцией для всех семейств устройств, и кнопки, реализованные в оборудовании или программном обеспечении, генерируют одинаковое событие BackRequested .

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

   // app.xaml.cs

    protected override void OnLaunched(LaunchActivatedEventArgs e)
    {
        [...]

        Windows.UI.Core.SystemNavigationManager.GetForCurrentView().BackRequested += App_BackRequested;
        rootFrame.Navigated += RootFrame_Navigated;
    }

    private void RootFrame_Navigated(object sender, NavigationEventArgs e)
    {
        Frame rootFrame = Window.Current.Content as Frame;

        // Note: On device families that have no title bar, setting AppViewBackButtonVisibility can safely execute 
        // but it will have no effect. Such device families provide back button UI for you.
        if (rootFrame.CanGoBack)
        {
            Windows.UI.Core.SystemNavigationManager.GetForCurrentView().AppViewBackButtonVisibility = 
                Windows.UI.Core.AppViewBackButtonVisibility.Visible;
        }
        else
        {
            Windows.UI.Core.SystemNavigationManager.GetForCurrentView().AppViewBackButtonVisibility = 
                Windows.UI.Core.AppViewBackButtonVisibility.Collapsed;
        }
    }

    private void App_BackRequested(object sender, Windows.UI.Core.BackRequestedEventArgs e)
    {
        Frame rootFrame = Window.Current.Content as Frame;

        if (rootFrame.CanGoBack)
        {
            rootFrame.GoBack();
        }
    }

Существует также единый подход ко всем семействам устройств для программного выхода из приложения.

   Windows.UI.Xaml.Application.Current.Exit();

Прелести

Вам не нужно изменять код, который интегрируется с шармами, но вам нужно добавить в приложение некоторый пользовательский интерфейс, чтобы занять место панели "Шармы", которая не является частью оболочки Windows 10. Универсальное приложение 8.1, работающее в Windows 10, имеет собственный пользовательский интерфейс замены, предоставляемый системным хромом в строке заголовка приложения.

Элементы управления, стили и шаблоны элементов управления

Универсальное приложение 8.1, работающее в Windows 10, сохранит внешний вид и поведение 8.1 в отношении элементов управления. Но при переносе этого приложения в приложение Windows 10 существуют некоторые различия в внешнем виде и поведении, о которых следует знать. Архитектура и дизайн элементов управления практически не изменились для приложений Windows 10, поэтому изменения в основном связаны с языком разработки, упрощением и удобством использования.

Примечание визуальное состояние PointerOver относится к пользовательским стилям и шаблонам в приложениях Windows 10 и в приложениях среды выполнения Windows 8.x, но не в приложениях для Магазина Windows Phone. По этой причине (и из-за системных ключей ресурсов, поддерживаемых для приложений Windows 10), рекомендуется повторно использовать настраиваемые стили и шаблоны из приложений среды выполнения Windows 8.x при переносе приложения в Windows 10. Если вы хотите быть уверены, что пользовательские стили и шаблоны используют последний набор визуальных состояний и получают преимущества от улучшений производительности, внесенных в стили и шаблоны по умолчанию, а затем измените копию нового шаблона Windows 10 по умолчанию и повторно примените к ней настройку. Одним из примеров улучшения производительности является то, что любая граница Border, которая ранее окружала ContentPresenter или панель, была удалена, и теперь дочерний элемент отображает границу.

Ниже приведены более конкретные примеры изменений элементов управления.

Дополнительные сведения об элементах управления приложениями UWP см. в разделе Controls by function, Controls listи Guidelines for controls.

Язык разработки в Windows 10

Существуют некоторые небольшие, но важные различия в языке разработки между универсальными приложениями 8.1 и приложениями Windows 10. Дополнительные сведения см. в разделе Дизайн. Несмотря на изменения языка дизайна, наши принципы проектирования остаются неизменными: внимательно следите за деталями, но всегда стремитесь к простоте, сосредотачиваясь на содержимом, а не на визуальной оболочке, стремительно уменьшая визуальные элементы и оставаясь аутентичным в цифровой среде; используйте визуальную иерархию, особенно в типографике; проектируйте по сетке; и оживите свои проекты с помощью плавных анимаций.

Эффективные пиксели, расстояние просмотра и коэффициенты масштабирования

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

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

Разные устройства имеют различное число эффективных пикселей в ширину, начиная от 320 epx для наименьших устройств, до 1024 epx для монитора со скромным размером и много больше для более широких экранов. Все, что вам нужно сделать, — продолжать использовать автоматически масштабируемые элементы и динамические панели макета, как вы всегда это делали. Кроме того, в некоторых случаях свойства элементов пользовательского интерфейса будут иметь фиксированный размер в разметке XAML. Коэффициент масштабирования автоматически применяется к приложению в зависимости от того, на каком устройстве он работает, и параметры отображения, сделанные пользователем. И этот коэффициент масштабирования служит для того, чтобы любой элемент пользовательского интерфейса с фиксированным размером сохранял более или менее постоянный размер сенсорной и зрительной области для пользователя на различных экранах. И вместе с динамическим макетом пользовательский интерфейс не будет просто оптическо масштабироваться на разных устройствах. Она сделает все необходимое, чтобы поместить нужное количество контента в доступное пространство.

Чтобы приложение было лучше всего на всех дисплеях, рекомендуется создать каждый растровый ресурс в диапазоне размеров, каждый из которых подходит для определенного коэффициента масштабирования. Предоставление ресурсов в 100%-scale, 200%-scale и 400%-scale (в этом порядке приоритета) даст вам отличные результаты в большинстве случаев во всех промежуточных коэффициентах масштабирования.

Примечание Если по какой-либо причине невозможно создать ресурсы в нескольких размерах, создайте 100 ресурсов в масштабе%. В Microsoft Visual Studio шаблон проекта по умолчанию для приложений UWP предоставляет ресурсы фирменной символики (изображения плиток и логотипы) только в одном размере, но не 100%-scale. При создании ресурсов для собственного приложения следуйте инструкциям в этом разделе и предоставьте 100%, 200%и 400% размеров и используйте пакеты ресурсов.

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

Мы не рекомендуем поддерживать все факторы масштабирования, но полный список факторов масштабирования для приложений Windows 10 — 100%, 125%, 150%, 200%, 250%, 300%и 400%. Если вы предоставите их, Магазин выберет ресурсы правильного размера для каждого устройства, и загрузятся только они. Магазин выбирает ресурсы для скачивания на основе DPI устройства. Вы можете повторно использовать ресурсы из приложения среды выполнения Windows 8.x на основе факторов масштабирования, таких как 140% и 220%, но ваше приложение будет работать на одном из новых факторов масштабирования, поэтому масштабирование растрового изображения будет неизбежно. Проверьте приложение на нескольких устройствах, чтобы узнать, удовлетворены ли вы результатами в вашем случае.

Вы можете повторно использовать разметку XAML из приложения среды выполнения Windows 8.x, где в разметке используются литеральные значения измерений (возможно, для размера фигур или других элементов, возможно, для типографии). Но в некоторых случаях на устройстве используется более крупный коэффициент масштабирования для приложения Windows 10, чем для универсального приложения 8.1 (например, 150% используется, где раньше было 140%, а 200% используется, где было 180%). Таким образом, если вы обнаружите, что эти литеральные значения теперь слишком большие в Windows 10, то попробуйте умножить их на 0,8. Дополнительные сведения см. в разделе Адаптивный дизайн 101 для приложений UWP.

Изменения GridView и ListView

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

• Установщик для ScrollViewer.HorizontalScrollBarVisibility изменился с Автоматически на Выключено.
• Установщик для ScrollViewer.VerticalScrollBarVisibility изменился с Отключено на Авто.
• Установщик для ScrollViewer.HorizontalScrollMode был изменен с Включено на Отключено.
• Установщик для ScrollViewer.VerticalScrollMode изменился с выключено на включено.
• В методе задания для ItemsPanelзначение ItemsWrapGrid.Orientation изменилось с Вертикальной на горизонтальной.

Если это последнее изменение (изменение на Ориентация) кажется противоречивым, помните, что мы говорим об оболочечной сетке. Горизонтальная сетка оболочки (новое значение) аналогична системе письма, в которой текст льется по горизонтали и переходит на следующую строку в конце страницы. Страница текста прокручивается по вертикали. И наоборот, вертикально ориентированная сетка оболочки (предыдущее значение) аналогична системе письма, где текст протекает вертикально, а потому прокручивается по горизонтали.

Ниже приведены аспекты GridView и ListView, которые имеют изменения или не поддерживаются в Windows 10.

• Свойство IsSwipeEnabled (только приложения среды выполнения Windows 8.x) не поддерживается для приложений Windows 10. API по-прежнему присутствует, но настройка не влияет. Все предыдущие жесты выбора поддерживаются, кроме свайпа вниз (который не поддерживается, так как данные показывают, что он неочевиден) и щелчка правой кнопкой мыши (который зарезервирован для отображения контекстного меню).
• Свойство ReorderMode (только приложения Магазина Windows Phone) не поддерживается для приложений Windows 10. API по-прежнему присутствует, но настройка не влияет. Вместо этого установите для AllowDrop и CanReorderItems значение true на вашем GridView или ListView, и тогда пользователь сможет переупорядочить элементы, используя жест нажатия и удержания (или жест перетаскивания).
• При разработке для Windows 10 используйте ListViewItemPresenter вместо GridViewItemPresenter в стиле контейнера элементов как для ListView, так и для GridView. При изменении копии стилей контейнеров элементов по умолчанию вы получите правильный тип.
• Визуальные элементы выбора изменились для приложения Windows 10. Если вы установите SelectionMode в режим "несколько" , то по умолчанию флажок отображается для каждого элемента. Параметр по умолчанию для элементов ListView означает, что флажок размещается рядом с элементом, а в результате пространство, занятое остальным элементом, будет немного сокращено и смещено. Для элементов GridView флажок по умолчанию накладывается поверх элемента. Но в любом случае можно управлять макетом (инлайн или оверлей) флажков (с помощью свойства CheckMode) и тем, отображаются ли они вообще (с помощью свойства SelectionCheckMarkVisualEnabled) в элементе ListViewItemPresenter внутри стиля вашего контейнера для элементов, как показано в примере ниже.
• В Windows 10 событие ContainerContentChanging вызывается дважды на элемент во время виртуализации пользовательского интерфейса: один раз для восстановления и один раз для повторного использования. Если значение InRecycleQueue равно true и у вас нет особых действий по освобождению, вы можете немедленно выйти из обработчика событий с уверенностью, что он будет запущен повторно при повторном использовании этого элемента (когда InRecycleQueue станет false).

<Style x:Key="CustomItemContainerStyle" TargetType="ListViewItem|GridViewItem">
    ...
    <Setter.Value>
        <ControlTemplate TargetType="ListViewItem|GridViewItem">
            <ListViewItemPresenter CheckMode="Inline|Overlay" ... />
        </ControlTemplate>
    </Setter.Value>
    ...
</Style>

ListViewItemPresenter с встроенной галочкой

Элемент ListViewItemPresenter с наложенным флажоком

• При удалении жестов прокрутки вниз и щелчка правой кнопкой мыши для выбора (по указанным выше причинам) модель взаимодействия изменилась, и одним из последствий этого является то, что события ItemClick и SelectionChanged больше не являются взаимоисключающими. Для вашего приложения Windows 10 пересмотрите свои сценарии и решите, следует ли принять модель взаимодействия "выбор" или "вызов". Дополнительные сведения см. в разделе Изменение режима взаимодействия.
• Существуют некоторые изменения свойств, используемых для стиля ListViewItemPresenter. Свойства новые: CheckBoxBrush, PressedBackground, SelectedPressedBackgroundи FocusSecondaryBorderBrush. Свойства, игнорируемые для приложения Windows 10, (используйте ContentMargin), CheckHintBrush, CheckSelectingBrush, PointerOverBackgroundMargin, ReorderHintOffset, SelectedBorderThicknessи SelectedPointerOverBorderBrush.

В этой таблице описываются изменения визуальных состояний и групп визуальных состояний в шаблонах управления ListViewItem и GridViewItem.

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

• Добавьте новую группу визуальных состояний MultiSelectStates.
• Добавьте новое визуальное состояние MultiSelectDisabled.
• Добавьте новое визуальное состояние MultiSelectEnabled.
• Добавьте новую группу визуальных состояний DisabledStates.
• Добавьте новое визуальное состояние включено.
• В группе визуальных состояний CommonStates удалите визуальное состояние PointerOverPressed.
• Переместите визуальное состояние "Отключено" в группу визуальных состояний DisabledStates.
• Добавьте новое визуальное состояние PointerOverSelected.
• Добавьте новое визуальное состояние PressedSelected.
• Удалите группу визуальных состояний SelectedHintStates.
• В группе визуальных состояний SelectionStates переместите выбранное визуальное состояние в группу визуальных состояний CommonStates.
• Удалите всю группу визуальных состояний SelectionStates.

Локализация и глобализация

Вы можете повторно использовать файлы Resources.resw из проекта универсальной версии 8.1 в проекте приложения UWP. После копирования файла добавьте его в проект и установите действия сборки как PRIResource и Копировать в выходной каталог на не копировать. В разделе ResourceContext.QualifierValues описывается, как загружать ресурсы, специфичные для семейства устройств, на основе фактора выбора ресурса для данного семейства устройств.

Играть в

API-интерфейсы в Windows.Media.PlayTo пространства имен устарели для приложений Windows 10 в пользу API Windows.Media.Casting.

Ключи ресурсов и размеры стилей TextBlock

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

В других случаях ключи ресурсов больше не поддерживаются. Редактор разметки XAML в Visual Studio выделяет ссылки на ключи ресурсов, которые не могут быть разрешены. Например, редактор разметки XAML будет подчеркивать ссылку на ключ стиля ListViewItemTextBlockStyle с красной волнистой линией. Если это не исправлено, приложение немедленно завершится при попытке развернуть его в эмуляторе или устройстве. Поэтому важно учитывать правильность разметки XAML. И вы найдете, что Visual Studio — отличный инструмент для обнаружения таких проблем.

Для ключей, которые по-прежнему поддерживаются, изменения языка конструктора означают, что свойства, заданные некоторыми стилями, изменились. Например, TitleTextBlockStyle задает FontSize значение 14,667px в приложении среды выполнения Windows 8.x и 18.14px в приложении Магазина Windows Phone. Но тот же стиль задает размер шрифта равным 24 пикселям в приложении Windows 10. Просмотрите проекты и макеты и используйте соответствующие стили в нужных местах. Для получения дополнительной информации см. руководство по шрифтам и конструированию приложений UWP .

Это полный список ключей, которые больше не поддерживаются.

• CheckBoxAndRadioButtonMinWidthSize (Минимальная ширина для CheckBox и RadioButton)
• Отступ текста для флажка и переключателя
• ПрозрачностьТекстаЗаполнителяComboBoxFlyoutList
• ComboBoxFlyoutListPlaceholderTextThemeMargin
• ComboBoxHighlightedBackgroundThemeBrush
• ComboBoxHighlightedBorderThemeBrush
• ComboBoxHighlightedForegroundThemeBrush
• ComboBoxInlinePlaceholderTextForegroundThemeBrush (кисть темы цвета текста-заполнителя)
• КомбоБоксВстроенныйТекстЗаполнителяТемаЖирностьШрифта
• НепрозрачностьТемыОтключенногоЭлементаComboBox
• ПолеОтступаТемыФонаВКонтрастномРежимеВыбранногоЭлементаКомбоБокса
• ComboBoxItemMinHeightThemeSize
• Стиль блока текста-заполнителя для ComboBox
• ComboBoxPlaceholderTextThemeMargin
• CommandBarBackgroundThemeBrush
• CommandBarForegroundThemeBrush
• ContentDialogButton1HostPadding
• ПараметрыОтступовКнопки2ContentDialogHost
• МинимальнаяВысотаКнопокДиалогаСодержимого (ContentDialogButtonsMinHeight)
• ШиринаПейзажногоРежимаContentDialogContent
• МинимальнаяВысотаКонтентаДиалоговогоОкна
• Цвет затемнения диалога содержимого
• МинимальнаяВысотаЗаголовкаДиалогаСодержания
• ControlContextualInfoTextBlockStyle
• ControlHeaderContentPresenterStyle
• ControlHeaderTextBlockStyle
• FlyoutContentPanelLandscapeThemeMargin
• FlyoutContentPanelPortraitThemeMargin
• GrabberMargin
• ~GridViewItemMargin (отступ элемента GridView)~
• Кисть_темы_фона_заполнителя_элемента_GridView
• СтильТекстовогоБлокаЗаголовкаГруппы
• HeaderContentPresenterStyle
• Высококонтрастное чёрное
• HighContrastWhite
• Межбуквенный интервал заголовка домашней страницы
• РазмерШрифтаЗаголовкаХаба
• HubHeaderMarginThickness
• HubSectionHeaderCharacterSpacing
• HubSectionHeaderFontSize
• ТолщинаОтступаЗаголовкаСекцииХаба
• HubSectionMarginThickness
• InlineWindowPlayPauseMargin
• Шаблон элемента
• ЛеваяПолнаяГраницаОкна
• Левое поле
• ListViewEmptyStaticTextBlockStyle
• Стиль текста блока содержания элемента ListView
• ListViewItemContentTranslateX
• Отступ элемента списка
• ListViewItemMultiselectCheckBoxMargin
• ListViewItemSubheaderTextBlockStyle
• ListViewItemTextBlockStyle
• MediaControlPanelAudioThemeBrush
• Панель управления медиа на телефоне: кисть видеотемы
• MediaControlPanelVideoThemeBrush
• MediaControlPanelVideoThemeColor
• Элемент управления воспроизведением и паузой (MediaControlPlayPauseThemeBrush)
• MediaControlTimeRowThemeBrush
• MediaControlTimeRowThemeColor
• MediaDownloadProgressIndicatorThemeBrush
• MediaErrorBackgroundThemeBrush
• MediaTextThemeBrush
• ТемаФонаКонтекстногоМенюЩетка
• MenuFlyoutBorderThemeBrush
• Темы Padding в ландшафтном режиме для всплывающего меню
• MenuFlyoutЛевыйАльбомныйТолщинаТемыГраницы
• MenuFlyoutТолщинаТемыПортретнойГраницы
• Тема отступов в портретной ориентации для MenuFlyout
• MenuFlyoutRightLandscapeBorderThemeThickness
• Стиль содержимого диалога сообщения
• СтильЗаголовкаДиалогаСообщения
• МинимальныйОтступОкна
• ПасвордБоксЧекБоксТемаОтступ
• PhoneAccentBrush
• Фоновая кисть телефона
• Цвет фона телефона
• PhoneBaseBlackColor
• PhoneBaseHighColor
• PhoneBaseLowColor
• БазаТелефонаНизкаяОднотонныйЦвет
• ТелефонБазаСреднийВысокийЦвет
• PhoneBaseMediumMidColor
• ТелефонБазаСреднийОднотонныйЦвет
• PhoneBaseMidColor
• База телефона белого цвета
• толщина границы телефона
• КистьНажатойКнопкиТелефонаПереднийПлан
• ОтступСодержимогоКнопкиТелефона
• ВесШрифтаКнопкиТелефона
• МинимальнаяВысотаКнопкиТелефона
• МинимальнаяШиринаКнопкиТелефона
• Щетка Chrome для телефона
• PhoneChromeColor
• PhoneControlBackgroundColor
• ЦветВыключенногоЭлементаТелефона
• PhoneControlForegroundColor
• Кисть для отключенного телефона
• ЦветОтключенногоТелефона
• PhoneFontFamilyLight
• PhoneFontFamilySemiBold
• PhoneForegroundBrush
• ЦветПереднегоПланаТелефона
• КистьТемаВыбранногоФонаВКонтрастномРежимеТелефона
• КистьТемойВыбранногоПереднегоПланаПриВысокомКонтрастеТелефона
• ЦветЗаполнителяИзображенияТелефона
• ТелефонНизкаяЩеточка
• ФонМидБраш
• Цвет фона страницы телефона
• PhonePivotLockedTranslation
• ПрозрачностьНеВыбранногоЭлементаPivotТелефона
• КистьГраницыФлажкаТелефонаРадио
• PhoneRadioCheckBoxBrush
• ТелефонРадиоФлажокКистьПроверки
• ТелефонРадиоФлажокНажатиеКисть
• ТолщинаКонтурТелефона
• Высокий цвет текста телефона
• ТелефонТекстНизкийЦвет
• PhoneTextMidColor
• Телефонный текст поверх цвета акцента
• Большой вылет сенсорного экрана телефона
• Перекрытие зоны касания телефона
• ПолеЗаголовкаЭлементаPivot
• СтильПредставленияСодержимогоЗаполнителя
• ProgressBarHighContrastAccentBarThemeBrush
• РазмерТемыНеопределенногоПрямоугольникаИндикатораПрогресса
• ProgressBarRectangleStyle
• ProgressRingActiveBackgroundOpacity (ПрозрачностьАктивногоФонаКольцаПрогресса)
• ProgressRingElipseThemeMargin
• ProgressRingElipseThemeSize
• ПрогрессКольцоТекстЦветТемаКисть
• ProgressRingTextThemeMargin
• РазмерТемыКольцаПрогресса
• RichEditBoxTextThemeMargin
• ПраваяГраницаПолногоОкна
• RightMargin
• Минимальная высота темы полосы прокрутки (ScrollBarMinThemeHeight)
• Минимальная ширина темы полосы прокрутки
• ВысотаТемыПолзункаДляПрокрутки
• ШиринаТемыПолзункаПрокруткиPanning
• КистьТемыОтключеннойГраницыПолзунка
• SliderTrackBorderThemeBrush
• Тематическая кисть для отключенной границы трека ползунка
• TextBoxBackgroundColor
• ЦветГраницыТекстовогоПоле
• КистьТемыЦветаЗаголовкаОтключенногоТекстовогоПоле
• Тема фоновой кисти фокусировки TextBox
• ЦветПереднегоПланаТекстовогоПоля
• Цвет заполнителя текстового поля
• ТолщинаТемыПоляЗаголовкаТекстовогоКонтрола
• МинимальнаяВысотаЗаголовкаЭлементаУправленияТекстом
• РазмерШрифтаЭкстраЭкстраБольшой
• TextStyleExtraLargePlusFontSize
• РазмерСреднегоШрифтаСтиляТекста
• ТекстСтильМаленькийРазмерШрифта
• ПолеЭлементаОставшегосяВремени

SearchBox устаревшая в пользу AutoSuggestBox

Хотя SearchBox реализована в семействе универсальных устройств, она не полностью работает на мобильных устройствах. Используйте AutoSuggestBox для универсального поиска. Вот как обычно реализуется интерфейс поиска с помощью AutoSuggestBox.

Когда пользователь начнет вводить текст, вызывается событие TextChanged с причиной UserInput. Затем вы заполняете список предложений и задаете ItemsSourceAutoSuggestBox. Когда пользователь перемещается по списку, вызывается событие SuggestionChosen (и если задано TextMemberDisplayPath, текстовое поле автоматически заполняется указанным свойством). Когда пользователь отправляет выбор с помощью клавиши ВВОД, возникает событие QuerySubmitted, и в этот момент можно предпринять действия в соответствии с предложением (в этом случае, скорее всего, перейти на другую страницу с дополнительными сведениями об указанном содержимом). Обратите внимание, что свойства LinguisticDetails и Language объекта SearchBoxQuerySubmittedEventArgs больше не поддерживаются (существуют эквивалентные API для этой функциональности). И KeyModifiers больше не поддерживается.

AutoSuggestBox также поддерживает редакторы методов ввода (IMEs). Если вы хотите отобразить значок "поиск", вы можете это сделать (взаимодействие с значком приведет к возникновению события QuerySubmitted).

   <AutoSuggestBox ... >
        <AutoSuggestBox.QueryIcon>
            <SymbolIcon Symbol="Find"/>
        </AutoSuggestBox.QueryIcon>
    </AutoSuggestBox>

Кроме того, см. пример переноса AutoSuggestBox.

Изменения SemanticZoom

Жест уменьшения масштаба для SemanticZoom стандартизировался в модель Windows Phone, которая подразумевает нажатие или щелчок по заголовку группы (поэтому на настольных компьютерах иконка минуса для уменьшения масштаба больше не отображается). Теперь мы получаем одинаковое, согласованное поведение бесплатно на всех устройствах. Одно из косметических различий модели Windows Phone заключается в том, что уменьшенное представление (список переходов) заменяет увеличенное представление, а не накладывается на него. По этой причине можно удалить все непрозрачные фоны из представлений с увеличением масштаба.

В приложении Магазина Windows Phone увеличенное представление расширяется до размера экрана. В приложении среды выполнения Windows 8.x и в приложении Windows 10 размер увеличенного представления ограничен границами элемента управления SemanticZoom.

В приложении Магазина Windows Phone содержимое за уменьшенным представлением (в z-порядке) просвечивает, если уменьшенное представление имеет какую-либо прозрачность в фоне. В приложении среды выполнения Windows 8.x и в приложении Windows 10 ничего не отображается за увеличенным представлением.

В приложении для среды выполнения Windows 8.x, когда приложение деактивируется и снова активируется, уменьшенное представление закрывается (если оно отображалось) и отображается увеличенное представление. В приложении Магазина Windows Phone и в приложении Windows 10 увеличенное представление будет отображаться, если оно показывалось.

В приложении Магазина Windows Phone и в приложении с Windows 10 увеличенное представление закрывается при нажатии кнопки "Назад". Для приложения среды выполнения Windows 8.x нет встроенной обработки кнопки назад, поэтому вопрос не применяется.

Настройки

Класс SettingsPane среды выполнения Windows 8.x не подходит для Windows 10. Вместо этого, помимо создания страницы параметров, вы должны предоставить пользователям способ доступа к нему из приложения. Мы рекомендуем отобразить эту страницу настроек приложения на верхнем уровне, в качестве последнего закрепленного элемента на панели навигации. Вот полный список ваших параметров.

• Область навигации. Параметры должны быть последним элементом в списке вариантов навигации и закреплены внизу.
• Панель приложения или панель инструментов (в представлении вкладок или в поворотном макете). Параметры должны быть последним элементом во всплывающем меню панели приложений или панели инструментов. Настройкам не рекомендуется быть одним из элементов верхнего уровня в области навигации.
• Втулка. Параметры должны находиться внутри выпадающего меню (могут быть в меню приложения или на панели инструментов в макете Концентратора).

Также не рекомендуется скрывать параметры в панели с основными и дополнительными сведениями.

Страница "Параметры" должна заполнять все окно вашего приложения, а страница "Параметры" также находится в том месте, где должны находиться сведения и отзывы. Инструкции по проектированию страницы параметров см. в руководствах по параметрам приложения.

Текст

Текст (или типография) является важным аспектом приложения UWP и при переносе может потребоваться пересмотреть визуальные макеты ваших представлений, чтобы они были в гармонии с новым языком дизайна. Используйте эти иллюстрации, чтобы найти доступные стили системы для TextBlock на универсальной платформе Windows (UWP). Найдите те, которые соответствуют использованным стилям Windows Phone Silverlight. Кроме того, вы можете создать собственные универсальные стили и скопировать свойства из системных стилей Windows Phone Silverlight в них.

стили
Стили System TextBlock для приложений Windows 10

В приложениях среды выполнения Windows 8.x и приложениях Магазина Windows Phone семейство шрифтов по умолчанию — глобальный пользовательский интерфейс. В приложении Windows 10 семейство шрифтов по умолчанию — segoe UI. В результате метрики шрифтов в приложении могут выглядеть иначе. Если вы хотите воспроизвести внешний вид текста 8.1, можно задать собственные метрики с помощью таких свойств, как LineHeight и LineStackingStrategy.

В приложениях Windows Runtime 8.x и приложениях Магазина Windows Phone язык текста по умолчанию устанавливается на язык сборки или на en-us. В приложении Windows 10 язык по умолчанию устанавливается на верхний язык приложения (резервный шрифт). Вы можете явно задать FrameworkElement.Language, но лучше использовать резервное поведение шрифта, если значение этого свойства не задано.

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

Изменения темы

Для универсального приложения 8.1 тема по умолчанию темна. Для устройств с Windows 10 тема по умолчанию изменилась, но вы можете управлять темой, используемой путем объявления запрошенной темы в App.xaml. Например, чтобы использовать темную тему на всех устройствах, добавьте RequestedTheme="Dark" в корневой элемент Application.

Плитки и тосты

Для плиток и уведомлений шаблоны, которые вы используете в настоящее время, будут по-прежнему работать в вашем приложении Windows 10. Но существуют новые адаптивные шаблоны, доступные для использования, и они описаны в уведомления, плитки, всплывающие элементы и значки.

Ранее на настольных компьютерах тост-уведомление было временным сообщением. Он исчезнет и больше не будет извлекаем, если его пропустили или проигнорировали. На Windows Phone, если всплывающее уведомление игнорируется или временно закрывается, оно попадает в Центр уведомлений. Теперь "Action Center" больше не ограничен семейством мобильных устройств.

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

Размер окна

Для универсального приложения 8.1 элемент манифеста приложения ApplicationView используется для объявления минимальной ширины окна. В приложении UWP можно указать минимальный размер (ширину и высоту) с помощью императивного кода. Минимальный размер по умолчанию составляет 500x320epx, и это также самый маленький минимальный размер, принятый. Максимальный минимальный размер, принятый, составляет 500x500epx.

   Windows.UI.ViewManagement.ApplicationView.GetForCurrentView().SetPreferredMinSize
        (new Size { Width = 500, Height = 500 });

Следующая тема: Портирование для ввода-вывода, устройства и модели приложений.