android富文本的应用之草稿箱

富文本(也就是我们常常说到的图文混排)经常在我们做app应用的时候要求做到这个功能。
比如说,

  • 做一个论坛的app时候我们需要发帖,而发帖就要求我们做到图片和文字一起展示,发送到服务器中去,
  • 做某些记事本的app的时候,我们也要对做的富文本进行操作,把富文本存储到本地,以便于我们查看和重现编辑

我做了一个app,先把平常操作的图贴上,主要功能是编辑富文本,和富文本的本地存储,及富文本的二次编辑。
- app的相关截图

1,这是app展示富文本信息的主界面

这里写图片描述


2,富文本的编辑页面,支持插入图片和文字的混排

这里写图片描述


3,富文本刚开始的编辑页面
这里写图片描述


4,富文本的本地化存储

这里写图片描述


贴上一些核心代码

找到图片的uri,通过uri插入到富文本中

final Uri uri = data.getData();
            final String url = getRealPathFromURI(uri);
            Editable eb = etContent.getEditableText();
            LogUtils.d("获得的文件绝对路径是"+url);
            // 获得光标所在位置
            int startPosition = etContent.getSelectionStart();
            eb.insert(
                    startPosition,
                    Html.fromHtml("<br/><img src='" + url
                            + "'/><br/>", imageGetter, null));
            /**
             * 图片插入之后,scrillView下滑至最底部
             */
            mHandler.post(new Runnable(){

                @Override
                public void run() {
                    // TODO Auto-generated method stub
                    mScrollView.fullScroll(ScrollView.FOCUS_DOWN);
                }

            });

从数据库中获取到存储的关于富文本的信息,展示在富文本中

mDraftInfo = (DraftInfo) getIntent().getSerializableExtra("draft_bean");
            /**
             * 获得标题,并且把标题显示在标题栏
             */
            etTitle.setText(mDraftInfo.title);
            String content  =  mDraftInfo.text;
            LogUtils.d("获得的text信息"+content);
            String[] mContent = content.split("\n");
            int startPosition;
            /**
             * 获得html中的图片的URI,存储在容器中mPicUri
             */
            int startIndex;
            int endIndex;
            List<String> mPicUri = new ArrayList<String>();
            String [] mContentEb = mDraftInfo.html.split("\n");
            for (String string : mContentEb) {
                if(string.contains("src=")){
                    LogUtils.d(string);
                    startIndex = string.indexOf("src=")+5;
                    endIndex   = string.lastIndexOf("jpg")+3;
                    String uri = string.substring(startIndex, endIndex);
                    LogUtils.d("11111获得的图片路径"+uri);
                    mPicUri.add(uri);

                }

            }
            int i = 0;
            /**
             * 获得草稿的图片和文字信息,并把它展示出来
             */
            for (String string : mContent) {
                //LogUtils.d(string);
                if(string.contains("")){
                    /**
                     * 如果是图片
                     * 1,先判断其来自与照相机还是图库
                     * 2,图库用ImageGetter显示出来
                     * 3,照片用ImageGetter1显示出来
                     */
                    startPosition = etContent.getSelectionStart();
                    String mPicPath  =  mPicUri.get(i);
                    startPosition = etContent.getSelectionStart();
                    if(mPicPath.contains("content")){
                        eb.insert(
                                startPosition,
                                Html.fromHtml("<br/><img src=" + mPicPath
                                                + "><br/>", imageGetter, null));
                    }else{
                        eb.insert(
                                startPosition,
                                Html.fromHtml("<br/><img src=" + mPicPath 
                                                + "><br/>", imageGetter, null));
                    }
                    i++;
                    /**
                     * 碰到图片下面直接有文字的情况
                     */
                    if(!string.equals("")){
                    String contentPic   = string.substring(string.indexOf("")+1);
                    startPosition = etContent.getSelectionStart();
                    eb.insert(startPosition, contentPic);
                    }
                }else{
                    /**
                     * 展示文字
                     */
                    startPosition = etContent.getSelectionStart();
                    eb.insert(startPosition, string);
                }
            }

        }

废话不多说直接贴上代码的链接github的地址,欢迎的话加星哦

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值