Ridimensionamento font WPF

Question

Ho un'applicazione WPF in cui l'interfaccia utente deve essere ridimensionata in modo che diventi più grande se le finestre sono ingrandite. In una delle finestre di dialogo, ho bisogno di presentare un elenco di elementi a un utente e l'utente dovrebbe fare clic su uno di essi. L'elenco conterrà da 1 a circa 15-20 articoli. Voglio che la dimensione del carattere per ogni singolo elemento sia grande quanto la dimensione del carattere per gli altri elementi nell'elenco, ma allo stesso tempo voglio che la dimensione del carattere aumenti se la finestra è ingrandita.

Al momento, il mio codice di test si presenta come di seguito.

<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> 

Se l'applicazione viene avviata e la finestra è estesa, tutto sembra OK. Se la larghezza della finestra viene ridotta, la dimensione del carattere del testo Test Longer String viene ridotta, ma la dimensione del font per T e Test rimane la stessa. Capisco perché questo accade: la finestra di visualizzazione scalerà il contenuto alla sua dimensione massima. Quello che voglio sapere è quale metodo dovrei usare per risolvere questo problema.

Non voglio dare ai controlli dimensioni di caratteri specifiche perché alcune persone lo eseguiranno su schermi a bassa risoluzione come 640x480 e altri useranno widescreen più grandi.

EDIT:

Ho provato a modificare il mio codice di seguito:

<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> 

Ma con la dimensione dei bordi dei pulsanti sono aumentate pure, così su grandi schermi, il i bordi dei pulsanti diventano larghi un centimetro.

Answer 1

Prova questo: rendere il vostro elementi di testo, come si dovrebbe fare qualsiasi altro momento:

• TextBlock s contenuto in un 'ItemsControl'?
• ListBox?

Posizionare l'intera shebang in ViewBox e impostarla in scala appropriata alle proprie esigenze. Cerca le proprietà di ridimensionamento orizzontale, verticale o combinato.

Answer 2

Questa soluzione potrebbe aiutare:

<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> 

La chiave è quello di impostare tutti TextBlocks la stessa larghezza. In questo caso, seguono tutti il ​​blocco di testo più lungo tramite associazione.

Answer 3

Il modo più semplice è probabilmente quello di costruire un decoratore per fare il lavoro. Potresti chiamarlo "VerticalStretchDecorator" o qualcosa del genere.

Ecco come sarebbe essere utilizzato:

<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> 

ho usato UniformGrid invece di Grid, ma avrebbe funzionato allo stesso modo con Grid.

Sarebbe implementato qualcosa di simile:

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 
    } 
    } 
} 

Answer 4

ho dovuto fare un'applicazione indipendente risoluzione e ne ha fatto con questa risposta qui: tips on developing resolution independent application

con che l'applicazione sia di scala (o lo zoom), a seconda della risoluzione.