之前公司项目需要做截取长图，网上找了半天全是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的同学可以留言我 我找个时间写出来然后分享给大家吧。如果有什么不足希望大家给指出来。
转载什么请注明出处- -感恩大家 笔芯~
