How to set root element background to transparent dynamically?

5 replies. Latest Post by Maud on November 10, 2009.

(0)

Marie123

Member

3 points

11 Posts

How to set root element background to transparent dynamically?

11-05-2009 11:31 PM |

So my single Page/Control SL.xap comes up with a background via the xaml as such:

    <Grid x:Name="LayoutRoot" Height="Auto" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
          Width="Auto" 
          LayoutUpdated="LayoutRoot_LayoutUpdated" Loaded="LayoutRoot_Loaded">
        
        <Grid.Background>
            <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
                <GradientStop Color="#FF000000"/>
                <GradientStop Color="#FF6D0000" Offset="1"/>
            </LinearGradientBrush>
        </Grid.Background>

At runtime, I issue the following which gives me a white background instead of seeing thru my aspx/html page background (color/image)

LayoutRoot.Background =  new System.Windows.Media.SolidColorBrush(Colors.Transparent) ;

Using a solid color works so this is functionally really bad, SL is not obeying its master :). What I want to achieve is either show the default xaml background, or let it set itself to transparent at times, to see the background color or image I preset in the aspx/html page. BTW, the later shows briefly when the page loads but that's it, after that all I get is the white bg when the above line executes from a test button..

I am also seeing threads mentioning transparent may not work in full screen please confirm, elaborate if you can.

Though, I mentioned root element in the subject line, a grid in my case, I realize I have to set other layout childs to transparent if I want to see all around my controls.

Thanks so much for your help.

mothilal

Member

334 points

124 Posts

Re: How to set root element background to transparent dynamically?

11-06-2009 12:07 AM |

Hi, try this.. You can set the background to transparent by using opacity property..

LayoutRoot.Opacity = 0.5;

where 1.0 is highest and 0 is the lowest..

If this post helps, then don't forget to mark the post as answered..

sasideva

Member

240 points

58 Posts

Re: How to set root element background to transparent dynamically?

11-06-2009 1:19 AM |

Try this

type="application/x-silverlight-2" width="100%" height="100%">

...

</object>

</div>

Regards,
Deva

Marie123

Member

3 points

11 Posts

Re: How to set root element background to transparent dynamically?

11-06-2009 3:50 AM |

Hi Thanks for the reply. I have an aspx page here is what I tried, I even threw in isWindowsless which I see threads mentioning perhaps it's a javascript thing. What's interesting is that now with Background="Transparent" as shown I get black instead of white when I set the LayoutRoot to transparent, I can't explain that either, do you?. Also when I tried Background="00FF0000" just shooting in the dark, silverlight wants to install instead of loading my xap, how funny/sad :):(.

<body style="height:100%;margin:0; background-color: #3399ff" 
    background="BG1.png" >
    <form id="form1" runat="server" style="height:100%;">
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <div  style="height:100%;">
            <asp:Silverlight ID="Xaml1" runat="server" Source="~/ClientBin/AMS.xap" 
            MinimumVersion="2.0.31005.0" Width="100%" Height="100%"
            Windowsless="True" isWindowsless="True" Background="Transparent"  />
        </div>
    </form>
</body>

Looks like you're close but not quite there.  Thank you.

Marie123

Member

3 points

11 Posts

Re: How to set root element background to transparent dynamically?

11-06-2009 3:52 AM |

Thank you sasideva, but Opacity just makes the page go foggy, controls included :)

Maud

Contributor

3332 points

458 Posts

Re: How to set root element background to transparent dynamically?

11-10-2009 3:30 AM |

Hi,

To let silverlight background transparent, you need set layoutRoot background and plugin background to Transparent, and set plugin Iswindowless to true.

I saw you use asp.net silverlight control, then set "PluginBackground" to transparent as well.

Thanks,

Maud