美文网首页我爱编程
Android TextView加载HTMl图文之让图片居中显示

Android TextView加载HTMl图文之让图片居中显示

作者: AmStrong_ | 来源:发表于2018-04-13 15:29 被阅读0次

    上一篇博文解决了图片溢出的问题,现在又发现当图片小于TextView宽度的时候是靠左的,并没有居中显示。这个问题困扰了好久,在网上也搜索不到这种需求的信息。

    探索

    TextView 显示Html内容的时候,图片加载是在ImageGetter中的。getDrawable方法中是获取drawable对象 还没绘制上去,所以肯定无法在这里调整位置。那么就得去寻找绘制的方法:BitmapDrawable这个类了。
    这个类中我们重写了draw方法。

     @Override
            public void draw(Canvas canvas) {
                super.draw(canvas);
                if (bitmap != null) {
                    canvas.drawBitmap(bitmap, 0, 0, getPaint());
                }
            }
    

    有一个canvas画布。有绘制的对象了那么调整绘制的位置也是让图片居中的一种方式。
    所以在这里我使用canvas的宽度,它的宽度是等于TextView 的宽度的,具体方法如下:

    @Override
            public void draw(Canvas canvas) {
                super.draw(canvas);
                if (bitmap != null) {
                    int i = canvas.getWidth() - bitmap.getWidth();
                    canvas.drawBitmap(bitmap, i/2, 0, getPaint());
                }
            }
    

    利用画布的宽度减去图的宽度就是剩余的空白部分了,然后在绘制的时候x轴偏移i/2即可显示为居中。
    注意:在getDrawable中我处理了图片宽度大于textView的情况,所以在这里bitmap的宽度是永远小于或等于canvas的宽度的,不存在i<0的情况。如果有特殊的需求需要注意这一点。

    另外附上完整的ImageGetter类:

    class DetailImageGetter implements Html.ImageGetter {
        private Context context;
        private TextView textView;
    
        DetailImageGetter(Context context, TextView textView) {
            this.context = context;
            this.textView = textView;
        }
    
        @Override
        public Drawable getDrawable(String source) {
            final UrlDrawable drawable = new UrlDrawable();
            Glide.with(context)
                    .load(source)
                    .asBitmap()
                    .diskCacheStrategy(DiskCacheStrategy.RESULT)
                    .into(new SimpleTarget<Bitmap>() {
                        @Override
                        public void onResourceReady(Bitmap resource, GlideAnimation<? super Bitmap> glideAnimation) {
                            float width = textView.getWidth();
                            Loger.debug("width: " + width);
                            if (resource.getWidth() > width) {
                                float scale = width / resource.getWidth();
                                int afterWidth = (int) (resource.getWidth() * scale);
                                int afterHeight = (int) (resource.getHeight() * scale);
                                drawable.setBounds(0, 0, afterWidth, afterHeight);
                                drawable.setBitmap(CommonUtil.resizeBitmap(resource, afterWidth, afterHeight));
                            } else {
                                drawable.setBounds(0, 0, resource.getWidth(), resource.getHeight());
                                drawable.setBitmap(resource);
                            }
                            textView.invalidate();
                            textView.setText(textView.getText());
                        }
                    });
            return drawable;
        }
    
        private class UrlDrawable extends BitmapDrawable {
            private Bitmap bitmap;
    
            @Override
            public void draw(Canvas canvas) {
                super.draw(canvas);
                if (bitmap != null) {
                    int i = canvas.getWidth() - bitmap.getWidth();
                    canvas.drawBitmap(bitmap, i/2, 0, getPaint());
                }
            }
    
            void setBitmap(Bitmap bitmap) {
                this.bitmap = bitmap;
            }
        }
    }
    
    

    CommonUtil.resizeBitmap(resource, afterWidth, afterHeight));就是压缩bitmap 的尺寸。

    /**
         * 使用Matrix将Bitmap压缩到指定大小
         * @param bitmap
         * @param w
         * @param h
         * @return
         */
        public static Bitmap resizeBitmap(Bitmap bitmap, int w, int h)
        {
            int width = bitmap.getWidth();
            int height = bitmap.getHeight();
    
            float scaleWidth = ((float) w) / width;
            float scaleHeight = ((float) h) / height;
    
            Matrix matrix = new Matrix();
            matrix.postScale(scaleWidth, scaleHeight);
    
            return Bitmap.createBitmap(bitmap, 0, 0, width,
                    height, matrix, true);
        }
    

    相关文章

      网友评论

        本文标题:Android TextView加载HTMl图文之让图片居中显示

        本文链接:https://www.haomeiwen.com/subject/scnckftx.html