Giter Site home page Giter Site logo

youlookwhat / bywebview Goto Github PK

View Code? Open in Web Editor NEW
1.5K 44.0 292.0 11.45 MB

🌏 WebView 全方面使用,JS交互、进度条、上传图片、错误页面、视频全屏播放、唤起原生App、获取网页源代码、被作为第三方浏览器打开、DeepLink、[腾讯x5使用示例]

Home Page: https://youlookwhat.github.io/ByWebView

License: Apache License 2.0

Java 88.10% HTML 8.15% CSS 2.73% JavaScript 1.02%
android-webview webview tencent-x5 x5 deeplink android

bywebview's Introduction

ByWebView

JitPack API download

Features

  • 基本配置使用(宽度自适应、返回网页上一层、显示网页标题等)
  • 唤起三方应用(拨打电话、发送短信、发送邮件等)
  • 上传图片(版本兼容)
  • 错误页面处理
  • 全屏播放网络视频
  • 与Js交互实例
  • 优雅的进度条显示控件

Demo示例:

  • DeepLink的基本使用
  • 被作为第三方浏览器打开
  • 与ToolBar联动,自定义WebView
  • 腾讯x5使用示例

Document

Screenshots

bywebview

Download

引用

  1. Add the JitPack repository to your build file
allprojects {
   repositories {
   	...
   	maven { url 'https://jitpack.io' }
   }
}
  1. Add the dependency:
dependencies {
   implementation 'com.github.youlookwhat:ByWebView:1.2.1'
}

Use

byWebView = ByWebView
        .with(this)
        .setWebParent(container, new LinearLayout.LayoutParams(-1, -1))
        .useWebProgress(ContextCompat.getColor(this, R.color.coloRed))
        .loadUrl(mUrl);

与Js交互

  • 调用Js方法:
// 无参数调用
byWebView.getLoadJsHolder().quickCallJs("javacalljs");
// 传递参数调用
byWebView.getLoadJsHolder().quickCallJs("javacalljswithargs", "android传入到网页里的数据,有参");
  • Js调用Java方法:
ByWebView.with(this)
	.addJavascriptInterface("injectedObject", new MyJavascriptInterface(this))
	.loadUrl(mUrl);
window.injectedObject.startFunction()

生命周期处理

@Override
protected void onPause() {
    super.onPause();
    byWebView.onPause();
}

@Override
protected void onResume() {
    super.onResume();
    byWebView.onResume();
}

@Override
protected void onDestroy() {
    byWebView.onDestroy();
    super.onDestroy();
}

返回操作

@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
    if (byWebView.handleKeyEvent(keyCode, event)) {
        return true;
    } else {
        return super.onKeyDown(keyCode, event);
    }
}

上传图片之后的回调

@Override
protected void onActivityResult(int requestCode, int resultCode, Intent intent) {
    byWebView.handleFileChooser(requestCode, resultCode, intent);
}

监听 标题、进度条、WebViewClient

byWebView = ByWebView
        .with(this)
        .setWebParent(container, new LinearLayout.LayoutParams(-1, -1))
        .useWebProgress(ContextCompat.getColor(this, R.color.coloRed))
        .setOnTitleProgressCallback(onTitleProgressCallback)
        .setOnByWebClientCallback(onByWebClientCallback)
        .addJavascriptInterface("injectedObject", new MyJavascriptInterface(this))
        .loadUrl(mUrl);
private OnTitleProgressCallback onTitleProgressCallback = new OnTitleProgressCallback() {
    @Override
    public void onReceivedTitle(String title) {
        Log.e("---title", title);
    }

    @Override
    public void onProgressChanged(int newProgress) {
        // 返回的进度
    }

    @Override
    public boolean onHandleScreenOrientation(boolean isShow) {
        // 返回true,视频全屏时,横竖屏自己处理
        return false;
    }
};

private OnByWebClientCallback onByWebClientCallback = new OnByWebClientCallback() {

    @Override
    public void onPageStarted(WebView view, String url, Bitmap favicon) {
        
    }

    @Override
    public boolean onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
        // 如果自己处理,需要返回true
        return super.onReceivedSslError(view, handler, error);
    }

    @Override
    public void onPageFinished(WebView view, String url) {
        // 网页加载完成后的回调
    }

    @Override
    public boolean isOpenThirdApp(String url) {
        // 处理三方链接
        Log.e("---url", url);
        return ByWebTools.handleThirdApp(ByWebViewActivity.this, url);
    }
};

自定义错误页面

ByWebView.with(this)
	.setErrorLayout(R.layout.by_load_url_error,"无法打开网页")
	.loadUrl(mUrl);

完整设置

