через ползунки;
Ползунок – это элемент управления, который позволяет пользователю выбирать значение из диапазона путем перемещения бегунка по дорожке.
Выбор правильного элемента управления
Чтобы пользователи могли задавать установленные значения из непрерывного диапазона (например, громкость или яркость) или диапазона дискретных значений (например, параметры разрешения экрана), применяйте элемент управления Slider.
Ползунок рекомендуется использовать, если вы уверены, что пользователи представляют значение в виде относительной величины, а не определенного числа. Например: как правило, пользователи хотят уменьшить громкость до минимума или наполовину, а не задать значение 2 или 5.
Не используйте ползунок, если у вас всего два значения. Используйте вместо него переключатель.
Следующие вопросы помогут вам определить, нужно ли использовать элемент управления «ползунок»:
- Можно ли представить значение параметра в виде относительной величины? Если нет — используйте переключатели или список.
- У параметра есть точное и заранее известное числовое значение? Если да, то используйте числовое поле.
- Требуется ли пользователю мгновенная обратная связь при изменении значения параметра? Если да, то используйте ползунок. Например, пользователям будет проще выбрать цвет, если они сразу увидят эффект при изменении оттенка, насыщенности или яркости.
- Параметр может принимать 4 и более значений? Если нет — используйте переключатели.
- Может ли пользователь изменить значение? Ползунки подразумевают взаимодействие с пользователем. Если пользователь не может изменить значение, используйте текст, доступный только для чтения.
При выборе между ползунком и числовым полем используйте числовое поле, если:
- На экране недостаточно свободного места.
- Пользователь, вероятнее всего, будет использовать клавиатуру.
Используйте ползунок, если:
- Пользователям требуется мгновенный эффект при изменении значения параметра.
Рекомендации
- Размер элемента управления должен позволять пользователю легко выставить нужное значение. Для параметров с дискретными значениями убедитесь, что любое из значений легко выбрать с помощью мыши. Убедитесь, что конечные точки ползунка всегда помещаются в пределах представления.
- Обеспечьте немедленное реагирование, когда пользователь что-то выбирает (если этот выбор осуществим). Например, элемент управления громкостью Windows дает гудок, чтобы указать выбранную громкость звука.
- Используйте метки для показа диапазона значений. Исключение: если ползунок расположен по вертикали и вверху указано значение «Максимум», «Больше» и т. д., то вы можете не указывать другие метки, поскольку значение очевидно.
- При отключении ползунка отключайте все связанные метки или визуальные индикаторы.
- Учтите общее направление текста при установке направления текста и (или) ориентации для ползунка. В некоторых языках текст идет слева направо, а в других справа налево.
- Не используйте ползунок в качестве индикатора хода выполнения.
- Не изменяйте размер бегунка ползунка по умолчанию.
- Не следует создавать непрерывные ползунки, если диапазон значений велик и пользователи, скорее всего, выберут из него одно из нескольких характерных значений. Вместо этого сделайте такие значения единственными доступными шагами. Например, если значение времени может достигать 1 месяца, но пользователям необходимо лишь выбрать из 1 минуты, 1 часа, 1 дня или 1 месяца, то стоит создать ползунок, перемещающийся между этими 4 пунктами.
Дополнительные рекомендации по использованию
Выбор ориентации
Ползунок можно расположить по горизонтали или по вертикали. При выборе расположения обратите внимание на следующие рекомендации.
- Придерживайтесь естественного расположения. Например, если ползунок представляет значения, имеющие аналоги в реальном мире, которые обычно отображаются по вертикали (например, температура), то используйте вертикальную ориентацию.
- Если ползунок используется для объектов мультимедиа, например в приложении для просмотра видео, используйте горизонтальную ориентацию.
- Если ползунок используется на странице, которую можно прокрутить только в одном направлении (по горизонтали или по вертикали), то используйте ориентацию, отличную от направления прокрутки. В противном случае пользователи могут случайно переместить ползунок при прокрутке страницы.
- Если вы не можете выбрать ориентацию, то рекомендуется использовать ту ориентацию, которая лучше всего подходит для макета страницы.
Направление диапазона
Направление диапазона значений – это направление, в котором вы перемещаете ползунок, чтобы изменить значение с текущего до максимального.
- Если ползунок расположен по вертикали, то, независимо от направления чтения, размещайте максимальное значение наверху. Например, для регулятора громкости всегда размещайте максимальное значение в верхней части ползунка. Для остальных типов значений, например дней недели, придерживайтесь направления текста на странице.
- Если ползунок расположен горизонтально, то для макета страницы «слева направо» разместите минимальное значение слева, а для макета страницы «справа налево» — справа.
- Предыдущее правило не относится к ползункам для объектов мультимедиа. В этом случае всегда размещайте минимальное значение слева.
Действия и деления
- Используйте пошаговые точки, если вы не хотите, чтобы ползунок допускал произвольные значения в диапазоне от минимального до максимального. Например, если вы используете ползунок для указания количества приобретаемых билетов в кино, не разрешайте значения с плавающей запятой. В этом примере целесообразно установить значение шага 1.
- Если вы задаете шаги (также называемые точками прикрепления), то убедитесь, что последний шаг диапазона значений параметра соответствует максимальному значению.
- Используйте деления, чтобы показать пользователям расположение основных или важных значений. Например, ползунок для выбора масштаба может иметь деления 50 %, 100 % и 200 %.
- Используйте деления, если пользователям необходимо знать приблизительное значение параметра.
- Используйте деления и метку значения, если пользователям необходимо знать точное значение параметра без взаимодействия с элементом управления. В противном случае для отображения точного значения можно использовать подсказку.
- Всегда используйте деления, если точки прикрепления не очевидны. Например, если ползунок имеет ширину 200 пикселей и содержит 200 точек прикрепления, можно скрыть шкалу, поскольку пользователи не заметят прикрепление. Однако если ползунок имеет только 10 точек прикрепления, то деления следует отображать.
Метки
- Метки ползунка Метка ползунка указывает, для чего используется ползунок.
- Метка не должна содержать конечных знаков препинания (это общее правило для всех меток элементов управления).
- Располагайте метки в верхней части ползунка, если большая часть меток расположена над элементами управления.
- Располагайте метки сбоку, если большая часть меток расположена сбоку от элементов управления.
- Не размещайте метки под ползунком, поскольку при прикосновении к ползунку палец пользователя может загородить метку.
- Указывайте метки на обоих концах ползунка (за исключением случаев, когда это не требуется при вертикальной ориентации ползунка).
- По возможности используйте в метке только одно слово.
- Не используйте знаки препинания в конце метки.
- Убедитесь, что метки носят описательный характер и имеют параллельные значения. Примеры «Максимум/минимум», «Больше/меньше», «Громко/тихо».
- Если требуется использовать метку значения, располагайте ее под ползунком.
- Выровняйте текст относительно элемента управления и добавьте единицы измерения (например, пиксели).
- Так как бегунок ползунка скрывается при его перемещении, стоит подумать над показом его текущего значения каким-то иным образом, с помощью метки или иного визуального элемента. Ползунок, устанавливающий размер шрифта, может отображать образец текста правильного размера рядом с собой.
Внешний вид и взаимодействие
Ползунок состоит из дорожки и бегунка. Дорожка представляет из себя полосу (на которой могут, при необходимости, отображаться шкалы различных стилей), представляющую диапазон значений, которые могут быть введены. Бегунок является селектором, который пользователь может перемещать либо нажимая на дорожку, либо проводя по ней.
У бегунка большая площадь касания. Чтобы обеспечить поддержку сенсорных специальных возможностей, бегунок должен располагаться достаточно далеко от края экрана.
При разработке собственного ползунка следует подумать о способах предоставления пользователю всей необходимой информации в наиболее ясной форме. Используйте метку значения, если пользователю нужно знать единицы измерения, чтобы разобраться в настройке; найдите интересные способы графического представления этих значений. Например, ползунок, управляющий громкостью, может отображать изображение динамика без звуковых волн на конце ползунка с минимальным значением и со звуковыми волнами на конце с максимальным значением.
Примеры
Ползунок с галочками с интервалами в 10 точек от 0 до 100.
UWP и WinUI 2
Сведения и примеры в этой статье оптимизированы для приложений, использующих Windows App SDK и WinUI 3, но обычно применимы к приложениям UWP, использующим WinUI 2. Сведения и примеры для конкретной платформы см. в справочнике по API UWP.
В этом разделе содержатся сведения, необходимые для использования элемента управления в приложении UWP или WinUI 2.
API для этого элемента управления существуют в пространстве имен Windows.UI.Xaml.Controls .
- API UWP:класс Slider, свойство Value, событие ValueChanged
- Откройте приложение коллекции WinUI 2 и просмотрите ползунок в действии. Приложения из коллекции WinUI 2 включают интерактивные примеры большинства элементов управления, возможностей и функций WinUI 2. Получите приложение из Microsoft Store или получите исходный код в GitHub.
Мы рекомендуем использовать последнюю версию WinUI 2 , чтобы получить самые последние стили и шаблоны для всех элементов управления. WinUI 2.2 или более поздней версии включает новый шаблон для этого элемента управления, использующий скругленные углы. Дополнительные сведения см. в разделе о радиусе угла.
Создание ползунка
- Важные API-интерфейсы: класс Slider, свойство Value, событие ValueChanged
Приложение «Коллекция WinUI 3» содержит интерактивные примеры большинства элементов управления, функций и функций WinUI 3. Получение приложения из Microsoft Store или исходный код на сайте GitHub
Ниже приведен пример создания ползунка в XAML.
Ниже приведен пример создания ползунка в коде.
Slider volumeSlider = new Slider(); volumeSlider.Header = "Volume"; volumeSlider.Width = 200; volumeSlider.ValueChanged += Slider_ValueChanged; // Add the slider to a parent container in the visual tree. stackPanel1.Children.Add(volumeSlider);
Получить и задать значение ползунка можно из свойства Value. Обеспечить ответ на изменения значения можно путем привязки к свойству Value или обработки события ValueChanged.
private void Slider_ValueChanged(object sender, RangeBaseValueChangedEventArgs e) < Slider slider = sender as Slider; if (slider != null) < media.Volume = slider.Value; >>
Получение примера кода
- Пример коллекции WinUI — просмотр всех элементов управления XAML в интерактивном формате.
Отображение в режиме мыши
В режиме Мышь перо используется как мышь. Перо перемещается по устройству как мышь по коврику или палец по трекпаду, курсор при этом остается в той позиции, в которую его переместил пользователь до работы с пером.
- Откройте Wacom Center.
- Выберите свое устройство на боковой панели «Устройства».
- В области основного контента выберите Настройки отображения. Вы перейдете к окну «Свойства планшета Wacom».
- В разделе Режим выберите Мышь.
- При необходимости измените настройки мыши.
- Высота мыши: Установите ползунок, чтобы отрегулировать высоту, на которую следует поднимать перо над устройством, чтобы продолжать перемещать курсор по экрану.
- Ускорение мыши: установите ползунок, чтобы отрегулировать расстояние, на которое должен перемещаться курсор, в зависимости от скорости перемещения пера над устройством.
- Скорость мыши: установите ползунок, чтобы отрегулировать скорость, с которой должен двигаться курсор при перемещении пера над устройством.
Совет. Для определения необходимости изменения этих настроек рекомендуется переместить ползунки, чтобы проверить, как это влияет на перемещение курсора по экрану. Параметры Ускорение мыши и Скорость мыши взаимосвязаны, поэтому следует переместить оба эти ползунка, чтобы понять, как они взаимодействуют.
Предупреждение. При внесении изменений в эти настройки, соответствующие системные настройки компьютера не изменяются. Однако изменение настроек мыши в системных настройках компьютера может повлиять на работу мыши в режиме Мышь.
что такое ползунок на компьютере?
Это скроллер, стрелочка, позволяющая двигать пространство файла. Находится сбоку любого открытого окошка файла с большим размером данных, не помещающихся в экране.
Остальные ответы
Похожие вопросы
Ваш браузер устарел
Мы постоянно добавляем новый функционал в основной интерфейс проекта. К сожалению, старые браузеры не в состоянии качественно работать с современными программными продуктами. Для корректной работы используйте последние версии браузеров Chrome, Mozilla Firefox, Opera, Microsoft Edge или установите браузер Atom.
[Windows 10] Как изменить скорость курсора мыши или тачпада
- Введите и выполните поиск [Настройки мыши] в строке поиска Windows ①, а затем щелкните [Открыть] ②.
- В разделе Скорость курсора перетащите ползунок вправо или влево ③, чтобы настроить скорость курсора мыши по своему усмотрению.
- Если в настройках мыши нет пункта Скорость курсора, возможно, это разница между версией Windows, и вы можете выбрать [Дополнительные параметры мыши] ④.
- Выберите [Параметры указателя] ⑤ и в разделе Выберите скорость указателя перетащите ползунок вправо или влево, чтобы настроить скорость курсора мыши по своему усмотрению ⑥, а затем нажмите [Применить] ⑦, а также [OK] ⑧, чтобы сохраните ваши изменения.
Изменить скорость курсора тачпада
- Введите и выполните поиск [Настройки сенсорной панели] в строке поиска Windows ①, а затем нажмите [Открыть] ②.
- В разделе Изменение скорости курсора перетащите ползунок вправо или влево ③, чтобы отрегулировать скорость курсора сенсорной панели по своему усмотрению.