In Windows Phone, We need to display HTML content. The preferred solution is WebBrowser. However, there are often various problems in WebBrowser: Garbled code, pop-up screen, and so on.
The Default background color of WebBrowser is white. To change the background color of WebBrowser to black, add the css code to HTML.
Body {
Background-color: black;
Color: white;
}
However, a problem arises as a result of abrupt changes from the white background to the black background, resulting in a flickering screen. The purpose of this article is to solve this problem. If you have a better solution, please share it with me.
Solution 1: gradient Animation
We use a gradient animation to gradually display WebBrowser.
Private void FadingIn ()
{
Storyboard storyboard = new Storyboard ();
DoubleAnimation animation = new DoubleAnimation ();
Animation. Duration = (Duration) TimeSpan. FromSeconds (0.5 );
Animation. BeginTime = TimeSpan. FromSeconds (0.2 );
Animation. From = 0.2;
Animation. To = 1.0;
Storyboard. SetTargetProperty (animation, new PropertyPath ("Opacity", new object [0]);
Storyboard. SetTarget (animation, webBrowser );
Storyboard. Children. Add (animation );
Storyboard. Begin ();
}
After setting the Source of webBrowser or calling the Navigate method of webBrowser, you can call FadingIn.
The effect is also good, mainly because there is a gradient animation in the content of WebBrowser. I used this method in viewing the large image in the Windows Phone FAQ encyclopedia App. (Displaying images with WebBrowser is a very lazy solution)
Solution 2. Set transparency
From the inspiration of the gradient animation above, we can set the Opacity of WebBrowser to 0 at the beginning, and then restore the winning Opacity of the LoadCompleted event to 1.0. The results are very good.