How do you have Silverlight resize text content to fit?

Question

I've got a user control (below), I'm binding the text to a datasource and instancing up a bunch of the usercontrols.

I want the size of the text to be the largest possible that will still fit in the bounds of the control. In Windows programming, I could measure the text size decrementing the font size until it fit the target dimensions.

Is there any way of doing this in Silverlight?

I know I could presumably do it in a similar way, but are there any 'nicer' ways of doing it?

<Grid x:Name="gdBubble" Width="180" Height="95">
    <Ellipse x:Name="elBubble" Fill="#FFFFA300" />
    <TextBlock x:Name="txtContent" Text="{ Binding ClientName }" HorizontalAlignment="Center" VerticalAlignment="Center" />
</Grid>

[I'm using a grid here in order for the textblock to center correctly.]

The answer was as Rich described to use a Viewbox.

This was the winning configuration (for me):

<Grid x:Name="gdBubble" Width="180" Height="95">
    <Ellipse x:Name="elBubble" Fill="#FFFFA300" />
    <controls:Viewbox Margin="10,10,10,10" VerticalAlignment="Stretch" Height="Auto">
        <TextBlock x:Name="txtContent" FontSize="18" Text="{ Binding ClientName }" HorizontalAlignment="Center" VerticalAlignment="Center" />
    </controls:Viewbox>
</Grid>

I'm really quite surprised not to have found other people with this problem. Surely any databinding to a dynamic datasource that includes text has this issue? Are textblocks just being used for custom buttons? — Tristan Warner-Smith, Apr 09 '09 at 16:24

score 21 · Accepted Answer · edited May 23 '17 at 12:08

21

A similar question was asked yesterday about resizing content automatically relative to the size of a container. The answer in this case is the same: use a Viewbox. If you put your TextBlock inside of the Viewbox, the TextBlock will resize itself to only use the space it needs, and the Viewbox will handle stretching this to the dimensions of the container. Use the stretch attribute to choose from one of four stretching methods.

Take a look at this thread from yesterday:

WPF Gui that changes size with window?

edited May 23 '17 at 12:08

Community

1
1

answered Apr 09 '09 at 16:22

Rich

36,270
31
115
154

Good stuff Rich, saved my behind. +1 :) – Darko Apr 23 '09 at 00:13

score 0 · Answer 2 · answered Apr 09 '09 at 15:54

0

Try a Dockpanel instead of a Grid. Using LastChildFill=true should get you the behavior that you're looking for.

answered Apr 09 '09 at 15:54

17 of 26

27,121
13
66
85

I'm after the TextBlock filling ALL available space on top of the ellipse, using the DockPanel will divide the available area between the two. – Tristan Warner-Smith Apr 09 '09 at 16:07
Besides a DockPanel will not expand the size of the font to the maximum allowable in the available space even if the TextBlock's dimensions expand. I suspect it will be difficult to do... – Gordon Mackie JoanMiro Apr 09 '09 at 16:17
If you dock the ellipse to the top side of the DockPanel then it shouldn't change size. However, Joan's point about the text size not changing still stands. – 17 of 26 Apr 09 '09 at 21:38

score 0 · Answer 3 · answered Apr 09 '09 at 17:16

0

Have you looked into transform ScaleTransform?

ib.

answered Apr 09 '09 at 17:16

Ireney Berezniak

509
3
5

While it might be handy for resizing manually, I don't think it's the answer. – Tristan Warner-Smith Apr 09 '09 at 19:13

How do you have Silverlight resize text content to fit?

3 Answers3