WPF масштабирование шрифтов - PullRequest
8 голосов
/ 10 ноября 2009

У меня есть приложение WPF, в котором пользовательский интерфейс должен масштабироваться так, чтобы он становился больше, если окна становятся больше. В одном из диалогов мне нужно представить список элементов пользователю, и пользователь должен щелкнуть один из них. Список будет содержать от 1 до 15-20 пунктов. Я хочу, чтобы размер шрифта для каждого отдельного элемента был таким же большим, как и размер шрифта для других элементов в списке, но в то же время я хочу, чтобы размер шрифта увеличивался, если увеличить окно.

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

<Window x:Class="WpfApplication4.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="clr-namespace:WpfApplication4"
    Title="Window1" Height="480" Width="640">


    <ScrollViewer>

        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="30*" MinHeight="30"/>
                <RowDefinition Height="30*" MinHeight="30"/>
                <RowDefinition Height="30*" MinHeight="30"/>
            </Grid.RowDefinitions>

            <Button Grid.Row="0" MaxHeight="100"><Viewbox><TextBlock>T</TextBlock></Viewbox></Button>
            <Button Grid.Row="1" MaxHeight="100"><Viewbox><TextBlock>Test</TextBlock></Viewbox></Button>
            <Button Grid.Row="2" MaxHeight="100"><Viewbox><TextBlock>Test Longer String</TextBlock></Viewbox></Button>

        </Grid>

    </ScrollViewer>

</Window>

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

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

EDIT:

Я пытался изменить свой код следующим образом:

<ScrollViewer>
    <Viewbox>
        <ItemsControl>
            <Button>Test 2</Button>
            <Button>Test 3</Button>
            <Button>Test 4 afdsfdsa fds afdsaf</Button>
            <Button>Test 5</Button>
            <Button>Test 5</Button>
            <Button>Test 5</Button>
            <Button>Test 5</Button>
            <Button>Test 5</Button>
        </ItemsControl>
    </Viewbox>
</ScrollViewer>

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

Ответы [ 4 ]

0 голосов
/ 26 июня 2017

Я должен был сделать независимое разрешение резолюции и сделал это с этим ответом здесь: советы по разработке независимого от разрешения приложения

при этом ваше приложение масштабируется (или масштабируется) в зависимости от разрешения.

0 голосов
/ 03 марта 2010

Этот обходной путь может помочь:

    <ScrollViewer>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="30*" MinHeight="30"/>
            <RowDefinition Height="30*" MinHeight="30"/>
            <RowDefinition Height="30*" MinHeight="30"/>
        </Grid.RowDefinitions>

        <Button Grid.Row="0" MaxHeight="100">
            <Viewbox>
                <TextBlock Width="{Binding ElementName=tbLonger,Path=ActualWidth}">T</TextBlock>
            </Viewbox>
        </Button>
        <Button Grid.Row="1" MaxHeight="100">
            <Viewbox>
                <TextBlock Width="{Binding ElementName=tbLonger,Path=ActualWidth}">Test</TextBlock>
            </Viewbox>
        </Button>
        <Button Grid.Row="2" MaxHeight="100">
            <Viewbox>
                <TextBlock Name="tbLonger">Test Longer String</TextBlock>
            </Viewbox>
        </Button>
    </Grid>
</ScrollViewer>

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

0 голосов
/ 03 марта 2010

Возможно, самый простой способ - создать декоратор для выполнения этой работы. Вы можете назвать это «VerticalStretchDecorator» или что-то в этом роде.

Вот как это будет использоваться:

<UniformGrid Rows="3" MaxHeight="300">
  <Button>
    <my:VerticalStretchDecorator>
      <TextBlock>T</TextBlock>
    </my:VerticalStretchDecorator>
  </Button> 
  <Button>
    <my:VerticalStretchDecorator>
      <TextBlock>Test</TextBlock>
    </my:VerticalStretchDecorator>
  </Button> 
  <Button>
    <my:VerticalStretchDecorator>
      <TextBlock>Test Longer String</TextBlock>
    </my:VerticalStretchDecorator>
  </Button>
</UniformGrid>

Я использовал UniformGrid вместо Grid, но он работал бы так же с Grid.

Было бы реализовано что-то вроде этого:

public class VerticalStretchDecorator : Decorator
{
  protected override Size MeasureOverride(Size constraint)
  {
    var desired = base.Measure(constraint);
    if(desired.Height > constraint.Height || desired.Height==0)
      LayoutTransform = null;
    else
    {
      var scale = constraint.Height / desired.Height;
      LayoutTransform = new ScaleTransform(scale, scale); // Stretch in both directions
    }
  }
}
0 голосов
/ 10 ноября 2009

Попробуйте: отредактируйте текстовые элементы так, как вы бы это делали в любое другое время:

  • TextBlock содержится в 'ItemsControl'?
  • ListBox

Поместите весь шебанг в ViewBox и настройте его в соответствии с вашими потребностями. Ищите свойства горизонтального, вертикального или комбинированного масштабирования.

...