魔图的产品介绍

产品介绍

基于千万车轮车主用户大数据分析综合评分,用户打分形成的最终推荐指数。竖轴表示推荐指数,横轴表示价格区间。通过展示的图形筛选出自己心仪的车型。展示各个车型的各项评分,车型以及竞品的对比关系。

基础类的构建

  1. 基础的画布类,定义画布的基础参数。主要就是画布的四个边界点的坐标
  2. 选中车型的类,保存选中车型的数据状态
  3. 数据处理类,将魔图的真实数据,转换成在画布上可以使用的数据
事件处理类
  1. 点击事件,滑动,放大,双击
  2. 缩放 使用Android系统提供的ScaleGestureDetector
  3. 手势识别 GestureDetectorCompat 通过这个类可以识别很多手势
  4. 滑动,方法都是通过手势产生的偏移对画布进行重新设置。滑动需要判断是否操作最大画布的边距。
  5. fling 惯性 ScrollerCompat 26.1.0 废弃了使用 OverScroller
  6. 点击 通过手势的识别

数据处理

  1. 圆圈放大的倍率计算分成了几部分处理。
  2. 车型展示的圆圈大小进行分级。便于显示管理处置。 对所有的圆的类型根据等级分成9级,按照2的倍数,排序圆圈

代码构建

d8f64ebb0799e21afcf2e6b128463509.png
代码的分层框架

模式

因为魔图有三个状态,需要创建三个不同的对象去承载这些业务逻辑。初始化即Normal 状态 ,点击状态Touch ,还有竞争状态 Compare。这三个状态多具有相同的一些属性,但是也都有不同的部分。所以通过继承相同的基类,在不同的子类修改了部分属性从而使得它们可以呈现不同的状态。即用一个接口BaseCase对于这一类的Case归类,打上标签与其他的进行区分。然后根据传进来的type 进行区分。主要的方法是onDraw() 和onTouch() 。我们又希望在使用这些对象,不需要知道这些对象具体的名字,只需要知道表示该对象的一个参数,就可以获取该对象。所以这里就采用工厂模式进行重构。

1. 将关注点进行分离,对责任进行分割,调用者无需知道类名 。提高系统的灵活性,对于后期代码的增删也比较的方便。
2. 统一的基类进行约束,实现多态。协议类,统一管理回调

提升性能

  1. 完全超出屏幕外部的圆不进行绘制,尤其在绘制对比类型的时候,连接线是虚线的状态。会造成严重的卡顿。绘制虚线需要关闭android 的硬件加速的功能。而且当初画布会放的非常大,就会造成各个方向的连线特别的长。因此对于超出屏幕外部的不进行绘制是极有必要的。
  2. 不在循环绘制的过程里创建新的对象,否则对象不断的创建,不断的释放,会造成内存极大的抖动
  3. 数据转换过程。在绘制前先处理好。