相关问题
社区或评论区使用RichEditor发布内容时获取编辑框内的内容
1813浏览 • 1回复 待解决
HarmonyOS RichEditor获取编辑的图文内容的问题。
506浏览 • 1回复 待解决
HarmonyOS 富文本组件RichEditor并不能编辑html格式数据,想实现html格式编辑的解决方案
569浏览 • 1回复 待解决
HarmonyOS 直播评论场景需要评论顶部渐隐效果,如何实现?
526浏览 • 1回复 待解决
express中,文章的父评论 子评论 是一起返回前端还是前端分别请求?
2625浏览 • 1回复 待解决
#鸿蒙通关秘籍#如何实现评论功能列表,并懒加载评论数据?
429浏览 • 1回复 待解决
#鸿蒙通关秘籍#如何实现鸿蒙应用的图片评论功能并进行评论列表的懒加载?
317浏览 • 1回复 待解决
HarmonyOS Swiper嵌套RichEditor的问题
313浏览 • 1回复 待解决
HarmonyOS RichEditor问题
368浏览 • 1回复 待解决
#鸿蒙通关秘籍#如何优化HarmonyOS中评论组件的性能?
574浏览 • 1回复 待解决
HarmonyOS RichEditor 使用问题
936浏览 • 1回复 待解决
HarmonyOS RichEditor如何使用?
794浏览 • 1回复 待解决
HarmonyOS RichEditor设置controller
227浏览 • 1回复 待解决
RichEditor如何拿到BuilderSpan?
2164浏览 • 1回复 待解决
HarmonyOS RichEditor使用问题
317浏览 • 1回复 待解决
#鸿蒙通关秘籍#如何提升评论组件的数据加载性能?
582浏览 • 1回复 待解决
#鸿蒙通关秘籍#如何实现评论组件的全局状态保留能力?
407浏览 • 1回复 待解决
为什么文章不能评论,有问题交流
4994浏览 • 1回复 待解决
基于TLSSocket的通信能力
1171浏览 • 1回复 待解决
基于webView的嵌套滚动
737浏览 • 1回复 待解决
RichEditor添加、删除、重载图片
1563浏览 • 1回复 待解决
如何查看编译的详细过程编辑
669浏览 • 1回复 待解决
如何编辑裁剪相册中的图片
1319浏览 • 1回复 待解决
HarmonyOS RichEditor.onPaste问题
272浏览 • 1回复 待解决
HarmonyOS RichEditor如何设置最大的字符输入限制
526浏览 • 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,并通过获取光标所在位置进行删除。
核心代码