zoukankan      html  css  js  c++  java
  • VS2015(Xamarin)开发安卓WebApp笔记

    有关WebApp的开发,大多数人都用了第三方框架,如Cordova等。我这里没有用到这类框架,而是新建了一个WebView嵌入Assets(本地资源)来完成这个App,由于第一个练习App希望对初学者有所帮助。

    这是一个快递快速查询的App,现在添加了几个比较火的快递,调用查询接口来自kuaidi100(有一定概率查询出错,估计是屏蔽措施,多查几次),前端UI采用frozenui(腾讯团队),入门快demo齐全

    先来效果图

    1、权限配置,既然是最快递查询,摄像头权限是必不可少。查询历史等最好也要存起来,我这里通过sqlite存到了sd卡。

    manifest节点下
        <uses-permission android:name="android.permission.INTERNET" />
        <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
        <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
        <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
        <uses-permission android:name="android.permission.MOUNT_UNMOUNT_FILESYSTEMS" />
        <uses-permission android:name="android.permission.CAMERA" />
        <uses-permission android:name="android.permission.VIBRATE" />
        <uses-permission android:name="android.permission.FLASHLIGHT" />
        <uses-feature android:name="android.hardware.camera" />
        <uses-feature android:name="android.hardware.camera.autofocus" />
    

    2、OnCreate初始化

                SetContentView(Resource.Layout.Main);
                webView = (WebView)FindViewById(Resource.Id.webView);
                try
                {
                    var dbPath = "/sdcard/zExpress/";
                    var dbFileName = "express.db";
              //初始化sqlite本地库,将来升级加表
                    Common.InitDBAndUpdate(dbPath, dbFileName);
                    //html通过js访问后台C#
                    webView.AddJavascriptInterface(new WebInterface(this, dbPath, dbFileName, webView) as Java.Lang.Object, "CSharp");
                    //避免html
                    webView.SetWebViewClient(new CommonWebViewClient());
              //js权限 
                    WebSettings settings = webView.Settings;
                    settings.JavaScriptEnabled = true;
                    settings.JavaScriptCanOpenWindowsAutomatically = true;
                    
                    webView.LoadData("", "text/html", "utf-8");
                    webView.LoadUrl("file:///android_asset/index.html");
                }
                catch (Exception e)
                {
                    Common.Log("OnCreate", e.Message + "
    " + e.StackTrace);
                }

    3、非首页按返回应该是webview页面返回,在首页按两次返回键退出,以下是OnKeyDown代码

                //webView返回 ,首页点返回 不做 webView返回处理,应该是退出
                if (e.Action == KeyEventActions.Down && keyCode == Keycode.Back && webView.CanGoBack() && !webView.Url.ToLower().EndsWith("index.html"))
                {
                    webView.GoBack();   //后退
                    return true;    //已处理
                }
    
                //再按一次退出程序
                if (keyCode == Keycode.Back && e.Action == KeyEventActions.Down)
                {
                    if (!lastBackKeyDownTime.HasValue || DateTime.Now - lastBackKeyDownTime.Value > new TimeSpan(0, 0, 2))
                    {
                        Toast.MakeText(this.ApplicationContext, "再按一次退出程序", ToastLength.Short).Show();
                        lastBackKeyDownTime = DateTime.Now;
                    }
                    else
                    {
                        Finish();
                    }
                    return true;
                }
                return base.OnKeyDown(keyCode, e);

    4、js插件选取zepto(用法与jQuery一致,而且针对移动端优化),移动端触摸tap取代click

    会jQuery就能零基础使用zepto;关于click事件将会有300毫秒延迟,也是一部分人觉得web在移动端响应非常慢的原因之一,这是由于很久以前为了解决兼容pc的click事件与触摸双击冲突出现的。按理说应该用touchstart、touchend结合处理。这里用tap解决了很多问题,你不会发现有延迟。

    5、为什么打包这么大apk

    原本我引用ExfSoft.Json(很小的json插件)、Mono.Data.Sqlite生成只有不到4MB,但是扫码插件Zxing引入后暴涨到接近10MB

    6、引用Zxing扫码生成报错问题(没VPN)

    刚引入Zxing即使不使用生成都会报错(本人报的还是乱码),清理解决方案再生成可以发现提示连接到谷歌下载android_m2repository_r16.zip失败,并提示本地路径C:Users你的用户名AppDataLocalXamarinAndroid.Support.v4版本号,里面有个0kb的android_m2repository_r16.zip文件,请FQ下载这个文件粘贴到这里。

    提示:安装vs2015会联网,没有VPN安装十分漫长,我这里的webApp只是主要完成了功能,界面切换如果需要动画还需要优化

    编译后的apk、源码、android_m2repository_r16.zip,请移步云盘

    链接: http://pan.baidu.com/s/1bokyrZh 密码: weye

    补充:Zxing、Support.V4  链接:http://pan.baidu.com/s/1boapdAv 密码: 8w3s

    文采有限,净贴代码,敬请谅解

  • 相关阅读:
    JQuery脚本-通过禁用按钮防止表单重复提交
    获得图片的圆形头像效果
    jquery通过submit()和serialize()提交表单
    nginx location 配置阐述优先级别使用说明
    友盟(Swift)-集成、统计用户数量、具体页面访问数量、具体按钮点击数量
    点击按钮,使按钮进行左右翻转动画
    清除指定区域
    语音播报-文字转系统声音
    颜色线性渐变-CAGradientLayer
    popover带箭头弹框
  • 原文地址:https://www.cnblogs.com/ycbt/p/5045185.html
Copyright © 2011-2022 走看看