最近有个需求，语音识别成文字并发送，比较了一圈，微信发语音的效果比较适合我们的场景。
但搜了一圈只有老版的效果，只能自己弄了，弄完整理下，希望大家一起帮忙查缺补漏。
效果基于自定义view来实现的。
主要机制流程实现大概如下
1.聊天页面，点击按钮，监听事件 分发给 VoiceView(自定义的view, 全屏，透明度20-30样子)
- 根据event 坐标 ，在VoiceView 绘制对应的图
- 手指松开时候，根据语音引擎识别的文案，VoiceView中add一个EditText
- 点击对应的区域，发送或者取消
遇到的一些坑
- 绘制底部的弧，本想尝试通过 PorterDuff.Mode 取 rect 和 arc的交集的，但没成功（原因暂未排查），
只能退求其次手动绘制圆来代替。 - touch事件move时，左右两个圆圈，里面的icon是跟随着下面的圆弧度rotate过的，
角度是通过path换算出来的（PathMeasure这个需要了解下）
path的画圆或弧时，起点是对应的rect右边的中点 - 添加EditText时候，不展示出来，因为onLayout未作布局。
已知问题
- 没作适配，（试了手头三星，华为，小米几款机器还行）
- 没作动效
- 没有美工切图，用的都是官方提供的矢量图
- 没深度测试，hiahiahia ☺
没集成语音相关的，效果图 如下
z3dfi-znd28.gif
网友评论