day13：webview

最新推荐文章于 2019-09-27 17:08:26 发布

_yao_

最新推荐文章于 2019-09-27 17:08:26 发布

阅读量1k

点赞数 1

分类专栏：安卓2新

本文链接：https://blog.csdn.net/qq_34178710/article/details/99689359

版权

安卓2新专栏收录该内容

23 篇文章 20 订阅

订阅专栏

https://www.jianshu.com/p/86bee7775d0e 参考博客

一.html页面：

<!DOCTYPE html>
<html>
	<!--头-->
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			//定义方法：修改文字
			function text(){
				//找到text_id控件修改
				document.getElementById("text_id").innerText="哈哈哈哈";
			}
			function text_arg(str){
	
				//找到text_id控件修改
				document.getElementById("text_id").innerText=str;
			}
			
			//定义方法：修改图片
			function image(){
				//找到img_id控件修改
				document.getElementById("img_id").src="img/HBuilder.png";
			}
			function image_arg(img_src){
				//找到img_id控件修改
				document.getElementById("img_id").src=img_src;
			}
			
			//js调用安卓代码
			function tusi(){
				window.android.tusi();
			}
		</script>
	</head>
	<!--身体-->
	<body>
		<p id="text_id">我是文字</p>
		<img id="img_id" width="200" height="200"
			src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1562587162663&di=58b961a5726901f5d3b97f8924ddc189&imgtype=0&src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fitem%2F201811%2F10%2F20181110102045_jwqny.jpg"/>
		<button id="bt1_id" onclick="tusi()">调用安卓代码弹出对话框</button>
		<button id="bt2_id" onclick="text('湖的样真帅')">修改文字</button>
		<button id="bt3_id" onclick="image_arg('img/HBuilder.png')">修改图片</button>
	</body>
</html>

二.Webview显示网页：

1.加载本地assert下面的html

//(1)：加载本地网页
        webView.loadUrl("file:///android_asset/demo2.html");//加载本地assert下的html页面

2.加载外部网页

//(2)：加载外部网页：必须设置setWebViewClient，不然只能通过本地浏览器打开
         webView.loadUrl("http://www.baidu.com");
         webView.setWebViewClient(new WebViewClient(){//将网页加载到自己的webview中
             @Override
             public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
                 view.loadUrl("http://www.baidu.com");
                 return true;
             }
         });

3.加载页面的过程中显示进度

 final ProgressDialog progressDialog = new ProgressDialog(this);
        progressDialog.setMessage("正在加载");
        progressDialog.show();
        //TODO 2：设置加载进度，当没有加载完毕 显示进度条对话框
        webView.setWebChromeClient(new WebChromeClient(){
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                super.onProgressChanged(view, newProgress);
                Log.d("ytx", "onProgressChanged: "+newProgress);
                if(newProgress==100){
                    progressDialog.dismiss();
                }
            }
        });

4.完整代码

public class WebActivity extends AppCompatActivity {
    private WebView webView;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_web);

        webView = findViewById(R.id.web_view);
        webView.loadUrl("https://www.jianshu.com/p/153da5bf8347");
        //显示进度条对话框模拟家在进度
        final ProgressDialog progressDialog = new ProgressDialog(this);
        progressDialog.setTitle("页面正在加载中");
        progressDialog.show();

        //TODO 1:保证所有的网页在app中打开，而不会跳转到浏览器打开
        webView.setWebViewClient(new WebViewClient());
        //TODO 2:获得webview的加载过程
        webView.setWebChromeClient(new WebChromeClient(){
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                super.onProgressChanged(view, newProgress);
                //newProgress 进度
                if(newProgress == 100){
                    progressDialog.dismiss();//关闭对话框
                }
            }
        });


    }
    //TODO 3：页面的前进和后退
    //点击手机上的三个按键
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if(keyCode == KeyEvent.KEYCODE_BACK){//按了手机上的返回键
            //判断网页是否还可以后退
            if(webView.canGoBack()){//可以后退
                webView.goBack();//后退一步
                return false;//不关闭当前activity
            }else{
                return super.onKeyDown(keyCode, event);//关闭当前activity
            }

        }

        return super.onKeyDown(keyCode, event);
    }
    //TODO 4：activity销毁的时候 webview销毁掉 节省资源
    @Override
    protected void onDestroy() {
        super.onDestroy();
        if(webView != null){
            webView.clearCache(true);//清除缓存
            webView.clearHistory();//清除历史记录
            webView.clearFormData();//清除数据
            webView.destroy();//销毁webview

        }
    }
}

三.混合开发：安卓和js做交互：

1.安卓中调用js代码

想要混合开发，必须设置可以调用js

