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里面拿到的ID
private 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的同学可以留言我 我找个时间写出来然后分享给大家吧。如果有什么不足希望大家给指出来。

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