- Включить высококонтрастные темы в Windows 10/8/7 2021
- How to uninstall Windows 10 and go back to Windows 8.1
- Высокие контрастные темы в Windows
- Высококонтрастные темы High contrast themes
- Словари тем Theme dictionaries
- Цвета с высокой контрастностью High contrast colors
- Когда следует использовать границы When to use borders
- Элементы списка List items
- Элементы списка с цветным текстом List items with colored text
- Обнаружение высокой контрастности Detecting high contrast
Включить высококонтрастные темы в Windows 10/8/7 2021
How to uninstall Windows 10 and go back to Windows 8.1
Темы с высокой контрастностью в Windows полезны для тех пользователей компьютеров, у которых есть недостаток зрения, так как они повышают контрастность текста, границ окон и изображений на экране , чтобы сделать их более заметными и более удобными для чтения и идентификации.
Windows 10/8 поддерживает соотношение высокой контрастности 14: 1 между передним и задним фонами. В более ранних версиях Windows высококонтрастный режим был ограничен темами под классическими темами, которые не были визуально оформлены. Но в Windows 8, Windows Server 2012 и более поздних версиях классический режим был удален и заменен визуально оформленными высококонтрастными темами.
Компоненты пользовательского интерфейса , которые меняются в высококонтрастных тем:
- Цвет фона фона
- Цвет текста
- Цвет гиперссылок
- Отключенный текст
- Выбранный текст цвета переднего и заднего фона
- Заголовок активного окна переднего плана и цвета фона
- Неактивное название окна переднего плана и цвета фона
- Цвет фона переднего плана и фона.
Высокие контрастные темы в Windows
Если вы хотите временно включить высококонтрастные темы , нажмите Левый Alt, Left Shift и Кнопки клавиатуры PrtScr . Вам будет предложено — Вы хотите включить высокий контраст .
Нажмите Да , и ваш дисплей будет изменен на высококонтрастный оттенок серого. Высокая контрастность улучшает читаемость дисплея, применяя специальную цветовую схему системы.
Чтобы вернуться к нормальной теме, снова нажмите Left Alt, Left Shift и PrtScr. Вы на мгновение будете мерцать, а затем снова увидите регулярную тему. Эта комбинация клавиш позволяет включать или отключать тему с высокой контрастностью.
Чтобы активировать или деактивировать эту комбинацию клавиш , вы можете посетить Панель управления Все элементы панели управления Доступность центра доступа Создать компьютер легче увидеть, чтобы изменить настройки.
Если вы хотите постоянно использовать тему с высоким контрастом , щелкните правой кнопкой мыши на рабочем столе и выберите «Персонализировать». Прокрутите вниз, чтобы просмотреть 4 невысокие контрастные темы.
Выберите нужную тему и примените ее.
Если вы хотите настроить тему с высоким контрастом , вы можете открыть Charms> Настройки ПК> Простота в Access> High Contrast.
В раскрывающемся списке выберите формат темы, а затем настройте цвета.
На экране компьютера теперь будет отображаться тема с высоким контрастом, которая облегчит вам чтение текста .
Некоторые приложения и браузеры также поддерживают поддержку высококонтрастного режима в Windows. Например, вот скриншот уведомления от Chrome, автоматически предлагающего установить высококонтрастное расширение и тему, как только вы переключите режим Windows 8 в высококонтрастный.
Существует также несколько высококонтрастных тем для различных приложений и программного обеспечения , доступный в виде бесплатных загрузок в Интернете.
Если вы слабовидящие, вы также можете изменить толщину курсора и мигание Windows 8, чтобы сделать его более заметным. Если вы хотите, вы можете проверить некоторые возможности Accessibility в Windows.
Высококонтрастные темы High contrast themes
Windows поддерживает темы с высокой контрастностью для операционной системы и приложений, которые пользователи могут включить. Windows supports high contrast themes for the OS and apps that users may choose to enable. В темах с высокой контрастностью используется небольшая палитра контрастных цветов, благодаря чему интерфейс хорошо видно. High contrast themes use a small palette of contrasting colors that makes the interface easier to see.
Калькулятор в светлой теме и в черной теме с высокой контрастностью. Calculator shown in light theme and High Contrast Black theme.
Для переключения на тему с высокой контрастностью последовательно щелкните Параметры > Специальные возможности > Высокая контрастность. You can switch to a high contrast theme by using Settings > Ease of access > High contrast.
Не путайте темы с высокой контрастностью со светлыми и темными темами. Последние представлены в гораздо более разнообразной цветовой палитре, которая не считается палитрой с высокой контрастностью. Don’t confuse high contrast themes with light and dark themes, which allow a much larger color palette that isn’t considered to have high contrast. Более подробные сведения о светлых и темных темах см. в статье о цвете. For more light and dark themes, see the article on color.
Стандартные элементы управления предоставляются с полной бесплатной поддержкой высокой контрастности, а вот при пользовательской настройке интерфейса следует проявлять осторожность. While common controls come with full high contrast support for free, care needs to be taken while customizing your UI. Самая распространенная ошибка в области высокой контрастности вызвана жестким программированием цвета в элементе управления. The most common high contrast bug is caused by hard-coding a color on a control inline.
Если цвет #E6E6E6 задан в самом элементе (см. первый пример), этот цвет фона будет использоваться во всех темах сетки. When the #E6E6E6 color is set inline in the first example, the Grid will retain that background color in all themes. Если пользователь переключается на черную тему с высокой контрастностью, ожидается, что у приложения будет черный фон. If the user switches to the High Contrast Black theme, they’ll expect your app to have a black background. Поскольку #E6E6E6 почти белый, некоторые пользователи не смогут взаимодействовать с вашим приложением. Since #E6E6E6 is almost white, some users may not be able to interact with your app.
Во втором примере расширение разметки используется для ссылки на цвет в коллекции ThemeDictionaries, которая представляет собой выделенное свойство элемента ResourceDictionary. In the second example, the
Словари тем Theme dictionaries
Если необходимо изменить цвет, заданный в системе по умолчанию, создайте для приложения коллекцию ThemeDictionaries. When you need to change a color from its system default, create a ThemeDictionaries collection for your app.
- Начните с создания надлежащих элементов подключения, если они еще не созданы. Start by creating the proper plumbing, if it doesn’t already exist. В App. XAML создайте коллекцию семедиктионариес , включая по крайней мере по умолчанию и HighContrast . In App.xaml, create a ThemeDictionaries collection, including Default and HighContrast at a minimum.
- В по умолчаниюсоздайте необходимый тип кисти , обычно это SolidColorBrush. In Default, create the type of Brush you need, usually a SolidColorBrush. Задайте ему имя x:Key, указывающее его предназначение. Give it a x:Key name specific to what it is being used for.
- Назначьте ему требуемое значение цвета Color. Assign the Color you want for it.
- Скопируйте этот инструмент Brush в HighContrast. Copy that Brush into HighContrast.
Наконец, нужно определить, какой цвет использовать в режиме высокой контрастности (см. следующий раздел). The last step is to determine what color to use in high contrast, which is covered in the next section.
HighContrast не является единственным доступным именем ключа. HighContrast is not the only available key name. Есть также хигхконтрастблакк, хигхконтраствхитеи хигхконтрасткустом. There’s also HighContrastBlack, HighContrastWhite, and HighContrastCustom. В большинстве случаев HighContrast будет достаточно. In most cases, HighContrast is all you need.
Цвета с высокой контрастностью High contrast colors
На странице Параметры > Специальные возможности > Высокая контрастность по умолчанию доступны 4 темы с высокой контрастностью. On the Settings > Ease of access > High contrast page, there are 4 high contrast themes by default.
После того как пользователь выберет один из параметров, на странице отображается образец для предварительного просмотра. After the user selects an option, the page shows a preview.
Можно щелкнуть каждый цветовой образец в предварительной версии, чтобы изменить его значение. Каждый образец также напрямую сопоставлен с ресурсом цвета XAML. Every color swatch on the preview can be clicked to change its value. Every swatch also directly maps to an XAML color resource.
Каждый ресурс SystemColor*Color представляет собой переменную, которая автоматически обновляет цвет, когда пользователь меняет высококонтрастные темы. Each SystemColor*Color resource is a variable that automatically updates color when the user switches high contrast themes. Ниже приведены рекомендации о том, где и когда использовать каждый ресурс. Following are guidelines for where and when to use each resource.
| Ресурс Resource | Использование Usage |
|---|---|
| SystemColorWindowTextColor SystemColorWindowTextColor | Основной текст, заголовки, списки; любой текст, с которым невозможно осуществлять взаимодействие Body copy, headings, lists; any text that can’t be interacted with |
| SystemColorHotlightColor SystemColorHotlightColor | Гиперссылки Hyperlinks |
| SystemColorGrayTextColor SystemColorGrayTextColor | Отключенный пользовательский интерфейс Disabled UI |
| SystemColorHighlightTextColor SystemColorHighlightTextColor | Основной цвет текста или элементов пользовательского интерфейса, которые в настоящее время выполняются, выбраны или участвуют во взаимодействии Foreground color for text or UI that’s in progress, selected, or currently being interacted with |
| SystemColorHighlightColor SystemColorHighlightColor | Фоновый цвет текста или элементов пользовательского интерфейса, которые в настоящее время выполняются, выбраны или участвуют во взаимодействии Background color for text or UI that’s in progress, selected, or currently being interacted with |
| SystemColorButtonTextColor SystemColorButtonTextColor | Основной цвет кнопок и любых элементов пользовательского интерфейса, с которыми можно осуществлять взаимодействие Foreground color for buttons; any UI that can be interacted with |
| SystemColorButtonFaceColor SystemColorButtonFaceColor | Фоновый цвет кнопок и любых элементов пользовательского интерфейса, с которыми можно осуществлять взаимодействие Background color for buttons; any UI that can be interacted with |
| SystemColorWindowColor SystemColorWindowColor | Фон страниц, областей, всплывающих окон и панелей Background of pages, panes, popups, and bars |
Часто полезно взглянуть на существующие приложения, меню «Пуск» и стандартные элементы управления, чтобы понять, как другие разработчики решают аналогичные задачи по созданию высококонтрастного интерфейса. It’s often helpful to look to existing apps, Start, or the common controls to see how others have solved high contrast design problems that are similar to your own.
Рекомендуется Do
- По возможности сохранять пары основных и фоновых цветов. Respect the background/foreground pairs where possible.
- Протестировать работающее приложение во всех 4 темах с высокой контрастностью. Test in all 4 high contrast themes while your app is running. После переключения тем не должно возникать необходимости в перезапуске приложения. The user should not have to restart your app when they switch themes.
- Соблюдать единообразие. Be consistent.
Не рекомендуется Don’t
- Выполнять жесткое кодирование цвета в теме HighContrast; используйте ресурсы SystemColor*Color. Hard code a color in the HighContrast theme; use the SystemColor*Color resources.
- Выберите ресурс цвета, исходя из эстетических предпочтений. Choose a color resource for aesthetics. Помните, что цвета меняются с темой! Remember, they change with the theme!
- Не используйте SystemColorGrayTextColor для основного текста, который является дополнительным или выступает в качестве подсказки. Don’t use SystemColorGrayTextColor for body copy that’s secondary or acts as a hint.
Чтобы продолжить предыдущий пример, необходимо выбрать ресурс для BrandedPageBackgroundBrush. To continue the earlier example, you need to pick a resource for BrandedPageBackgroundBrush. Поскольку имя указывает, что он будет использован для фона, имеет смысл выбрать SystemColorWindowColor. Because the name indicates that it will be used for a background, SystemColorWindowColor is a good choice.
Теперь можно задать фон в приложении. Later in your app, you can now set the background.
Обратите внимание, что ** < семересаурце >** используется дважды, один раз для ссылки на системколорвиндовколор и снова для ссылки на брандедпажебаккграундбруш. Note how is used twice, once to reference SystemColorWindowColor and again to reference BrandedPageBackgroundBrush. Оба необходимы для правильного использования темы в приложении во время выполнения. Both are required for your app to theme correctly at run time. Это хорошая возможность протестировать эту функциональность в вашем приложении. This is a good time to test out the functionality in your app. Фон сетки автоматически обновляется по мере переключения на высококонтрастную тему. The Grid’s background will automatically update as you switch to a high contrast theme. Фон также обновляется при переключении между разными высококонтрастными темами. It will also update when switching between different high contrast themes.
Когда следует использовать границы When to use borders
SystemColorWindowColor следует использовать для фона страниц, областей, всплывающих окон и панелей в режиме высокой контрастности. Pages, panes, popups, and bars should all use SystemColorWindowColor for their background in high contrast. Чтобы сохранить важные границы в пользовательском интерфейсе, при необходимости можно добавить границу высокой контрастности. Add a high contrast-only border where necessary to preserve important boundaries in your UI.
В области навигации и на странице один и тот же цвет фона имеет высокий контраст. Для разделения этих полей важно иметь границу с высокой контрастностью. The navigation pane and the page both share the same background color in high contrast. A high contrast-only border to divide them is essential.
Элементы списка List items
В режиме высокой контрастности для элементов в ListView при наведении, нажатии или выборе используется фон SystemColorHighlightColor. In high contrast, items in a ListView have their background set to SystemColorHighlightColor when they are hovered, pressed, or selected. Сложные элементы списка содержат ошибку, когда содержимое элемента списка не меняет цвет при наведении на элемент, нажатии или выборе элемента. Complex list items commonly have a bug where the content of the list item fails to invert its color when the item is hovered, pressed, or selected. В результате прочитать элемент невозможно. This makes the item impossible to read.
Простой список в светлой теме (слева) и высокая контрастность Черная тема (справа). Второй элемент выбран; Обратите внимание, что цвет текста инвертирован при высокой контрастности. A simple list in light theme (left) and High Contrast Black theme (right). The second item is selected; note how its text color is inverted in high contrast.
Элементы списка с цветным текстом List items with colored text
Одно из затруднений — настройка параметра TextBlock.Foreground в элементе DataTemplate представления списка. One culprit is setting TextBlock.Foreground in the ListView’s DataTemplate. Это обычно делается, чтобы установить визуальную иерархию. This is commonly done to establish visual hierarchy. Свойство Foreground настраивается в элементе ListViewItem, а элемент TextBlocks в шаблоне DataTemplate наследует правильный цвет фона при наведении на элемент, нажатии или выборе элемента. The Foreground property is set on the ListViewItem, and TextBlocks in the DataTemplate inherit the correct Foreground color when the item is hovered, pressed, or selected. Однако при настройке параметра Foreground наследование нарушается. However, setting Foreground breaks the inheritance.
Сложный список в светлой теме (слева) и высокая контрастность «Черная тема» (справа). В высоком контрасте не удалось обратить вторую строку выбранного элемента. Complex list in light theme (left) and High Contrast Black theme (right). In high contrast, the second line of the selected item failed to invert.
Чтобы решить эту проблему, можно условно настроить параметр Foreground в элементе Style, который находится в коллекции ThemeDictionaries. You can work around this by setting Foreground conditionally via a Style that’s in a ThemeDictionaries collection. Поскольку параметр Foreground не настраивается элементом SecondaryBodyTextBlockStyle из коллекции HighContrast, его цвет будет меняться правильно. Because the Foreground is not set by SecondaryBodyTextBlockStyle in HighContrast, its color will correctly invert.
Обнаружение высокой контрастности Detecting high contrast
Можно программным способом проверить, является ли текущая тема темой с высокой контрастностью, воспользовавшись элементами класса AccessibilitySettings. You can programmatically check if the current theme is a high contrast theme by using members of the AccessibilitySettings class.
Убедитесь, что конструктор AccessibilitySettings вызывается из области, в которой приложение инициализировано и уже отображает содержимое. Make sure you call the AccessibilitySettings constructor from a scope where the app is initialized and is already displaying content.
