相关问题
社区或评论区使用RichEditor发布内容时获取编辑框内的内容
360浏览 • 1回复 待解决
express中,文章的父评论 子评论 是一起返回前端还是前端分别请求?
783浏览 • 1回复 待解决
RichEditor如何拿到BuilderSpan?
348浏览 • 1回复 待解决
RichEditor添加、删除、重载图片
362浏览 • 1回复 待解决
为什么文章不能评论,有问题交流
3443浏览 • 1回复 待解决
RichEditor组件如何设置初始字体样式
442浏览 • 1回复 待解决
基于webView的嵌套滚动
136浏览 • 1回复 待解决
鸿蒙是基于Android的吗?
9829浏览 • 2回复 已解决
基于原生的水印添加能力
192浏览 • 1回复 待解决
RichEditor无法从onPaste回调中获取粘贴的文本信息
446浏览 • 1回复 待解决
DevEcoStudio没有列选择编辑功能吗?
5958浏览 • 1回复 已解决
如何对相册图片进行编辑裁剪
624浏览 • 1回复 待解决
RichEditor 如何设置初始字体大小与颜色?
318浏览 • 1回复 待解决
基于measure实现的文本测量
148浏览 • 1回复 待解决
基于bindSheet的半模态弹窗
171浏览 • 1回复 待解决
基于原生的跨模块资源访问
267浏览 • 1回复 待解决
TextInput 怎么设置不可编辑?
809浏览 • 1回复 待解决
基于mysql的悲观锁的运用场景?
1345浏览 • 1回复 待解决
openharmony 基于arkts的socket连接问题
2317浏览 • 1回复 待解决
基于原生能力的跨应用跳转
273浏览 • 1回复 待解决
基于加解密算法框架的规格问题
201浏览 • 1回复 待解决
JS 在textarea组件中编辑文本,每修改一个字符,如何解决编辑状态下光标不跳转的问题?
1987浏览 • 1回复 待解决
基于原生能力的网络加载性能分析
236浏览 • 1回复 待解决
基于AOP的代码插桩,都有哪些场景?
245浏览 • 1回复 待解决
List列表 编辑问题,List列表如何开启拖动功能。
289浏览 • 1回复 待解决
RichEditor是支持图文混排和文本交互式编辑的组件,在我们使用的APP中是很常见的,比如评论区编辑内容发布、对话框或者聊天室。下面列举一些遇到的场景需求:场景一:基于文字图片以及@信息的好友评论场景二:右下角的剩余字数场景三:评论中携带所@的用户的附属信息场景四:文本选择区域发生变化或编辑状态下光标位置发生变化回调场景五:自由切换系统键盘和自定义键盘。
方案描述
场景一:基于文字图片以及@信息的好友评论
效果图
方案
1、通过addTextSpan来添加文字,2、通过addImageSpan来添加图片3、通过addBuilderSpan来实现一段内容光标不可插入的效果4、addTextSpan等支持gesture等手势操作,比如onClick点击和onLongPress长按事件
核心代码
1、由于RichEditor是支持图文混排的,所以RichEditor里面的内容也就是由Text和Image组成的,分别通过addTextSpan和addImageSpan添加,而且还可以设置字体和图片样式,如下代码1:
2、在常见的评论区艾特好友时,会将“@华为官方客服”视作一个整体,光标无法插入其中,且第一次按删除键时整体会高亮选中,第二次再按删除键才会删除。**需要注意的是,如果使用的全局@Builder,则需要配合bind(this)使用。**后续也可以通过事件阻止“即RichEditor控件ClickEvent/TouchEvent支持preventDefault”。
3、发微博的时候可以输入表情、超链接、文字等一起的内容
代码3:
场景二:右下角的剩余字数
效果图
方案
使用overlay浮层,显示“0/20”字数提示符在组件的右下角。再通过aboutToIMEInput回调(输入法输入内容前),获取插入的文本偏移位置,对输入内容进行限制。
核心代码
场景三:评论中携带所@的用户的附属信息
效果图
方案
使用HashMap的set向HashMap中添加或更新一组数据,使用get方法获取指定key所对应的value。
核心代码
场景四:文本选择区域发生变化或编辑状态下光标位置发生变化回调
效果图
方案
使用RichEditor组件在API 12支持的新接口 onSelectionChange,在文本选择区域发生变化或编辑状态下光标位置发生变化时触发该回调。光标位置发生变化回调时,选择区域的起始位置等于终止位置(即start = end)。
核心代码
场景五:自由切换系统键盘和自定义键盘
效果图
方案
使用RichEditor的属性customKeyboard控制切换系统键盘还是自定义键盘,添加表情使用addImageSpan,删除内容使用deleteSpans,并通过获取光标所在位置进行删除。
核心代码