webView.getSettings().setJavaScriptEnabled(true);//设置允许访问js
webView.getSettings().setAllowFileAccess(true);//设置允许访问文件

//无参方法
mWebView.loadUrl("JavaScript:text()");
//有参方法
webView.loadUrl("JavaScript:text_arg('湖的样真帅')");
webView.loadUrl("JavaScript:image_arg('http:\\/\\/www.qubaobei.com\\/ios\\/cf\\/uploadfile\\/132\\/9\\/8289.jpg')");
//加载SD卡中图片
webView.loadUrl("JavaScript:image_arg('/sdcard/a.jpg')");

2.js调用安卓代码

1.生命接口标记名称

webView.getSettings().setJavaScriptEnabled(true);//设置允许访问js
mWebView.addJavascriptInterface(this,"android");
webView.getSettings().setJavaScriptEnabled(true);//设置允许访问js

2.安卓中提供方法

    @JavascriptInterface
    public void tusi(){
        Toast.makeText(this, "10086", Toast.LENGTH_SHORT).show();
    }

3.html页面

//js调用安卓代码
			function tusi(){
				window.android.tusi();
			}

四.webview其他属性设置都是Setttings的方法

1.打开页面时，自适应屏幕

WebSettings webSettings = mWebView .getSettings();
webSettings.setUseWideViewPort(true);//设置此属性，可任意比例缩放
webSettings.setLoadWithOverviewMode(true);

2.支持缩放

WebSettings webSettings = mWebView .getSettings();
webSettings.setBuiltInZoomControls(true);
webSettings.setSupportZoom(true);

3.可以访问文件

WebSettings webSettings = mWebView .getSettings();
webSettings.setAllowFileAccess(true); //设置可以访问文件

五.webview的销毁和清除历史记录

1.清除历史记录

webView.clearHistory();

2.销毁：activity销毁的时候，webview销毁

@Override
protected void onDestroy() {
super.onDestroy();
if(webView!=null){
webView.destroy();
webView=null;
}
}

六。项目中的应用

public void initWebView(WebView webView) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            WebView.setWebContentsDebuggingEnabled(true);
        }
        webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
        //不能横向滚动
        webView.setHorizontalScrollBarEnabled(false);
        //不能纵向滚动
        webView.setVerticalScrollBarEnabled(false);
        //允许截图
        webView.setDrawingCacheEnabled(true);
        //屏蔽长按事件
        webView.setOnLongClickListener(new View.OnLongClickListener() {
            @Override
            public boolean onLongClick(View v) {
                return false;
            }
        });
        //初始化WebSettings
        final WebSettings settings = webView.getSettings();
        settings.setJavaScriptEnabled(true);
        final String ua = settings.getUserAgentString();
        settings.setUserAgentString(ua + "Latte");
        //隐藏缩放控件
        settings.setBuiltInZoomControls(false);
        settings.setDisplayZoomControls(false);
        //禁止缩放
        settings.setSupportZoom(false);
        //文件权限
        settings.setAllowFileAccess(true);
        settings.setAllowFileAccessFromFileURLs(true);
        settings.setAllowUniversalAccessFromFileURLs(true);
        settings.setAllowContentAccess(true);
        //缓存相关
        settings.setAppCacheEnabled(true);
        settings.setDomStorageEnabled(true);
        settings.setDatabaseEnabled(true);
        settings.setCacheMode(WebSettings.LOAD_DEFAULT);
        initWebViewClient(webView);
        webView.loadUrl(getIntent().getStringExtra(Constants.url));
        //initWebView(webView);
    }

练习手册：

题目一：

1.写html页面，使用webview加载html页面，并设置加载进度
2.html上面有个按钮拍照
3.点击拍照按钮，调用安卓代码进行拍照(js调用安卓)
4.将拍完的照片显示在HTML的img标签上面（安卓调用js）
其他功能
(1)html有摄像按钮，摄像之后播放视频
(2)html有截图按钮，截图并保存
(3)html有打电话按钮，使用内容提供者获得手机联系人，点击拨打电话
(4)html有打开浏览器按钮，打开系统浏览器

题目二：

1.登陆成功后跳转主页面列表展示：具有上啦和下拉
https://temp.163.com/special/00804KVA/cm_yaowen.js?callback=data_callback
在这里插入图片描述
2.点击查看新闻详情：
点击item跳转到新闻页面：docurl字段网址
点击下面的评论跳转到评论页面：commenturl字段

_yao_

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
day13：webview

第13天webview一.html页面：二.Webview显示网页：1.加载本地assert下面的html2.加载外部网页3.加载页面的过程中显示进度三.混合开发：安卓和js做交互：1.安卓中调用js代码2.js调用安卓代码一.html页面：<!DOCTYPE html><html>  <head> <meta c...
复制链接

扫一扫