Android 图片混排富文本编辑器控件
概述
详细
一、一个Android 图片混排富文本编辑器控件(仿兴趣部落)
1.1 图片混排富文本控件
是一种图片和文字混合在一起的控件,文本之间可以插入图片,类似于网页的排版样式。
1.2 该控件主要是仿兴趣部落的效果,实现原理主要基于RecyclerView方案实现的。
二、演示效果图
演示效果图如下:

三、使用方法
3.1 首先初始化该控件:
在xml布局文件中和Activity类中声明和定义 该控件:
<com.czm.xcricheditor.XCRichEditor
android:id="@+id/richEditor"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="10dp"
android:layout_below="@id/tv_header"
android:layout_above="@id/rl_action"
android:paddingBottom="10dp"/>
// 声明定义控件
private XCRichEditor mRichEditor
3.2 插入/追加 图片或者文本内容:
//插入添加图片或者文本到控件中
List<LocalImageHelper.LocalFile> files = LocalImageHelper.getInstance().getCheckedItems();
Log.e("czm","file size="+files.size());
List<EditItem> items = new ArrayList<>();
for (int i = 0; i < files.size(); i++) {
Log.e("czm","file uri="+files.get(i).getOriginalUri());
Log.e("czm","file getThumbnailUri="+files.get(i).getThumbnailUri());
EditItem item = new EditItem();
item.setUri(Uri.parse(files.get(i).getOriginalUri()));
item.setType(1);
item.setContent(files.get(i).getOriginalUri());
items.add(item);
}
mRichEditor.addImage(items);
3.3完整使用方法:
private XCRichEditor mRichEditor;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Fresco.initialize(this);
findViewById(R.id.add_pic).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
addPic();
}
});
mRichEditor = (XCRichEditor) findViewById(R.id.richEditor);
} private void addPic() {
Intent intent = new Intent(MainActivity.this, LocalAlbum.class);
startActivityForResult(intent, ImageUtils.REQUEST_CODE_GETIMAGE_BYCROP);
}
@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
Log.e("czm","requestCode="+requestCode); switch (requestCode) {
case ImageUtils.REQUEST_CODE_GETIMAGE_BYCROP:
if (LocalImageHelper.getInstance().isResultOk()) {
LocalImageHelper.getInstance().setResultOk(false);
//获取选中的图片
List<LocalImageHelper.LocalFile> files = LocalImageHelper.getInstance().getCheckedItems();
Log.e("czm","file size="+files.size());
List<EditItem> items = new ArrayList<>();
for (int i = 0; i < files.size(); i++) {
Log.e("czm","file uri="+files.get(i).getOriginalUri());
Log.e("czm","file getThumbnailUri="+files.get(i).getThumbnailUri());
EditItem item = new EditItem();
item.setUri(Uri.parse(files.get(i).getOriginalUri()));
item.setType(1);
item.setContent(files.get(i).getOriginalUri());
items.add(item);
}
mRichEditor.addImage(items);
//清空选中的图片
files.clear();
//设置当前选中的图片数量
LocalImageHelper.getInstance().setCurrentSize(files.size());
}
//清空选中的图片
LocalImageHelper.getInstance().getCheckedItems().clear();
break;
default:
break;
}
}
四、文件目录截图

注:本文著作权归作者,由demo大师发表,拒绝转载,转载需要作者授权
Android 图片混排富文本编辑器控件的更多相关文章
- Excel催化剂开源第29波-在Winform上使用富文本编辑器控件
富文本编辑器,一般都是BS架构专利一般,好像百度有一个开源的比较出名,但无奈这些都只能用在JS上,在BS网页端开发上使用.像Winform开发的VSTO,只能羡慕的份.和一般Winform上用的Ric ...
- js中的文本编辑器控件KindEditor---那些打酱油的日子
使用文本编辑器控件KindEditor渲染文本域页面显示 this.sync()同步KindEditor的值到textarea文本框 editor.isEmpty()判断文本域是否是空 editer. ...
- js中的文本编辑器控件KindEditor
使用文本编辑器控件KindEditor渲染文本域页面显示 this.sync()同步KindEditor的值到textarea文本框 editor.isEmpty()判断文本域是否是空 editer. ...
- jquery cleditor 光标经常点不进去问题解决方法 bootstrap 富文本框 控件
cleditor 光标点不进去,原因是内嵌的html代码段 body没有赋值默认高度. 解决方法1.赋值options.bodyStyle 设置min-height值.缺点:不能跟随设备更新最低高度 ...
- uedit富文本编辑器及图片上传控件
微力后台 uedit富文本编辑器及文件上传控件的使用,无时间整理,暂略,参考本地代码.能跑起来.
- Android - 富文本编辑器
Android富文本编辑器(一):基础知识 目前主流的基于Android富文本开发方式思路如下: 基于TextView图文混排 使用方式: TextView textView = new TextVi ...
- 使用百度UMeditor富文本编辑器,修改自定义图片上传,修改源码
富文本编辑器,不多说了,这个大家应该都用到过,至于用到的什么版本,那就分很多种 CKEditor:很早以前叫FCK,那个时候也用过,现在改名了,比较流行的一个插件,国外很多公司在用 UEDITOR:百 ...
- JAVAEE——宜立方商城04:图片服务器FastDFS、富文本编辑器KindEditor、商品添加功能完成
1. 学习计划 1.图片上传 a) 图片服务器FastDFS b) 图片上传功能实现 2.富文本编辑器的使用KindEditor 3.商品添加功能完成 2. 图片服务器的安装 1.存储空间可扩展. 2 ...
- ckeditor富文本编辑器的使用和图片上传,复制粘贴图片上传
自动导入Word图片,或者粘贴Word内容时自动上传所有的图片,并且最终保留Word样式,这应该是Web编辑器里面最基本的一个需求功能了.一般情况下我们将Word内容粘贴到Web编辑器(富文本编辑器) ...
随机推荐
- python开发_textwrap文本样式
在看python的API的时候,发现python的textwrap在处理字符串样式的时候功能强大 在这里我做了一个demo: textwrap提供了一些方法: wrap(text, width = 7 ...
- April Fools Day Contest 2016 A. Da Vinci Powers
A. Da Vinci Powers 题目连接: http://www.codeforces.com/contest/656/problem/A Description The input conta ...
- Simple dc/dc converter increases available power in dual-voltage system
The schematic in Figure 1 shows a way to increase the power available from a current-limited 5V supp ...
- mysql查询更新时的锁表机制分析(只介绍了MYISAM)
为了给高并发情况下的mysql进行更好的优化,有必要了解一下mysql查询更新时的锁表机制. 一.概述 MySQL有三种锁的级别:页级.表级.行级.MyISAM和MEMORY存储引擎采用的是表级锁(t ...
- 解决Visual Studio 2010 “无法导入以下密钥文件” 错误
错误原文: "错误 1 无法导入以下密钥文件: SamplePlugin.pfx.该密钥文件可能受密码保护.若要更正此问题,请尝试再次导入证书,或手动将证书安装到具有以下密钥容器名称的强名称 ...
- CSS:用SASS(SCSS)实现栅格系统
背景 在CSS:用Less实现栅格系统中我介绍了如何用LESS实现栅格系统,为啥还要再用SASS做一遍呢?Bootstrap+JQuery+Less做前端(以读取为目的),ExtJs+Sass做后台( ...
- fmri资源站点
1. MRI analysis tutorials:http://www.mccauslandcenter.sc.edu/CRNL/wp-content/tools/tutorial/index.h ...
- Eclipse经常使用的快捷键
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbGl1aHVhbmNoYW8=/font/5a6L5L2T/fontsize/400/fill/I0JBQk ...
- [转]MySQL Explain
Mysql Explain 详解 一.语法 explain < table_name > 例如: explain select * from t3 where id=3952602; 二. ...
- OpenCV学习(4) Mat的基本操作(1)
图像在OpenCV中都是通过Mat类来存储的,Mat可以用来表示N维矩阵,当然用的最多的还是二维矩阵. Mat类有两部分组成:第一部分是头信息,这些信息主要用来描述矩阵,比如矩 ...