Resize font in TextBox in Grid

Question

My question below is answered but I just realised that now the Fontsize only resizes in one direction.

Is there a possibility to bind two paths? Or another option?

Previous question I have a Grid [20,20] with Textboxes in it. In these TextBoxes I put numbers. When the application starts up it's fullscreen. If I resize the window the Grid with the Texboxes also resizes. But the Font stays the same. So I want to change the fontsize when the Window resizes. I tried FontSize="{Binding ElementName=aTextBox, Path=Height}" between the TextBox tags. But that doesn't work. A binding with the Grid or Window with property Height or Width didn't work either. With binding to a slider the fontsize changes according to the the value of the slider. Does anybody have a nice solution?

Answer 1

I just did a quick test. If I bind the Text property of a TextBox to the Width of the containing grid the result is NaN. That would probably be the reason your binding fails.

If I instead bind the FontSize property of the TextBox to the ActualWidth property the binding is OK, and also resizes with the grid. The font is huge though. You would probably need some converter to make the FontSize smaller.

  <Grid x:Name="myGrid">
      <TextBox Text="Hello" FontSize="{Binding ElementName=myGrid, Path=ActualWidth}"/>
  </Grid>

Answer 2

The Height property is the initial height of the TextBox. The ActualHeight represents the height of the TextBox as it is drawn on the screen. So your binding becomes:

<TextBox FontSize="{Binding Path=ActualHeight, RelativeSource={RelativeSource Self}, Converter={StaticResource HeightToFontSizeConverter}}" Text="12345" />

Notice that I used a converter because the ratio Height to FontSize is not 1:1 and the text is too big for the TextBox:

class HeightToFontSizeConverter : IValueConverter {

  public object Convert(object value, Type targetType, object parameter, CultureInfo culture) {
    var height = (double) value;
    return .65 * height;
  }

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

}

Answer 3

A simple Viewbox could do the trick, but there are issues.

Refer to this reply.. http://stackoverflow.com/questions/1417004/how-to-relative-scale-size-of-user-control/1417342#1417342

I'm in favour of the converter approach as in Julien's reply.

Answer 4

Thank you all. It works fine.