大家知道，在WP7開發中，WebBrowser控件的功能很好很強大。基本應用中，用來顯示長文本是很不錯的選擇，特別是網頁抓取內容的顯示。高級應用中，可以使用html/css/js打造炫酷的效果。園子里關於WebBrowser的好文章很多，值得學習。我這里分享WebBrowser開發中遇到的兩則小技巧，屬於WebBrowser控件的基本應用，希望對大家有所幫助。
一、使用WebBrowser
Xaml
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <phone:WebBrowser Name="webBrowser" Margin="12,0,0,0"/> </Grid>
代碼
public partial class MainPage : PhoneApplicationPage { // 構造函數 public MainPage() { InitializeComponent(); this.Loaded += new RoutedEventHandler(MainPage_Loaded); } private void MainPage_Loaded(object sender, RoutedEventArgs e) { string content = @"If you shed tears when you miss the sun, you also miss the stars."; string rawHtml = ""; rawHtml += "<html><body>"; rawHtml += content; rawHtml += "</body><html>"; webBrowser.NavigateToString(rawHtml); } }
WebBrowser控件的背景顏色默認為白色，在控件屬性中無法修改。若應用的整體背景色是黑色，WebBrowser控件則顯得不協調，那么如何修改其顯示呢？
二、修改WebBrowser控件背景顏色
大家知道，WebBrowser控件其實就是一個瀏覽器頁面，該頁面的顯示無疑也可由html來控制，說到這里大家也許已經知道了：使用bgcolor屬性來控制背景顏色。
代碼：
private void MainPage_Loaded(object sender, RoutedEventArgs e) { string content = @"If you shed tears when you miss the sun, you also miss the stars."; string rawHtml = ""; if (IsThemeDark()) { rawHtml += "<html><body bgcolor=\"#000000\"><p>"; } else { rawHtml += "<html><body bgcolor=\"#FFFFFF\">"; } rawHtml += content; rawHtml += "</p></body></html>"; webBrowser.NavigateToString(rawHtml); } private bool IsThemeDark() { Visibility darkBackgroundVisibility = (Visibility)Application.Current.Resources["PhoneDarkThemeVisibility"]; return darkBackgroundVisibility == Visibility.Visible;
}
使用IsThemeDark來判斷當前Application的默認背景顏色是不是黑色，保持WebBrowser控件背景顏色與App默認背景色一致。事例App采用默認的黑色背景，運行，發現烏黑一片，泰戈爾沒了蹤影，咋回事呢？原來WebBrowser死性難改，字體顏色還是黑色，好在咱還稍微懂點html，繼續：
private void MainPage_Loaded(object sender, RoutedEventArgs e) { string content = @"If you shed tears when you miss the sun, you also miss the stars."; string rawHtml = ""; if (IsThemeDark()) { rawHtml += "<html><body bgcolor=\"#000000\"><p>"; rawHtml += "<font color=\"#FFFFFF\">"; } else { rawHtml += "<html><body bgcolor=\"#FFFFFF\"><p>"; rawHtml += "<font color=\"#000000\">"; } rawHtml += content; rawHtml += "</p></font></body></html>"; webBrowser.NavigateToString(rawHtml); }
代碼片段將文本顏色修改為WebBrowser控件背景顏色的反色。
如果你跟着筆者一起運行了以上代碼，你會發現WebBrowser控件在加載過程中閃爍了一下，白色的背景一閃而過，看來江山易改，本性難移。怎么能讓WebBrowser控件不要露出白色“獠牙”呢？
三、防止WebBrowser控件加載過程中的閃爍
大致分析一下發生閃爍產生的原因。WebBrowser控件自身的背景顏色是白色，加載咱們的html后，背景被修改為黑色。那么在WebBrowser控件顯示以后，加載html完成之前，WebBrowser控件將呈現白色。這段時間比較短暫，但還是被我們靈敏的眼睛捕捉到了。原因清晰了，我們來考慮解決的方法：我們想要的是加載html完成后的WebBrowser，之前他是什么樣子，我們不care，既然不care，干脆隱藏掉好了，相比各位又猜出十之八九了。
Xaml
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <phone:WebBrowser Name="webBrowser" Margin="12,0,0,0" Opacity="0" LoadCompleted="WebBrowser_LoadCompleted"/> </Grid>
設置WebBrowser控件的Opacity屬性為0，將其默認隱藏。處理LoadCompleted事件。
代碼
private void WebBrowser_LoadCompleted(object sender, NavigationEventArgs e) { webBrowser.Opacity = 1; }
響應LoadCompleted事件，WebBrowser控件加載完畢后，才將其顯示出來。運行，效果不錯，整個世界清靜了。
四、總結
這里分享的設置背景顏色和防止閃爍，只是WebBrowser應用中遇到的基礎問題，例如還有加載中文時亂碼等其他問題，可以到園子里搜一下其他文章。已經說了，WebBrowser功能很好很強大，特別地，芒果增加了對HTML5的支持，開發者可以使用HTML5技術基於WebBrowser打造更個性化的Native應用。更重要的是，基於HTML5的開發是跨平台的。已有不少開源項目支持了WP7，例如JQuery.Mobile，PhoneGap等。大家有空不妨一試。
（全文完）