EditText利用SpannableString和ImageSpan将字符串解析成图文混合形式

完整项目Github链接：FLAGS

在EditText中实现图文混排的方法在上一篇博客中已经说了，链接在此：android的EditText里文字和图片混合编辑与显示

那篇博客里确实实现了如何在EditText中插入图片，并将如何显示的方法都写出来了，仿佛没问题，但是当我想把它保存到数据库的时候莫名报错了，我输出一看，好家伙，那篇文章用到了ImageGetter，但是只能用于显示，而当调用EditText.getText().toString()后，图片那个地方输出的是用虚线框框住的OBJ ，而不是我想象中的<img src="xxx"/> ，没法保存，而且就算保存了也无法拿出来再显示了。

而解决办法就在这篇博客了，自己用正则式对其做一个解析。

声明一下，我的上篇博客使用了Spannable和ImageSpan来加载图片，不了解Spannable和ImageSpan的可以看这篇博客（很短很好理解）：android 图文结合，使用SpannableString和ImageSpan类

然后我的图片格式是这样：<img src="图片在本地的路径" />

所以我的content保存的内容形式是这样：

我爱吃东西<img src="/storage/emulated/0/DCIM/Camera/IMG_20180220_184453.jpg"/>胖啊胖啊

那么如何将这种格式的字符串重新解析成图文混合的形式呢？

思路如下：
首先将代表图片的字符串全部提取出来，即<img src="xxx" /> ，然后将里面的图片地址提取出来，但是要保存<img ....> 这一段的起始地址和结束地址，用于将这一段替换成图片，而不要再显示出来了。

代码实现如***释很详细了。

private void initContent(){
        //input是获取将被解析的字符串
        String input = flag.getContent().toString();
        //将图片那一串字符串解析出来,即<img src=="xxx" />
        Pattern p = Pattern.compile("\\<img src=\".*?\"\\/>");
        Matcher m = p.matcher(input);

        //使用SpannableString了，这个不会可以看这里哦：http://blog.sina.com.cn/s/blog_766aa3810100u8tx.html#cmt_523FF91E-7F000001-B8CB053C-7FA-8A0
        SpannableString spannable = new SpannableString(input);
        while(m.find()){
            //Log.d("YYPT_RGX", m.group());
            //这里s保存的是整个式子，即<img src="xxx"/>，start和end保存的是下标
            String s = m.group();
            int start = m.start();
            int end = m.end();
            //path是去掉<img src=""/>的中间的图片路径
            String path = s.replaceAll("\\<img src=\"|\"\\/>","").trim();
            //Log.d("YYPT_AFTER", path);

            //利用spannableString和ImageSpan来替换掉这些图片
            int width = ScreenUtils.getScreenWidth(AddFlagActivity.this);
            int height = ScreenUtils.getScreenHeight(AddFlagActivity.this);

            Bitmap bitmap = ImageUtils.getSmallBitmap(path,width,480);
            ImageSpan imageSpan = new ImageSpan(this, bitmap);
            spannable.setSpan(imageSpan,start,end, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
        }
        content.setText(spannable);
        content.append("\n");
        //Log.d("YYPT_RGX_SUCCESS",content.getText().toString());
    }

---

欢迎大家加入QQ群一起交流讨论，「吟游」程序人生——YinyouPoet