byWebView = ByWebView
        .with(this)
        .useWebProgress(true) // 是否使用进度条,默认true,如使用可不用配置
        .setWebParent(container, new LinearLayout.LayoutParams(-1, -1)) // 设置WebView父容器
        .useWebProgress("#ffb6cf", "#ff0000", 3)// 进度条渐变色(开始颜色,结束颜色,高度)
        .setOnTitleProgressCallback(onTitleProgressCallback)// title 和 progress 监听
        .setOnByWebClientCallback(onByWebClientCallback)    // WebViewClient监听
        .setErrorLayout(R.layout.by_load_url_error, "无法打开网页") // 设置错误页面及标题
        .addJavascriptInterface("injectedObject", new MyJavascriptInterface(this)) // 设置Js监听
        .loadUrl(mUrl);

Tip

  • 混淆时应加上(通过JS向网页传值,如不加有时候会传值失败):

    -keepattributes *Annotation*
    -keepattributes *JavascriptInterface*
    -keepclassmembers class * {
       @android.webkit.JavascriptInterface <methods>;
    }

Thanks

Other

bywebview's People

Contributors

nicennnnnnnlee avatar youlookwhat avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

bywebview's Issues

拍照问题

大佬好,使用input标签,设置accept="image/*",只能拉起选择照片,那拍照怎么拉起来?还是说拉不起来,只能写webview和原生的交互来实现???

你好 又是我

public void onReceivedSslError()
这个我也想自己控制 我需要跳过ssl认证

我有个想法 你把ByWebViewClient改成可继承的
然后ByWebView可以让我传一个ByWebViewClient的子类进去 你看这样行不

建议新增一个webView.postUrl()的入口.

如果需要调用WebView的postUrl的时候,没有入口.
只能调用 byWebView.loadUrl(url).getWebView().postUrl(xxx).
这样写有问题.本身就调用loadUrl()一次,然后再去postUrl()一次.

建议在ByWebView的Builder里面新增一个方法postUrl(String url, byte[] postData).

public ByWebView postUrl(String url, byte[] postData) {
ByWebView byWebView = new ByWebView(this);
byWebView.getWebView().postUrl(url, postData);
return byWebView;
}

进度条bug

网页加载完了 进度条还在vue的网站
image

老是弹出记住密码~

想请教一个问题,我关闭了记住密码和表单数据 webSetting.setSaveFormData(false)和 webSetting.setSavePassword(false);
image

腾讯X5内核并没有调用成功

据腾讯TBS接口文档介绍,X5内核中的 webview 是兼容原生 webview 的,当X5内核没有成功调用时,会自动以原生webview代替。

证据:使用X5内核打开网页时,选择网页上的文字会显示两个水滴状的选择器,如下图:
图片

本项目中选择腾讯X5内核后,打开的网页如下图,选择器不是水滴状的:
图片
图片

所以,本项目中的腾讯X5内核并没有成功调用。
这里发一个能够成功使用腾讯X5内核的示例项目作参考:
https://github.com/daleige/AndroidSamples/tree/master/TBSDemo

Js交互问题

如果只有一个方法名,这个地方要怎么加呢,.addJavascriptInterface("injectedObject", new MyJavascriptInterface(this))

页面重新加载问题

具体场景:登录成功后获取缓存中的token网页重新加载

参数url()需要重新生成,用loadurl会新起一个页面,用reload不能传参数
byWebView.getWebView().loadUrl(url());

byWebView.getWebView().reload();

建议把FrameLayout 用一个自定义FrameLayout 来实现, 可以让使用方继承

` private ByWebView(Builder builder) {
this.activity = builder.mActivity;
this.mErrorTitle = builder.mErrorTitle;
this.mErrorLayoutId = builder.mErrorLayoutId;

    FrameLayout parentLayout = new FrameLayout(activity);
    // 设置WebView
    setWebView(builder.mCustomWebView);
    parentLayout.addView(mWebView, new FrameLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
    // 进度条布局
    handleWebProgress(builder, parentLayout);
    if (builder.mIndex != -1) {
        builder.mWebContainer.addView(parentLayout, builder.mIndex, builder.mLayoutParams);
    } else {
        builder.mWebContainer.addView(parentLayout, builder.mLayoutParams);
    }`

拍照问题

大佬好,使用input标签,设置accept="image/*",只能拉起选择照片,那拍照怎么拉起来?还是说拉不起来,只能写webview和原生的交互来实现???

图片点击显示

您好,能否提供网页完全打开后,点图片的占位符后再显示的图片的功能呢?
类似于网易新闻客户端和知乎的功能呢?
谢谢!

有時候會出現第二個灰色進度條

作者你好,

我發現有時候讀取網頁會出現第二條灰色進度條,而且沒辦法改顏色。
請參考下面的圖:

Screen Shot 2022-01-27 at 2 13 40 PM

Screen Shot 2022-01-27 at 2 13 57 PM

Screen Shot 2022-01-27 at 2 14 08 PM

想請問有沒有方法可以移除第二個進度條?或是改它的顏色呢?
謝謝!

程式碼:

private fun initWebView() {
        byWebView = ByWebView
            .with(this)
            .useWebProgress(getColor(R.color.red500))
            .setWebParent(
                binding.container,
                FrameLayout.LayoutParams(
                    ViewGroup.LayoutParams.MATCH_PARENT,
                    ViewGroup.LayoutParams.MATCH_PARENT
                )
            )
            .setOnTitleProgressCallback(titleCallback)
            .setOnByWebClientCallback(byWebClientCallback)
            .loadUrl(currentUrl)
    }

图片长按监听问题

我重写了
`.addJavascriptInterface("injectedObject", new MyJavascriptInterface(this){
/**
* 前端代码嵌入js:
* imageClick 名应和js函数方法名一致
*
* @param src 图片的链接
*/
@OverRide
public void imageClick(String src) {
super.imageClick(src);
Toast.makeText(ByWebViewActivity.this, src, Toast.LENGTH_SHORT).show();
}

                  })`

无法回调问题,

心疼作者一下下。

从另一个项目跳过来的,那个项目改了个名字。代码没怎么看是不是一样。那个作者不回复任何Issues,而且截图都有跟这个项目一样的。。Star都到500多了。哈哈哈。。。。。

示例app输入网址时跳转出错

ByWebTools.getUrl(String url)存在问题,当url以http开头时返回空字符串。
这导致输入网址时老是跳到你这个项目来😳

public static String getUrl(String url) {
String urlResult = "";
if (TextUtils.isEmpty(url)) {
// 空url
return urlResult;
} else if (!url.startsWith("http") && url.contains("http")) {
// 有http且不在头部
urlResult = url.substring(url.indexOf("http"));
} else if (url.startsWith("www")) {
// 以"www"开头
urlResult = "http://" + url;
} else if (!url.startsWith("http") && (url.contains(".me") || url.contains(".com") || url.contains(".cn"))) {
// 不以"http"开头且有后缀
urlResult = "http://www." + url;
} else if (!url.startsWith("http") && !url.contains("www")) {
// 输入纯文字的情况
urlResult = "http://m5.baidu.com/s?from=124n&word=" + url;
}
return urlResult;
}

在模拟器上全屏播放视频时报错

2021-08-29 17:44:13.530 3073-3073/com.example.jingbin.webviewstudy E/AndroidRuntime: FATAL EXCEPTION: main
Process: com.example.jingbin.webviewstudy, PID: 3073
java.lang.NullPointerException: Attempt to invoke virtual method 'int android.view.View.getVisibility()' on a null object reference
at me.jingbin.web.ByWebChromeClient.onProgressChanged(ByWebChromeClient.java:130)
at Fa.d(chromium-TrichromeWebViewGoogle.apk-stable-410410681:3)
at Cs.handleMessage(chromium-TrichromeWebViewGoogle.apk-stable-410410681:57)
at android.os.Handler.dispatchMessage(Handler.java:106)
at android.os.Looper.loop(Looper.java:223)
at android.app.ActivityThread.main(ActivityThread.java:7656)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:592)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:947)

视频问题

如果视频本来是竖着的,全屏后就自己来回切换,不知道作者有注意到这个问题没

老师能帮我吗?谢谢你。

我只是想做一个app,实现:
调用一个最简单的网页(不需要上传之类的),然后按返回键不退出,依旧在后台呆着。
按返回键后,表单输入的内容在下次打开这个app时依旧在(类似于微信)。
希望整个app体积不超过10K,在后台不大量耗内存。

我看了老师的文章,没做成功。
老师能帮我吗?谢谢你。

在Android Pie 上面HTTP链接打不开

环境
OS:Android Pie
Device: OnePlus 6

临时解决方案:
在AndroidManifest.xml文件中的application节点中,配置:android:usesCleartextTraffic=“true”

报错,希望修复一下webView的这个错误(应该是webView的错误吧)

java.lang.NullPointerException: Attempt to invoke virtual method 'int android.graphics.Bitmap.getWidth()' on a null object reference at com.android.webview.chromium.WebViewContentsClientAdapter.getDefaultVideoPoster(WebViewContentsClientAdapter.java:1142) at org.chromium.android_webview.DefaultVideoPosterRequestHandler$1.run(DefaultVideoPosterRequestHandler.java:39) at android.os.Handler.handleCallback(Handler.java:815) at android.os.Handler.dispatchMessage(Handler.java:104) at android.os.Looper.loop(Looper.java:224) at android.app.ActivityThread.main(ActivityThread.java:5958) at java.lang.reflect.Method.invoke(Native Method) at java.lang.reflect.Method.invoke(Method.java:372) at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1113)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.