react-native Android截屏长图

之前公司项目需要做截取长图，网上找了半天全是ios的，可能我比较蠢没找到android截取长图的react- native 的博客或者开源的东西，然后公司需要啊，我能怎么办？我也很绝望啊。别怕，头很硬，就是怼。然后在和IOS这边探讨的过程中发现了一个方法，本着撞哭自己想法开始撸了，然后发现其实并不难。希望给有需要用到的童鞋一点借鉴吧，抛砖引玉。

大家都知道实际rn很多的东西实际上帮android的一些东西进行了封装然后在一个activity上怼，那么rn本身是怎么在activity上怼图的呢。实际上rn封装了一个方法，ReactNative.findNodeHandle()，对就是这个玩意。参数是你rn里面控件的ref，ReactNative.findNodeHandle(this.refs.view)这个玩意是啥？黑人尼克扬脸，打印出来一看发现是个int 类型- -咦，int类型是不是感觉有点眉目了？ ios的是tag，android的是id 。那么问题又来了，我拿到了这个id 我如何去android里面找呢本身R文件里面没有生成。没关系我们通过findViewById(android.R.id.content）去拿到根布局.就是下面方法的第一个参数 ViewGroup 然后开始撸吧。

//传入根布局和在RN里面拿到的IDprivate void findView(ViewGroup viewGroup, int id) {  //遍历根布局取出ID递归进行比对    for (int i = 0; i < viewGroup.getChildCount(); i++) {        View view = viewGroup.getChildAt(i);        if (view instanceof ViewGroup) {            if (id == view.getId()) {//                    System.out.println("test"+"------------>"+view.getId());                ViewGroup = (ViewGroup) view;            }//                System.out.println("test"+"------------>"+view.getId());            findView((ViewGroup) viewGroup.getChildAt(i), id);        } else {//                System.out.println("test"+"------------>"+viewGroup.getChildAt(i).getId());        }    }}

然后拿到了ViewGroup 你就可以做想要做的事情了截取屏幕
/**
* 截取scrollview的屏幕或者换成listview没太多区别
*
* @param ViewGroup
* @return
*/
public static Bitmap getBitmapByView(ViewGroup ViewGroup) {
int h = 0;
Bitmap bitmap = null;
// 获取scrollview实际高度
for (int i = 0; i < ViewGroup.getChildCount(); i++) {
h += ViewGroup.getChildAt(i).getHeight();
ViewGroup.getChildAt(i).setBackgroundColor(
Color.parseColor("#ffffff"));
}
// 创建对应大小的bitmap
bitmap = Bitmap.createBitmap(ViewGroup.getWidth(), ViewGroup.getHeight(),
Bitmap.Config.RGB_565);
final Canvas canvas = new Canvas(bitmap);
ViewGroup.draw(canvas);
return bitmap;
}

/** * 压缩图片 * * @param image * @return */public static Bitmap compressImage(Bitmap image) {    ByteArrayOutputStream baos = new ByteArrayOutputStream();    // 质量压缩方法，这里100表示不压缩，把压缩后的数据存放到baos中    image.compress(Bitmap.CompressFormat.JPEG, 100, baos);    int options = 100;    // 循环判断如果压缩后图片是否大于100kb,大于继续压缩    while (baos.toByteArray().length / 1024 > 100) {        // 重置baos        baos.reset();        // 这里压缩options%，把压缩后的数据存放到baos中        image.compress(Bitmap.CompressFormat.JPEG, options, baos);        // 每次都减少10        options -= 10;    }    // 把压缩后的数据baos存放到ByteArrayInputStream中    ByteArrayInputStream isBm = new ByteArrayInputStream(baos.toByteArray());    // 把ByteArrayInputStream数据生成图片    Bitmap bitmap = BitmapFactory.decodeStream(isBm, null, null);    return bitmap;}

最终拿到了bitmap 就可以分享出去了

http://git.oschina.net/xiaobeixu/react-native-shareCooperation
demo地址有不清楚的地方可以问哈

主要核心思路和代码给了如果还有不懂得同学或者想要demo的同学可以留言我我找个时间写出来然后分享给大家吧。如果有什么不足希望大家给指出来。

转载什么请注明出处- -感恩大家笔芯~

更多相关文章

随机推荐