CODEWITHSUNDEEP
xamlwindows-store-appsstackpanel
Proliges
Proliges

Reputation: 361

XAML Make stackpanel slightly transparent but the text inside not

I have a stackpanel which i fill with an textblock. I have an stackpanel.resources. I tried setting the background to transparent but it will make the whole style invisible (but the text not) and i tried using opacity. This does make my stackpanel slightly transparent but also the text within the stackpanel.

The stackpanel looks like this:

        <StackPanel Orientation="Vertical" Margin="550,25,0,0">
            <Border>
                <TextBlock OpticalMarginAlignment="None">
                    <Run FontSize="24" Text="Product"></Run><LineBreak/>
                    <Run FontSize="18" Text="Artikelnummer: "></Run><LineBreak/>
                    <Run FontSize="18" Text="Omschrijving: "></Run><LineBreak/>
                    <Run FontSize="18" Text="Eenheid: "></Run>
                </TextBlock>
            </Border>
            <StackPanel.Resources>
                <Style TargetType="Border">
                    <Setter Property="Background" Value="#287d37" />
                    <Setter Property="Margin" Value="5" />
                    <Setter Property="Width" Value="400" />
                    <Setter Property="Height" Value="105" />
                </Style>
                <Style TargetType="TextBlock">
                    <Setter Property="Foreground" Value="White" />
                    <Setter Property="Margin" Value="5" />
                </Style>
            </StackPanel.Resources>
        </StackPanel>

Does anyone know how i can achieve my goal of setting the background of the stackpanel to something like opacity 0.25 but the text inside that stackpanel not?

Thanks in advance!

Upvotes: 1

Views: 850

Answers (1)

Willem van Rumpt
Willem van Rumpt

Reputation: 6570

Specify the alpha channel (the first byte) in the case of hardcoded colors, or the opacity if you're using a brush:

<StackPanel Background="#44287d37">
   ...
</StackPanel>

or

<StackPanel>

   <StackPanel.Background>
      <SolidColorBrush Color="Blue" Opacity=".25"/>
   </StackPanel.Background>

   ...

</StackPanel>

Upvotes: 1

Related Questions