[Xamarin] 使用Webview 來做APP (转帖)

有時候,企業要求的沒有這麼多,他原本可能官方網站就已經有支援Mobile Web Design 他只需要原封不動的開發一個APP

也或是,他只是要型錄型,或是問卷調查的型的APP,這時候透過類似像iframe的方法開發APP也是一種方式,像是PhoneGap

直接採用類似的方法來做到,但是不一樣的他們提供很多方式讓WebView 可以去呼叫Native的library,不過達到快速開發跟快平台

這的確是一種快速開發的方式畢竟在這世界..

600199_395605550514854_1465641502_n

現在來討論一下如何在Xamarin 下面開發一個嵌入網頁的APP,首先介紹一下畫面..
首先我們就不能用他們預設的LinearLayout 而是要用  WebView 當作root.
Main.axml :

 

<?xml version="1.0" encoding="utf-8"?>
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/webviewMain"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" />

 

很簡單就只有一個WebView 的Element,再來我們看一下 C#的Code :

 

using Android.App;
using Android.Webkit;
using Android.OS;
 
namespace TestWebview
{
    [Activity(Label = "當麻許的超技八", MainLauncher = true, Icon = "@drawable/icon")]
    public class Activity1 : Activity
    {
        WebView webviewMain;
 
        protected override void OnCreate(Bundle bundle)
        {
 
            base.OnCreate(bundle);
 
            // Set our view from the "main" layout resource
            SetContentView(Resource.Layout.Main);
 
            webviewMain = FindViewById<WebView>(Resource.Id.webviewMain);
            //啟用Javascript Enable
            webviewMain.Settings.JavaScriptEnabled = true;
            //載入網址
            webviewMain.LoadUrl("http://no2don.blogspot.com");
            // 請注意這行,如果不加入巢狀Class 會必成呼叫系統讓系統來裁決開啟http 的方式
            webviewMain.SetWebViewClient(new CustWebViewClient());
            
        }
 
        /// <summary>
        /// 巢狀Class 繼承WebViewClient
        /// </summary>
        private class CustWebViewClient : WebViewClient
        {
            public override bool ShouldOverrideUrlLoading(WebView view, string url)
            {
                view.LoadUrl(url);
                return true;
            }
 
        }      
    }
}
 

這時候我們跑起來,應該就會正常執行..

請注意 webviewMain.SetWebViewClient(new CustWebViewClient());  這行如果你沒有加上去

是會正常編譯過的,而且會乍看下正常,但是其實他是Call系統內建對於http處理的APP,所以必須要透過巢狀Class指定開啟此WebView 結果:

Screenshot_2013-07-17-11-33-52
這時候我們又遇到一個問題了,當我點了一個連結Link到下一頁之後,我預設的Android back鍵應該是要回上一頁

但是卻是直接離開APP這時候我們必須要複寫OnKeyDown

 

/// <summary>
/// 覆寫使其back可以直接回上一頁並非預設的離開APP
/// </summary>
/// <param name="keyCode"></param>
/// <param name="e"></param>
/// <returns></returns>
public override bool OnKeyDown(Android.Views.Keycode keyCode, Android.Views.KeyEvent e)
{
    if (keyCode == Keycode.Back && webviewMain.CanGoBack())
    {
        webviewMain.GoBack();
        return true;
    }
    return base.OnKeyDown(keyCode, e);
}

就這樣,快速開發好一支APP ..夠快了..

posted on 2013-11-26 23:25 王员外王爷 阅读(...) 评论(...) 编辑 收藏

导航

统计

公告