EZ Share 的一些经验

  1. 简介
    EZ Share是什么:EZ Share是由四位阿里应届生私下自己做的一款APP,专门为一些闷骚的微信(我问过我们部门的同事,来往没对外提供接口,所以无法做)用户提供服务,根据用户的心情来匹配一些装逼的图片,并能把文字合理编排并融入装逼的图片,显得更有逼格。
  2. 系统架构
    因为功能比较简单,所以系统的复杂度也比较简单。主要分为两部分:phonegap,原生Android/IOS,如下图所示。
    《EZ Share 的一些经验》
    phonegap部分除了提供界面和APP的交互之外,还有一个很重要的功能,就是使用canvas对图片的处理,把文字融入图片里面。可能你会奇怪为啥要这样做?因为用原生来处理的话虽然性能不错,但Android和IOS都需要各写一份代码,而且原生对图片的处理比较麻烦。
    Android/IOS原生部分其实很简单,就是接入微信的SDK分享微信。
    phonegap和原生之间的通信我的做法是在原生部分建立一个socket server,通过socket通信。
  3. phonegap部分技术细节
    3.1 phonegap调试
    我觉得phonegap的调试比较麻烦,我是采用weinre进行远程调试,其原理如下图:
    《EZ Share 的一些经验》
    配置步骤:(小心细节,我因为一些细节问题折腾了几个小时)
    【1】 使用npm安装weinre
    2 启动weinre
    3 注入一份js到index.html当中(在虚拟机中特别注意,千万别写localhost或者127.0.0.1,不然的话就会向虚拟机本身请求)
    【4】 记得在config.xml添加访问的权限
    3.2 canvas处理图片
    如下图所示,这个部分主要是分为3个canvas层:
    《EZ Share 的一些经验》
    【1】第一层:主要是渲染图片的背景
    【2】第二层:主要是渲染一些纯色背景并且根据用户的输入的文字渲染上去,并监听输入框的焦点事件,当失去焦点的时候,就会把文字重绘到第二层canvas上
    【3】第三层:这个canvas的display是hidden的,当用户确定发送的时候,就会将第一层和第二层的canvas的内容渲染到第三层并生成一张图片储存到sd卡里面
  4. 原生Android部分技术细节
    其实就是接入微信sdk,当接收到phonegap发来的信息就发送到微信,现在我做了Android,因为太穷了,没有一台ios设备,大概等毕业之后回去入职的时候再买吧,^_^ 反正原生的代码不多,应该也很快。
    想吐槽一下的是android的微信sdk接入有点小麻烦,哈哈!一定要确保包名,签名证书正确才能发送。我也搜到一些资料有些人为了方便可以绕过微信的sdk直接唤醒微信的分享的activity,我猜他们的做法也是查看微信sdk包里面的源码再略加修改!

  5. 效果图
    《EZ Share 的一些经验》

因为咱们EZ团队还在学校度假中,各个都忙着毕业和旅游,所以还需要一点点时间才能推出,哈哈,装逼神器你绝对值得拥有!

    原文作者:梁广彬
    原文地址: https://segmentfault.com/a/1190000000519479
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