Android之WebView控件简单使用总结

1.直接通过URL网址打开网页显示内容:loadUrl()

  • 首先在布局中写一个WebView的控件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.ygd.jreduch09.WebViewActivity">
    <Button
        android:id="@+id/bt"
        android:layout_alignParentRight="true"
        android:text="转到"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <EditText
        android:id="@+id/et"
        android:layout_toLeftOf="@+id/bt"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    <WebView
        android:id="@+id/wv"
        android:layout_below="@+id/et"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    </WebView>

</RelativeLayout>
  • 然后在Activity中对WebView进行设置
public class WebViewActivity extends AppCompatActivity {
    private WebView wv;
    private EditText et;
    private Button bt;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_web_view);
        wv= (WebView) findViewById(R.id.wv);
        et= (EditText) findViewById(R.id.et);
        bt= (Button) findViewById(R.id.bt);

        bt.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                String url="http://"+et.getText().toString();
                WebSettings settings=wv.getSettings();  //获取WebSetting对象
                settings.setJavaScriptEnabled(true);    //设置是否支持JavaScript
                settings.setSupportZoom(true);  //设置是否支持缩放
                settings.setDisplayZoomControls(true);  //设置内置缩放控制
                wv.setWebViewClient(new WebViewClient());   //使用WebViewClient作为客户端
                wv.loadUrl(url); //打开一个页面
            }
        });
    }
}
  • 效果图如下:

2.使用WebView加载Html代码:loadDataWithBaseURL()

  • 首先还是在布局中写一个WebView的控件(同上)
  • 然后将html代码连成字符串,调用该方法
public class WebViewHtmlActivity extends AppCompatActivity {
    private WebView wv;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_web_view_html);
        wv= (WebView) findViewById(R.id.wv);
        StringBuilder sbd=new StringBuilder();  //此处尽量使用StringBuilder
        sbd.append("<html>");
        sbd.append("<head><title>加载HTML</title></head>");
        sbd.append("<body>");
        sbd.append("<h1>大标题</h1>");
        sbd.append("<ul>");
        sbd.append("<li>无序列表ul标签</li>");
        sbd.append("</ul>");
        sbd.append("<ol>");
        sbd.append("<li>嵌套li标签</li>");
        sbd.append("</ol>");
        sbd.append("</body>");
        sbd.append("</html>");
        wv.loadDataWithBaseURL(null,sbd.toString(),"text/html","utf-8",null);
    }
}
  • 效果如下:

3.Android与JS相互调用(同时重写WebChromeClient()来显示加载进度)

  • 写好一个Html文件放入项目的assets目录中(没有则在下图位置新建)

  • Html代码如下:
<html>
<head>
    <title>我的第一个网页</title>
    <script>
        function test(){
            var a=1;
            var b=‘星期‘;
            alert(b+a);
        }
    </script>
<body>
<h1>大标题</h1>
<ul>
    <li>你好</li>
    <li>世界</li>
    <li>哈哈</li>
</ul>
<input type="button" onclick="test()" value="点击我">
</body>
</head>
</html>
  • 主函数代码如下:
public class LoadHtmlActivity extends AppCompatActivity {
    private WebView wv;
    private Button bt1,bt2;
    private ProgressBar progressBar;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_load_html);
        wv= (WebView) findViewById(R.id.wv);
        bt1= (Button) findViewById(R.id.bt1);
        bt2= (Button) findViewById(R.id.bt2);
        progressBar= (ProgressBar) findViewById(R.id.pb);
        WebSettings settings=wv.getSettings();
        settings.setJavaScriptEnabled(true);
        wv.setWebChromeClient(new MyClient());
        wv.setWebViewClient(new WebViewClient());
        wv.loadUrl("file:///android_asset/1.html"); //asset不用加s
//        wv.loadUrl("http://www.baidu.com");
        bt1.setOnClickListener(new View.OnClickListener() { //通过布局的button来调用html中的方法
            @Override
            public void onClick(View v) {
                wv.loadUrl("file:///android_asset/1.html");
                wv.loadUrl("javaScript:test()");
            }
        });
        bt2.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                progressBar.setVisibility(View.VISIBLE);
                wv.loadUrl("http://www.baidu.com");
            }
        });
    }

    public class MyClient extends WebChromeClient{
        @Override
        public void onProgressChanged(WebView view, int newProgress) {
            super.onProgressChanged(view, newProgress);
            if(newProgress==100){
                progressBar.setVisibility(View.GONE);
            }
        }
    }
}
时间: 2024-10-28 15:25:56

