Как сделать масштабирование wpf

Добавил пользователь Алексей Ф.
Обновлено: 04.10.2024

Элементы WPF обладают набором свойств, которые помогают позиционировать данные элементы. Рассмотрим некоторые из этих свойств.

Ширина и высота

У элемента можно установить ширину с помощью свойства Width и высоту с помощью свойства Height . Эти свойства принимают значение типа double . Хотя общая рекомендация состоит в том, что желательно избегать жестко закодированных в коде ширины и высоты.

Также мы можем задать возможный диапазон ширины и высоты с помощью свойств MinWidth/MaxWidth и MinHeight/MaxHeight . И при растяжении или сжатии контейнеров элементы с данными заданными свойствами не будут выходить за пределы установленных значений.

Возможно, возникает вопрос, а в каких единицах измерения устанавливаются ширина и высота? Да и в общем какие единицы измерения используются? В WPF можно использовать несколько единиц измерения: сантиметры ( cm ), точки ( pt ), дюймы ( in ) и пиксели ( px ). Например, зададим размеры в других единицах:

Если единица измерения не задана явно, а просто стоит число, то используются по умолчанию пиксели. Но эти пиксели не равны обычным пикселям, а являются своего рода "логическими пикселями", независимыми от конкретного устройства. Каждый такой пиксель представляет 1/96 дюйма вне зависимости от разрешения экрана.

Выравнивание

HorizontalAlignment

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

Свойство HorizontalAlignment выравнивает элемент по горизонтали относительно правой или левой стороны контейнера и соответственно может принимать значения Left, Right, Center (положение по центру), Stretch (растяжение по всей ширине). Например:

VerticalAlignment

Также мы можем задать для элемента выравнивание по вертикали с помощью свойства VerticalAlignment , которое принимает следующие значения: Top (положение в верху контейнера), Bottom (положение внизу), Center (положение по центру), Stretch (растяжение по всей высоте). Например:

Отступы margin

Свойство Margin устанавливает отступы вокруг элемента. Синтаксис: Margin="левый_отступ верхний_отступ правый_отступ нижний_отступ". Например, установим отступы у одной кнопки слева и сверху, а у другой кнопки справа и снизу:

Если мы зададим свойство таким образом: Margin="20", то сразу установим отступ для всех четырех сторон.

Теперь я хочу масштабировать ширину и высоту пути к тому, что мне нравится. Я нашел способ:

И это работает, но мне интересно, если это самый эффективный способ сделать это? (Я должен был ввести сетку и окно просмотра для этого)

Другой способ масштабирования пути - использовать RenderTransform или LayoutTransform

просто FYI, так как ViewBox использует ScaleTransform внутри него, он в основном так же хорош по производительности.

У вас есть 3 способа масштабирования пути:

Оберните его в ViewBox
Применить ScaleTransform
Явно установить ширину и высоту

Метод 1. и 2. даст тот же результат, в то время как 3. немного отличается, потому что форма изменит размер, но штрих сохранит исходную толщину (так что это не очень зум).

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

Я не хочу, чтобы мой графический интерфейс WPF масштабировался с помощью параметров размера шрифта Windows (DPI). Это не просто вопрос указания фиксированного размера шрифта в UserControl, потому что масштабирование влияет на изображения и границы в UserControl. Есть ли свойство, которое я могу установить в UserControl, чтобы отключить масштабирование? Если нет, как я могу это сделать?

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

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

Вы можете уменьшить свой UserControl в зависимости от текущего параметра DPI. Например, если вы обернули свой UserControl следующим DpiDecorator, он должен выглядеть одинаково независимо от настройки DPI:

Или вы можете переместить эту логику в свой UserControl.

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

И убедитесь, что ваше приложение не имеет " dpiAware " записи в манифесте сборки.

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

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

Note: The dpiAware manifest entry lets your application tell Windows that it wants to opt-out of the dpi-scaling. Applications only add this item if they've been tested at high-dpi.

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

Это позволит конечному пользователю выбрать значение от 0 до 100 путем перетаскивания кнопки (называемой указателем) вдоль линии.

Шкала

Я включил отображение шкалы, присвоив свойству TickPlacementзначение, отличное от None, которое используется по умолчанию. В моем примере я хочу, чтобы шкала располагалась ниже линии, но вы можете использовать TopLeftили даже Both в качестве возможных значений, чтобы изменить её положение.

Также обратите внимание на мое использование свойства TickFrequency. По умолчанию оно равно 1, но в примере, где диапазон возможных значений изменяется от 0 до 100, это приведет к 100 рискам, которые необходимо будет отобразить в ограниченном пространстве. В таком случае имеет смысл увеличить свойство TickFrequency так, чтобы шкала выглядела менее переполненной.

Привязка к делениям

Если вы посмотрите на скриншот выше, вы увидите, что указатель находится между рисками. В этом есть смысл, поскольку между каждой риской имеется пять значений, как определено свойством TickFrequency. Кроме того, значение элемента управления Slider по умолчанию является double, что означает, что значение может быть (и вероятно будет) нецелым. Мы можем изменить это, используя свойство IsSnapToTickEnabled, как в приведенном ниже примере:

Обратите внимание, что я изменил значение TickFrequency на 10, а затем включил свойство IsSnapToTickEnabled. Это гарантирует, что указатель можно будет разместить только прямо на рисках, поэтому для этого примера его значение может быть только 0, 10, 20, 30, 40 и т. д.

Значение указателя

До сих пор мы просто использовали Slider для демонстрации, но, конечно, фактическая цель - прочитать его текущее значение и затем его использовать. Для этого Slider имеет свойство Value, которое вы, конечно, можете получать из кода или привязывать.

Обычный сценарий использования слайдера заключается в объединении его с элементом управления TextBox, который позволит пользователю видеть и изменять текущее выбранное значение, вводя число вместо перетаскивания указателя слайдера. Обычно вам нужно подписаться на события изменения как на слайдере, так и на TextBox и затем их соответствующим образом обновить, но обычная привязка может все это сделать за нас:

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

Реагирование на изменение значений

Конечно, в то время как привязки очень круты для многих целей, вы все равно можете реагировать на изменение значения ползунка из кода. К счастью для нас, Slider поставляется с событием ValueChanged, которое поможет нам в этом. Чтобы это проиллюстрировать, я создал более сложный пример с тремя ползунками, в котором мы меняем значения красного, зеленого и синего (RGB) цвета:

В части кода XAML у нас есть три DockPanel, каждая из которых имеет элементы управления Label, Slider и TextBox. Как и раньше, свойство Text элемента управления TextBox привязано к свойству Value ползунка.

Каждый слайдер подписывается на одно и то же событие ValueChanged, в котором мы создаем новый экземпляр Color на основе выбранных в данный момент значений и затем используем этот цвет для создания нового свойства SolidColorBrush для фона в окне.

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

Is your preferred language not on the list? Click here to help us translate this article into your language!

Читайте также: