我们项目最近需要微信分享员工二维码功能,二维码图片直接使用zxing就可以生成,但是生成之后只有一个图片,而我们需求的要求是这样的:
没错就是二维码下边有一行提示文字,你可能会想直接imageview下边放个textview就行了,没错这样在你的APP里显示效果确实是达到了,但是还要在二维码分享到朋友圈或者其他朋友时也是这个样子的啊,所以没办法,只能是得到二维码图片时再重新创建一张图片把文字也画上来,分享的时候就分享新图片就可以了,这个实现起来也很简单的,下面就来说说怎么画。
思路:
1.获取到二维码图片的高度bitmapHeight宽度bitmapWidth;
2.根据文字大小计算出二维码宽度的一行可以放多少个文字count,然后根据文字长度和count计算出需要几行来显示文字;
3.之后新建一个Bitmap对象,它的宽度就是图片宽度,高度是图片高度+配文与图片间的间距+文字大小*文字行数+文字间的行间距*文字行数;
4.以Bitmap构建画布对象,先将二维码画上来,然后在二维码下边画出以配文与图片间的间距+文字大小*文字行数+文字间的行间距*文字行数为高度的一个白底矩形,用来盛放文字(这里说一下为什么要画这个矩形,是因为我们的项目要求可以保存这张图片,而保存到相册后,手机相册背景是黑色的,我们不画这个白色矩形背景的话,文字默认背景就是透明的,而文字如果设置成黑色,这时候就会感觉你的图片只有二维码没有下边的配文了,不符合要求,也不美观);
5.用一个循环来画出文字,返回新的图片。
思路就是这些了,我觉得我说的很细了,下边就看看代码吧,我写注释都很详细,就不再另外介绍了:
主要变量含义
/**传递进来的源图片*/ private Bitmap source; /**图片的配文*/ private String text; /**图片加上配文后生成的新图片*/ private Bitmap newBitmap; /**配文的颜色*/ private int textColor = Color.BLACK; /**配文的字体大小*/ private float textSize = 16; /**图片的宽度*/ private int bitmapWidth; /**图片的高度*/ private int bitmapHeight; /**画图片的画笔*/ private Paint bitmapPaint; /**画文字的画笔*/ private Paint textPaint; /**配文与图片间的距离*/ private float padding = 20; /**配文行与行之间的距离*/ private float linePadding = 5;主要代码
bitmapWidth = source.getWidth(); bitmapHeight = source.getHeight(); //一行可以显示文字的个数 int lineTextCount = (int) ((source.getWidth()-50)/textSize); //一共要把文字分为几行 int line = (int) Math.ceil(Double.valueOf(text.length())/Double.valueOf(lineTextCount)); //新创建一个新图片比源图片多出一部分,后续用来与文字叠加用 newBitmap = Bitmap.createBitmap(bitmapWidth, (int) (bitmapHeight+padding+textSize*line+linePadding*line), Bitmap.Config.ARGB_8888); Canvas canvas = new Canvas(newBitmap); //把图片画上来 canvas.drawBitmap(source,0,0,bitmapPaint); //在图片下边画一个白色矩形块用来放文字,防止文字是透明背景,在有些情况下保存到本地后看不出来 textPaint.setColor(Color.WHITE); canvas.drawRect(0,source.getHeight(),source.getWidth(), source.getHeight()+padding+textSize*line+linePadding*line,textPaint); //把文字画上来 textPaint.setColor(textColor); textPaint.setTextSize(textSize); Rect bounds = new Rect(); //开启循环直到画完所有行的文字 for (int i=0; i<line; i++) { String s; if (i == line-1) {//如果是最后一行,则结束位置就是文字的长度,别下标越界哦 s = text.substring(i*lineTextCount, text.length()); } else {//不是最后一行 s = text.substring(i*lineTextCount, (i+1)*lineTextCount); } //获取文字的字宽高以便把文字与图片中心对齐 textPaint.getTextBounds(s,0,s.length(),bounds); //画文字的时候高度需要注意文字大小以及文字行间距 canvas.drawText(s,source.getWidth()/2-bounds.width()/2, source.getHeight()+padding+i*textSize+i*linePadding+bounds.height()/2,textPaint); } canvas.save(Canvas.ALL_SAVE_FLAG); canvas.restore();