Android之WebView控件简单使用总结的相关文章

Android自定义用户控件简单范例(一)

一款优秀的移动应用需要具有自己独特统一的风格,通常情况下UI设计师会根据产品需求和使用人群的特点,设计整体的风格,界面的元素和控件的互效果.而原生态的Android控件为开发人员提供的是最基本的积木元素,如果要准确地传递统一的视觉效果和交互体验,对控件的自定义使用是非常有必要的. 这篇文章通过一个简单的从Java后台程序中进行创建的示例来说明Android自定义控件的运行原理. <LinearLayout xmlns:android="http://schemas.android.com/

Android自定义用户控件简单范例(二)

对于完全由后台定制的控件,并不是很方便其他人的使用,因为我们常常需要看到控件放到xml界面上的效果,并根据效果进行布局的调整,这就需要一个更加标准的控件制作流程: 我们的自定义控件和其他的控件一样,应该写成一个类,而这个类的属性是是有自己来决定的. 我们要在res/values目录下建立一个attrs.xml的文件,并在此文件中增加对控件的属性的定义. 使用AttributeSet来完成控件类的构造函数,并在构造函数中将自定义控件类中变量与attrs.xml中的属性连接起来. 在自定义控件类中使

修复android下webView控件的总结

游戏中有一个收集玩家问题反馈的网页,很早之前就有同事反映说android在游戏无法上传附件,在浏览器中是可以正常使用的.最近能腾出手来的时候,就仔细看了一下这个问题,发现很里藏着不少问题,这里一一记录下来,希望能其它人有用,因为很多问题跟网上反映出来可能有点不太一样.   既然是网页,而且只在游戏中才出现,那第一步你要先会使用Fiddler来拦截请求,定位出问题的代码在哪里.你可以参考这篇文章,抓包已经讲的已经非常详细了,Step By Step  Fiddler (四) 实现手机的抓包 在Fi

Android 自定义组合控件 简单导航栏

最近在做项目的过程中,发现项目中好多界面的导航栏都很类似或者一样,但是每次都要重复写同样的代码,觉得很不爽,所以就简单地自定义了一下导航栏控件. 先上图: 导航栏包括: 返回按钮 标题 右侧按钮(功能不确定) 首先是布局文件,如下: <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res

Android中通过WebView控件实现与JavaScript方法相互调用的地图应用

在Android中通过WebView控件,可以实现要加载的页面与Android方法相互调用,我们要实现WebView中的addJavascriptInterface方法,这样html才能调用android方法,在这里我个人觉得有点和DWR相似. 为了让大家容易理解,我写了一个简单的Demo,具体步骤如下: 第一步:新建一个Android工程,命名为WebViewDemo(这里我在assets里定义了一个html页面). 第二步:修改main.xml布局文件,增加了一个WebView控件还有But

Android ListView列表控件的简单使用

ListView 列表是我们经常会使用的控件, 如果想要自定义里面的显示的话是挺麻烦的, 需要新建XML.Class SimpleAdapter这两个文件, 较为麻烦. 如果我们只是想显示两.三行文字在上面, 却又不想那么麻烦呢? 那我们只要新建一个XML就够了.  这里以显示一个ListView项里三个TextView为例.  首先我们要创建一个XML文件, 这个XML文件是用来作为单个ListView项布局用的.  list_row.xml[java]<?xml version="1.

Android Design Support控件之DrawerLayout简单使用

DrawerLayout能够让我们在项目中非常方便地实现側滑菜单效果.如今主流的应用如QQ等都 採用的这样的效果. 这两天也是在学习Android Design Support的相关知识.网上有关这方面的文章介绍非常多.可是为了方便以后使用,还是把学习的知识做个简单记录.这次的代码也是在上一篇博客Android Design Support控件介绍之TabLayout的基础上加入的布局和代码. 主界面布局: <?xml version="1.0" encoding="u

android WebView控件显示网页

有时需要app里面显示网页,而不调用其他浏览器浏览网页,那么这时就需要WebView控件.这个控件也是很强大的,放大,缩小,前进,后退网页都可以. 1.部分方法 //支持javascriptweb.getSettings().setJavaScriptEnabled(true); // 设置可以支持缩放 web.getSettings().setSupportZoom(true); // 设置出现缩放工具 web.getSettings().setBuiltInZoomControls(true

android学习五(android中基本控件的使用)

前面已经学了activity的一些使用,那么下面我们进行android中基本的控件的学习和使用. 1.android中的TextView控件 新建一个项目,项目名为UITest,才有默认的设置,修改布局文件的内容,如下: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" a