关闭

使用webView加载html作为app引导页面

标签: webviewhtml
1144人阅读 评论(0) 收藏 举报
分类:

用html的理由

引导页用原生的Android开发也可以做,为何要用html呢?这么麻烦,岂不是增加开发复杂度?
其实不是的,我觉得使用webview+html原因有二:

1、动画效果

因为html结合javascript、css等可以做出一些非常漂亮的动画效果,但是如果用原生开发,机会很难实现。

2、分工

团队开发,可以让对html掌握的比较好的同事负责这一部分的开发,原生开发的人就专心开发其他的功能,而不是纠结于如何实现这种好看的效果。

实现

启动页代码

public class WebViewActivity extends Activity {
    private WebView myWebView;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.webview);

        myWebView = (WebView) findViewById(R.id.myWebView);
        myWebView.getSettings().setJavaScriptEnabled(true);
        // 与js交互,JavaScriptinterface 是个接口,与js交互时用到的,这个接口实现了从网页跳到app中的activity 的方法,特别重要
        myWebView.addJavascriptInterface(new JavaScriptinterface(this), "android");
        myWebView.loadUrl("file:///android_asset/index.html");

    }
}

其中的接口实现为:

public class JavaScriptinterface {

    Activity mActivity;

    public JavaScriptinterface(Activity mActivity) {
        this.mActivity = mActivity;
    }

    /** 与js交互时用到的方法,在js里直接调用的
     *
     * 需要加上@android.webkit.JavascriptInterface注解,否则可能失效
     * */
    @android.webkit.JavascriptInterface
    public void startActivity() {
        Intent intent = new Intent();
        intent.setClass(mActivity, MainActivity.class);
        mActivity.startActivity(intent);
        mActivity.finish();
    }
}

index.html中关键代码(调用接口中定义的startActivity方法)

<script type="text/javascript">
        $('#entry_button').on('click',function() {
            android.startActivity();
        });
    </script>

其中,entry_button是最后一页的按钮id,这段代码意思是,点击entry_button按钮,就猝发startActivity函数。

注:

1、html、css等文件是放在assets文件夹下的,通过webview加载。
2、源代码以及apk
3、还有一个更炫的例子,原文链接

最后一页效果如图:

这里写图片描述

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:56479次
    • 积分:1133
    • 等级:
    • 排名:千里之外
    • 原创:116篇
    • 转载:14篇
    • 译文:0篇
    • 评论:34条
    最新评论