CODEWITHSUNDEEP
backgroundwindows-phone-8textblock
android developer
android developer

Reputation: 116412

How to set a background to a textBlock that changes its content

Background

I'm trying to put a textBlock control at the bottom of the screen (with a small margin below it), and I also wish to set a background for it, so that no matter what is shown behind the textBlock, it will be easy to read.

On Android, you could simply set the background to it, and tell it to have the width and height to be WRAP_CONTENT, so that it will take only the space it needs, but I can't find a similar thing on WP8.

Current status

This is the xaml I've created:

...
<Grid >

    <Image x:Name="fullScreenImage" Stretch="Fill"
        Visibility="Collapsed" />

    <TextBlock   HorizontalAlignment="Center" VerticalAlignment="Bottom"
            Margin="0,0,0,200" FontSize="40" x:Name="pictureLabel" TextWrapping="Wrap"
            Foreground="#ff000000" />
</Grid>

The problem

Since the textBlock doesn't have a background property, I had to use something that wraps it. However, since its content changes dynamically, I can't simply set a size for it.

The question

For now, I would like to simply set its background color.

I would also very appreciate if it would be possible to use a rounded corners rectangle for the background, or a 9-patch image.

How can I achieve setting a background for the textBlock?

Upvotes: 0

Views: 6115

Answers (3)

user2272870
user2272870

Reputation: 33

The solution is very simple. Just set the HirizontalAlignment to Left. Hope this will work in your case.

<StackPanel HorizontalAlignment="Left">
            <Border Background="#66FFFFFF">                    
                    <TextBlock/>                    
            </Border>
</StackPanel>

Upvotes: 3

android developer
android developer

Reputation: 116412

I've come up with the next solution , which works quite fine , but what i really would like to also have is a way to set a min font and max font size , so that if there is a single word , the font might need to be of some size, and if the text is too long , the font will be of a smaller size , all in a dynamic way.

code:

label.Text = label;
label.Measure(new Size(RenderSize.Width, RenderSize.Height));
border.Width = label.DesiredSize.Width + border.Padding.Left + border.Padding.Right + border.BorderThickness.Left + border.BorderThickness.Right;
border.Height = label.DesiredSize.Height + border.Padding.Top + border.Padding.Bottom + border.BorderThickness.Bottom + border.BorderThickness.Top;

and the xaml:

<Border BorderBrush="#ff000000" BorderThickness="2" CornerRadius="8" Visibility="Collapsed" Padding="5" Background="#bfff0000" Margin="10,0,10,200" VerticalAlignment="Bottom" x:Name="border">
    <StackPanel>
      <TextBlock FontSize="40" x:Name="pictureLabel" TextWrapping="Wrap" Foreground="#ff000000" />
    </StackPanel>
</Border>

Upvotes: 0

lhan
lhan

Reputation: 4635

According to this question (which is for Silverlight - but is xaml nonetheless), there is no way to explicitly set a background color for a TextBlock. Your best bet is to wrap your TextBlock in a Grid or Border.

If a Grid does not work, this article suggests a Border will do the trick:

A simple border will do, and by not setting its width and height properties, it will shrink/grow based on the size of the TextBlock.

Upvotes: 0

Related Questions