Come faccio a far sì che un TextBlock WPF mostri il mio testo su più righe?

Question

Ho una finestra wpf in cui ho uno stackpanel con due viewport in esso - ogni Viewport con un blocco di testo.

<Grid> 
    <StackPanel VerticalAlignment="Center" Orientation="Vertical" > 
     <Viewbox Margin="100,0,100,0"> 
      <TextBlock x:Name="headerText" Text="Lorem ipsum dolor" Foreground="Black"/> 
     </Viewbox> 
     <Viewbox Margin="150,0,150,0"> 
      <TextBlock x:Name="subHeaderText" Text="Lorem ipsum dolor, Lorem ipsum dolor, lorem isum dolor, Lorem ipsum dolor, Lorem ipsum dolor, lorem isum dolor, " TextWrapping="Wrap" Foreground="Gray" /> 
     </Viewbox> 
    </StackPanel> 
</Grid> 

Quello che vorrei realizzare è che il blocco di testo in alto è il titolo con un testo più grande. Il secondo blocco di testo è l'intestazione secondaria con un testo più piccolo. Non importa quanto testo ci sia per l'intestazione o il sottotitolo, il carattere dovrebbe diventare dinamico più piccolo/più grande. Il mio problema è che vorrei che il sottotitolo fosse a larghezza fissa. Ciò significa che, il carattere dovrebbe essere una percentuale (70%) dell'intestazione e avvolgere su più righe, a seconda di quanto testo ho. Ho allegato il codice che ho finora ... mi manca qualcosa con quel sottotitolo, non riesco a capire cosa. Acclamazioni

Modifica Fondamentalmente quello che voglio ottenere è che l'intestazione sub avvolge il testo in modo che possa espandersi verso il basso con il tipo di carattere di essere un 70% della voce - non importa quanto grande, che carattere è.

Answer 1

Nidificazione uno StackPanel farà sì che la casella di testo per avvolgere correttamente:

<Viewbox Margin="120,0,120,0"> 
    <StackPanel Orientation="Vertical" Width="400"> 
     <TextBlock x:Name="subHeaderText" 
        FontSize="20" 
        TextWrapping="Wrap" 
        Foreground="Black" 
        Text="Lorem ipsum dolor, lorem isum dolor,Lorem ipsum dolor sit amet, lorem ipsum dolor sit amet " /> 
    </StackPanel> 
</Viewbox> 

Answer 2

Questo diventa così parte lì. Non esiste una proprietà ActualFontSize ma esiste un ActualHeight che si riferisce a FontSize. In questo momento questa unica dimensione per il rendering originale. Non riuscivo a capire come registrare il convertitore come evento di ridimensionamento. In realtà forse è necessario registrare FontSize come evento di ridimensionamento. Per favore non segnarmi per una risposta incompleta. Non ho potuto inserire un esempio di codice in un commento.

<Window.Resources> 
     <local:WidthConverter x:Key="widthConverter"/> 
    </Window.Resources> 
    <Grid> 
     <Grid> 
      <StackPanel VerticalAlignment="Center" Orientation="Vertical" > 
       <Viewbox Margin="100,0,100,0"> 
        <TextBlock x:Name="headerText" Text="Lorem ipsum dolor" Foreground="Black"/> 
       </Viewbox> 
       <TextBlock Margin="150,0,150,0" FontSize="{Binding ElementName=headerText, Path=ActualHeight, Converter={StaticResource widthConverter}}" x:Name="subHeaderText" Text="Lorem ipsum dolor, Lorem ipsum dolor, lorem isum dolor, Lorem ipsum dolor, Lorem ipsum dolor, lorem isum dolor, " TextWrapping="Wrap" Foreground="Gray" /> 
      </StackPanel> 
     </Grid> 
    </Grid>   

Converter

[ValueConversion(typeof(double), typeof(double))] 
    public class WidthConverter : IValueConverter 
    { 
     public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
     { 
      double width = (double)value*.7; 
      return width; // columnsCount; 
     } 

     public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 
     { 
      throw new NotImplementedException(); 
     } 
    } 

Answer 3

Se si vuole solo avere il carattere di testa un po 'più grande poi il resto, è possibile utilizzare ScaleTransform. in modo da non dipendere dal tipo di carattere reale.

<TextBlock x:Name="headerText" Text="Lorem ipsum dolor"> 
       <TextBlock.LayoutTransform> 
        <ScaleTransform ScaleX="1.1" ScaleY="1.1" /> 
       </TextBlock.LayoutTransform> 
    </TextBlock> 

Answer 4

utilizzare la proprietà TextWrapping dell'elemento TextBlock:

<TextBlock Text="StackOverflow Forum" 
      Width="100" 
      TextWrapping="WrapWithOverflow"/>