CODEWITHSUNDEEP
xamltransparency
Graeme
Graeme

Reputation: 2687

Text over semi-transparent background

This must be so simple but I can't do it: if I put a textblock in a container and make the container's opacity < 1, the text inherits that opacity, no matter whether I try to override it in the textblock. How can I keep the text 100% opacity while in a semii-transparent container?

<Grid x:Name="LayoutRoot">
    <Border Background="red" Opacity="0.5">
        <TextBlock Text="TextBlok" Opacity="1"/>
    </Border>
</Grid>

Upvotes: 8

Views: 9387

Answers (3)

greif.matthias
greif.matthias

Reputation: 43

<Grid>
    <Grid.Background>
        <SolidColorBrush Color="Red" Opacity="0.5"></SolidColorBrush>
    </Grid.Background>

    <TextBlock Text="Hallo there"></TextBlock>
</Grid>

Upvotes: 0

Peter
Peter

Reputation: 48958

Just use the a color value in stead of an opacity to make it transparant.

The Color property can be formed out of 4 parameters being :

  1. Transparancy
  2. Red
  3. Green
  4. Blue

All of them ranging from 0-255

A half transparant blue would be : (128,0,0,255) Translated into XAML (Hexidecimal) : #800000FF

This color you can use in any colorbrush.

So else has already an example how to implementate it in your code I just see.

Upvotes: 3

Arjan Einbu
Arjan Einbu

Reputation: 13672

Will this do the trick?

<Border Background="#80FF0000">
    <TextBlock Text="TextBlok"/>
</Border>

Setting the background to be transparent, not the whole Border element...

Upvotes: 14

Related Questions