把网站改成APP吧-Xamarin WebView

时间:2022-04-29
本文章向大家介绍把网站改成APP吧-Xamarin WebView,主要内容包括使用WebView构建基础框架、部署,测试,发布、基本概念、基础应用、原理机制和需要注意的事项等,并结合实例形式分析了其使用技巧,希望通过本文能帮助到大家理解应用这部分内容。

搭建好Xamarin环境,先来小试牛刀,使用Xamarin的webView来访问网页,从而实现伪WebApp的效果(网站本身移动设备兼容WebView调用)。主要是通过WebApp来访问页面,同时通过重写页面加载方法来防止调用系统浏览器来实现。

使用WebView构建基础框架

首先创建一个项目,并打开Resources - layout -Main.axml文件,从工具箱中添加一个WebView.

从左侧工具栏中找到WebView并拖到我们的界面中,并放大到覆盖整个页面,位置如图:

注意:在左下角的Source中查看源代码

<android.webkit.WebView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/webView1" />

其中width="match_parent"height="wrap_content"默认自适应屏幕尺寸。

添加好WebView,编写根目录的MainActivity.cs文件,在OneCreate()方法中获取WebView进行基础设置。

//获取WebView对象
var webView = FindViewById<WebView>(Resource.Id.webView1);

//申明WebView的配置
WebSettings settings = webView.Settings;

//允许执行JS
settings.JavaScriptEnabled = true;

//设置可以通过js打开窗口
settings.JavaScriptCanOpenWindowsAutomatically = true;

//创建webView客户端类
var webc = new MyCommWebClient();

//设置WebVIew客户端
webView.SetWebViewClient(webc);

//加载的Url
webView.LoadUrl("https://ns96.com");

上述代码中的MyCommWebClient()方法的意义在于,阻止系统调用原生浏览器访问新页面,方法内容如下。

class MyCommWebClient : WebViewClient
{
    //重写加载方法
    public override bool ShouldOverrideUrlLoading(WebView view, string url)
    {
        //使用文本空间加载
        view.LoadUrl(url);
        return true;
    }
}

代码截图:

调试运行后结果如下图

部署,测试,发布

部署测试参考Xamarin官方文档 部署、测试和指标

程序发布参考Xamarin官方文档 发布应用程序