Перенос среда выполнения Windows 8.x XAML и пользовательского интерфейса в 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 по умолчанию и повторно примените к ней настройку. Одним из примеров улучшения производительности является то, что любая граница , которая ранее заключена в ContentPresenter или панель, была удалена, а дочерний элемент теперь отображает границу.
Ниже приведены более конкретные примеры изменений элементов управления.
| Имя элемента управления | Изменение |
|---|---|
| AppBar | Если вы используете элемент управления AppBar (CommandBar рекомендуется вместо этого), он по умолчанию не скрыт в приложении Windows 10. Это можно контролировать с помощью свойства AppBar.ClosedDisplayMode. |
| AppBar, CommandBar | В приложении Windows 10 приложение AppBar и CommandBar имеют кнопку "Просмотреть больше " (многоточие). |
| CommandBar | В приложении среда выполнения Windows 8.x вторичная команда панели команд всегда отображается. В приложении Магазина Windows Phone и в приложении Windows 10 не отображается, пока панель команд не откроется. |
| CommandBar | Для приложения Магазина Windows Phone значение CommandBar.IsSticky не влияет на то, является ли панель легко уволенной. Если для приложения Windows 10 задано значение true, панель commandBar игнорирует жест закрытия света. |
| CommandBar | В приложении Windows 10 CommandBar не обрабатывает события EdgeGesture.Completed и UIElement.RightTapped. Он не реагирует на касание или проводите пальцем вверх. У вас по-прежнему есть возможность обрабатывать эти события и задавать IsOpen. |
| DatePicker, TimePicker | Просмотрите, как приложение выглядит с помощью визуальных изменений в DatePicker и TimePicker. Для приложения Windows 10, работающего на мобильном устройстве, эти элементы управления больше не переходить на страницу выбора, а вместо этого используйте всплывающее окно с легким закрытием. |
| DatePicker, TimePicker | В приложении Windows 10 невозможно поместить DatePicker или TimePicker в всплывающий элемент. Если вы хотите, чтобы эти элементы управления отображались в элементе управления всплывающего типа, можно использовать DatePickerFlyout и TimePickerFlyout. |
| GridView, ListView | Сведения об изменениях GridView и ListView см. в разделе "GridView/" и "ListView". |
| Узел | В приложении Магазина Windows Phone элемент управления концентратора обтекается от последнего раздела до первого. В приложении среда выполнения Windows 8.x и в приложении Windows 10 разделы концентраторов не обтекают. |
| Узел | В приложении Магазина Windows Phone фоновый образ элемента управления концентратора перемещается в параллаксе относительно разделов концентратора. В приложении среда выполнения Windows 8.x и в приложении Windows 10 параллакс не используется. |
| Узел | В приложении Universal 8.1 свойство HubSection.IsHeaderInteractive приводит к тому, что заголовок раздела ( и глиф шеврона, отрисованный рядом с ним), становится интерактивным . В приложении Windows 10 есть интерактивная возможность "Просмотреть больше" рядом с заголовком, но сам заголовок не является интерактивным. IsHeaderInteractive по-прежнему определяет, вызывает ли взаимодействие событие Hub.SectionHeaderClick . |
| MessageDialog | Если вы используете MessageDialog, попробуйте использовать более гибкий ContentDialog. Кроме того, ознакомьтесь с примером основы пользовательского интерфейса XAML. |
| ListPickerFlyout, PickerFlyout | ListPickerFlyout и PickerFlyout устарели для приложения Windows 10. Для единого всплывающего элемента выбора используйте MenuFlyout. Для более сложных возможностей используйте всплывающее меню. |
| PasswordBox | Свойство PasswordBox.IsPasswordRevealButtonEnabled устарело в приложении Windows 10 и не влияет. Вместо этого используйте PasswordBox.PasswordRevealMode, который по умолчанию используется для просмотра (в котором отображается глиф глаз, как в приложении среда выполнения Windows 8.x). Кроме того, ознакомьтесь с рекомендациями по полям паролей. |
| Сводка | Теперь элемент управления Pivot является универсальным, он больше не ограничивается использованием на мобильных устройствах. |
| SearchBox | Хотя SearchBox реализован в семействе универсальных устройств, он не полностью работает на мобильных устройствах. См . статью SearchBox, нерекомендуемую в пользу AutoSuggestBox. |
| SemanticZoom | Сведения об изменениях SemanticZoom см. в разделе "СемантикаЗоом". |
| ScrollViewer | Некоторые свойства ScrollViewer по умолчанию изменились. HorizontalScrollMode — Auto, VerticalScrollMode — Auto, и ZoomMode отключен. Если новые значения по умолчанию не подходят для приложения, их можно изменить либо в стиле, либо как локальные значения в самом элементе управления. |
| TextBox | В приложении среда выполнения Windows 8.x проверка орфографии по умолчанию отключена для TextBox. В приложении Магазина Windows Phone и в приложении Windows 10 он включен по умолчанию. |
| TextBox | Размер шрифта по умолчанию для TextBox изменился с 11 по 15. |
| TextBox | Значение по умолчанию TextBox.TextReadingOrder изменилось с Default на DetectFromContent. Если это нежелательно, используйте UseFlowDirection. Значение по умолчанию устарело. |
| Various | Цвет акцента применяется к приложениям Магазина Windows Phone и приложениям Windows 10, но не к среда выполнения Windows приложениям 8.x. |
Дополнительные сведения об элементах управления приложениями UWP см. в разделе "Элементы управления по функциям", "Список элементов управления" и "Рекомендации" для элементов управления.
Язык разработки в Windows 10
Существуют некоторые небольшие, но важные различия в языке разработки между универсальными приложениями 8.1 и приложениями Windows 10. Дополнительные сведения см. в разделе "Конструктор". Несмотря на изменения языка дизайна, наши принципы проектирования остаются последовательными: внимательно следите за деталями, но всегда стремитесь к простоте, фокусируя внимание на содержимом не хрома, яростно уменьшая визуальные элементы и оставаясь аутентичным в цифровом домене; используйте визуальную иерархию, особенно с типографией; проектирование в сетке; и принести свой опыт в жизнь с текучими анимациями.
Эффективные пиксели, расстояние просмотра и коэффициенты масштабирования
Ранее пиксели представления были способом абстрагировать размер и макет элементов пользовательского интерфейса от фактического физического размера и разрешения устройств. Теперь пиксели представления превратились в эффективные пиксели, и вот объяснение этого термина, что это означает, и дополнительное значение, которое он предлагает.
Термин "разрешение" относится к измерению плотности пикселей, а не, как обычно считается, число пикселей. "Эффективное разрешение" — это способ физических пикселей, составляющих изображение или глиф, разрешаемый глазу с учетом различий в расстоянии просмотра и физическом размере пикселя устройства (плотность пикселей, являющаяся взаимной размером физического пикселя). Эффективное разрешение — это хорошая метрика для создания взаимодействия, так как она ориентирована на пользователя. Понимая все факторы и контролируя размер элементов пользовательского интерфейса, вы можете сделать взаимодействие пользователя хорошим.
Разные устройства — это другое количество эффективных пикселей, начиная от 320 epx для наименьших устройств, до 1024 epx для монитора с скромным размером и далеко за пределами гораздо более высокой ширины. Все, что вам нужно сделать, — продолжать использовать элементы автомасштабирования и динамические панели макета, как всегда. Кроме того, в некоторых случаях свойства элементов пользовательского интерфейса будут иметь фиксированный размер в разметке XAML. Коэффициент масштабирования автоматически применяется к приложению в зависимости от того, на каком устройстве он работает, и параметры отображения, сделанные пользователем. И этот коэффициент масштабирования служит для сохранения любого элемента пользовательского интерфейса с фиксированным размером, отображающим более или менее константный сенсорный (и чтение) целевой объект для пользователя в различных размерах экрана. И вместе с динамическим макетом пользовательский интерфейс не будет просто оптическо масштабироваться на разных устройствах. Вместо этого необходимо указать соответствующее количество содержимого в доступном пространстве.
Чтобы приложение было лучше всего на всех дисплеях, рекомендуется создать каждый растровый ресурс в диапазоне размеров, каждый из которых подходит для определенного коэффициента масштабирования. Предоставление ресурсов на уровне 100%-scale, 200%-scale и 400%-scale (в этом порядке приоритета) дает отличные результаты в большинстве случаев во всех промежуточных коэффициентах масштабирования.
Примечание. Если , по какой-либо причине, нельзя создавать ресурсы в нескольких размерах, а затем создавать 100%-масштабируемые ресурсы. В Microsoft Visual Studio шаблон проекта по умолчанию для приложений UWP предоставляет ресурсы фирменной символики (изображения плиток и логотипы) только в одном размере, но они не 100%-масштабируются. При создании ресурсов для собственного приложения следуйте инструкциям в этом разделе и предоставьте 100%, 200 %, а также 400 % размеров и используйте пакеты ресурсов.
Если у вас есть сложные произведения искусства, то вам может потребоваться предоставить свои ресурсы в еще большем размере. Если вы начинаете с векторного искусства, то это относительно легко создавать высококачественные ресурсы на любом масштабируемом факторе.
Мы не рекомендуем поддерживать все факторы масштабирования, но полный список факторов масштабирования для приложений Windows 10 — 100%, 125%, 150%, 250%, 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 изменилось с auto на Disabled.
- Средство задания для 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 имеет значение Multiple, по умолчанию флажок отображается для каждого элемента. Параметр по умолчанию для элементов 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.
| 8.1 | Состояние функции | Windows 10/11 | Состояние функции |
|---|---|---|---|
| CommonStates | CommonStates | ||
| Обычная | Обычная | ||
| PointerOver | PointerOver | ||
| При нажатии | При нажатии | ||
| PointerOverPressed | [недоступно] | ||
| Выключено | [недоступно] | ||
| [недоступно] | PointerOverSelected | ||
| [недоступно] | Выбрано | ||
| [недоступно] | PressedSelected | ||
| [недоступно] | DisabledStates | ||
| [недоступно] | Выключено | ||
| [недоступно] | Включен | ||
| SelectionHintStates | [недоступно] | ||
| VerticalSelectionHint | [недоступно] | ||
| HorizontalSelectionHint | [недоступно] | ||
| NoSelectionHint | [недоступно] | ||
| [недоступно] | MultiSelectStates | ||
| [недоступно] | MultiSelectDisabled | ||
| [недоступно] | MultiSelectEnabled | ||
| SelectionStates | [недоступно] | ||
| Отмена выбора | [недоступно] | ||
| не выбрано | [недоступно] | ||
| UnselectedPointerOver | [недоступно] | ||
| UnselectedSwiping | [недоступно] | ||
| Выбрать | [недоступно] | ||
| Выбрано | [недоступно] | ||
| SelectedSwiping | [недоступно] | ||
| SelectedUnfocused | [недоступно] |
Если у вас есть пользовательский шаблон элемента управления 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. Но тот же стиль задает FontSize гораздо больше 24px в приложении Windows 10. Просмотрите проекты и макеты и используйте соответствующие стили в нужных местах. Дополнительные сведения см. в руководстве по шрифтам и приложениям UWP для разработки.
Это полный список ключей, которые больше не поддерживаются.
- CheckBoxAndRadioButtonMinWidthSize
- CheckBoxAndRadioButtonTextPaddingThickness
- ComboBoxFlyoutListPlaceholderTextOpacity
- ComboBoxFlyoutListPlaceholderTextThemeMargin
- ComboBoxHighlightedBackgroundThemeBrush
- ComboBoxHighlightedBorderThemeBrush
- ComboBoxHighlightedForegroundThemeBrush
- ComboBoxInlinePlaceholderTextForegroundThemeBrush
- ComboBoxInlinePlaceholderTextThemeFontWeight
- ComboBoxItemDisabledThemeOpacity
- ComboBoxItemHighContrastBackgroundThemeMargin
- ComboBoxItemMinHeightThemeSize
- ComboBoxPlaceholderTextBlockStyle
- ComboBoxPlaceholderTextThemeMargin
- CommandBarBackgroundThemeBrush
- CommandBarForegroundThemeBrush
- ContentDialogButton1HostPadding
- ContentDialogButton2HostPadding
- ContentDialogButtonsMinHeight
- ContentDialogContentLandscapeWidth
- ContentDialogContentMinHeight
- ContentDialogDimmingColor
- ContentDialogTitleMinHeight
- ControlContextualInfoTextBlockStyle
- ControlHeaderContentPresenterStyle
- ControlHeaderTextBlockStyle
- FlyoutContentPanelLandscapeThemeMargin
- FlyoutContentPanelPortraitThemeMargin
- GrabberMargin
- GridViewItemMargin
- GridViewItemPlaceholderBackgroundThemeBrush
- GroupHeaderTextBlockStyle
- HeaderContentPresenterStyle
- HighContrastBlack
- HighContrastWhite
- HubHeaderCharacterSpacing
- HubHeaderFontSize
- HubHeaderMarginThickness
- HubSectionHeaderCharacterSpacing
- HubSectionHeaderFontSize
- HubSectionHeaderMarginThickness
- HubSectionMarginThickness
- InlineWindowPlayPauseMargin
- ItemTemplate
- LeftFullWindowMargin
- LeftMargin
- ListViewEmptyStaticTextBlockStyle
- ListViewItemContentTextBlockStyle
- ListViewItemContentTranslateX
- ListViewItemMargin
- ListViewItemMultiselectCheckBoxMargin
- ListViewItemSubheaderTextBlockStyle
- ListViewItemTextBlockStyle
- MediaControlPanelAudioThemeBrush
- MediaControlPanelPhoneVideoThemeBrush
- MediaControlPanelVideoThemeBrush
- MediaControlPanelVideoThemeColor
- MediaControlPlayPauseThemeBrush
- MediaControlTimeRowThemeBrush
- MediaControlTimeRowThemeColor
- MediaDownloadProgressIndicatorThemeBrush
- MediaErrorBackgroundThemeBrush
- MediaTextThemeBrush
- MenuFlyoutBackgroundThemeBrush
- MenuFlyoutBorderThemeBrush
- MenuFlyoutLandscapeThemePadding
- MenuFlyoutLeftLandscapeBorderThemeThickness
- MenuFlyoutPortraitBorderThemeThickness
- MenuFlyoutPortraitThemePadding
- MenuFlyoutRightLandscapeBorderThemeThickness
- MessageDialogContentStyle
- MessageDialogTitleStyle
- MinWindowMargin
- PasswordBoxCheckBoxThemeMargin
- PhoneAccentBrush
- PhoneBackgroundBrush
- PhoneBackgroundColor
- PhoneBaseBlackColor
- PhoneBaseHighColor
- PhoneBaseLowColor
- PhoneBaseLowSolidColor
- PhoneBaseMediumHighColor
- PhoneBaseMediumMidColor
- PhoneBaseMediumMidSolidColor
- PhoneBaseMidColor
- PhoneBaseWhiteColor
- PhoneBorderThickness
- PhoneButtonBasePressedForegroundBrush
- PhoneButtonContentPadding
- PhoneButtonFontWeight
- PhoneButtonMinHeight
- PhoneButtonMinWidth
- PhoneChromeBrush
- PhoneChromeColor
- PhoneControlBackgroundColor
- PhoneControlDisabledColor
- PhoneControlForegroundColor
- PhoneDisabledBrush
- PhoneDisabledColor
- PhoneFontFamilyLight
- PhoneFontFamilySemiBold
- PhoneForegroundBrush
- PhoneForegroundColor
- PhoneHighContrastSelectedBackgroundThemeBrush
- PhoneHighContrastSelectedForegroundThemeBrush
- PhoneImagePlaceholderColor
- PhoneLowBrush
- PhoneMidBrush
- PhonePageBackgroundColor
- PhonePivotLockedTranslation
- PhonePivotUnselectedItemOpacity
- PhoneRadioCheckBoxBorderBrush
- PhoneRadioCheckBoxBrush
- PhoneRadioCheckBoxCheckBrush
- PhoneRadioCheckBoxPressedBrush
- PhoneStrokeThickness
- PhoneTextHighColor
- PhoneTextLowColor
- PhoneTextMidColor
- PhoneTextOverAccentColor
- PhoneTouchTargetLargeOverhang
- PhoneTouchTargetOverhang
- PivotHeaderItemPadding
- PlaceholderContentPresenterStyle
- ProgressBarHighContrastAccentBarThemeBrush
- ProgressBarIndeterminateRectagleThemeSize
- ProgressBarRectangleStyle
- ProgressRingActiveBackgroundOpacity
- ProgressRingElipseThemeMargin
- ProgressRingElipseThemeSize
- ProgressRingTextForegroundThemeBrush
- ProgressRingTextThemeMargin
- ProgressRingThemeSize
- RichEditBoxTextThemeMargin
- RightFullWindowMargin
- RightMargin
- ScrollBarMinThemeHeight
- ScrollBarMinThemeWidth
- ScrollBarPanningThumbThemeHeight
- ScrollBarPanningThumbThemeWidth
- SliderThumbDisabledBorderThemeBrush
- SliderTrackBorderThemeBrush
- SliderTrackDisabledBorderThemeBrush
- TextBoxBackgroundColor
- TextBoxBorderColor
- TextBoxDisabledHeaderForegroundThemeBrush
- TextBoxFocusedBackgroundThemeBrush
- TextBoxForegroundColor
- TextBoxPlaceholderColor
- TextControlHeaderMarginThemeThickness
- TextControlHeaderMinHeightSize
- TextStyleExtraExtraLargeFontSize
- TextStyleExtraLargePlusFontSize
- TextStyleMediumFontSize
- TextStyleSmallFontSize
- TimeRemainingElementMargin
SearchBox не рекомендуется использовать autoSuggestBox
Хотя SearchBox реализован в семействе универсальных устройств, он не полностью работает на мобильных устройствах. Используйте AutoSuggestBox для универсального поиска. Вот как вы обычно реализуете интерфейс поиска с помощью AutoSuggestBox.
Когда пользователь начнет вводить текст, вызывается событие TextChanged с причиной UserInput. Затем вы заполняете список предложений и задаете ItemsSource элемента AutoSuggestBox. Когда пользователь перемещается по списку, вызывается событие SuggestionChosen (и если задано TextMemberDisplayPath, текстовое поле заполняется автоматически указанным свойством). Когда пользователь отправляет выбор с помощью клавиши ВВОД, вызывается событие QuerySubmitted , в котором можно принять меры по этому предложению (в этом случае, скорее всего, переход на другую страницу с дополнительными сведениями об указанном содержимом). Обратите внимание, что свойства LanguageDetails и Language свойств SearchBoxQuerySubmittedEventArgs больше не поддерживаются (для поддержки этих функций существуют эквивалентные API). И KeyModifiers больше не поддерживается.
AutoSuggestBox также поддерживает редакторы методов ввода (IMEs). И, если вы хотите отобразить значок "найти", это также можно сделать (взаимодействие с значком приведет к возникновению события QuerySubmitted ).
<AutoSuggestBox ... >
<AutoSuggestBox.QueryIcon>
<SymbolIcon Symbol="Find"/>
</AutoSuggestBox.QueryIcon>
</AutoSuggestBox>
Кроме того, см . пример переноса autoSuggestBox.
Изменения 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 приложениях 8.x и приложениях Магазина Windows Phone язык по умолчанию для текста устанавливается на язык сборки или для en-us. В приложении Windows 10 язык по умолчанию устанавливается на верхний язык приложения (резервный шрифт). Вы можете явно задать FrameworkElement.Language , но вы будете пользоваться лучшим поведением резервного шрифта, если не задать значение для этого свойства.
Дополнительные сведения см. в руководстве по шрифтам и приложениям UWP для разработки. Кроме того, см. раздел "Элементы управления", приведенный выше, для изменения элементов управления текстом.
Изменения темы
Для универсального приложения 8.1 тема по умолчанию темна. Для устройств с Windows 10 тема по умолчанию изменилась, но вы можете управлять темой, используемой путем объявления запрошенной темы в App.xaml. Например, чтобы использовать темную тему на всех устройствах, добавьте RequestedTheme="Dark" в корневой элемент Application.
Плитки и тосты
Для плиток и точек шаблоны, которые вы используете в настоящее время, будут продолжать работать в приложении Windows 10. Но существуют новые адаптивные шаблоны, доступные для использования, и они описаны в уведомлениях, плитках, всплываемых элементах и значках.
Ранее на настольных компьютерах всплывающее уведомление было временным сообщением. Он исчезнет, и больше не будет извлечен, как только он был пропущен или проигнорирован. В Windows Phone, если всплывающее уведомление игнорируется или временно закрывается, он перейдет в Центр уведомлений. Теперь Центр уведомлений больше не ограничивается семейством мобильных устройств.
Чтобы отправить всплывающее уведомление, больше не нужно объявлять возможность.
Размер окна
Для универсального приложения 8.1 элемент манифеста приложения ApplicationView используется для объявления минимальной ширины окна. В приложении UWP можно указать минимальный размер (ширину и высоту) с помощью императивного кода. Минимальный размер по умолчанию составляет 500x320epx, и это также самый маленький минимальный размер, принятый. Максимальный минимальный размер, принятый, составляет 500x500epx.
Windows.UI.ViewManagement.ApplicationView.GetForCurrentView().SetPreferredMinSize
(new Size { Width = 500, Height = 500 });
Следующий раздел — перенос для модели ввода-вывода, устройства и приложения.
Обратная связь
Ожидается в ближайшее время: в течение 2024 года мы постепенно откажемся от GitHub Issues как механизма обратной связи для контента и заменим его новой системой обратной связи. Дополнительные сведения см. в разделе https://aka.ms/ContentUserFeedback.
Отправить и просмотреть отзыв по