android shape 背景图,使用Vue快速生成shape背景图

写在前面

在日常的Android开发之中，我们通常都会根据UI图去手动创建shape或者selector背景图，虽说创建起来很简单，但是未免也会感到繁琐，因此也研究了一些这方面的知识，包括自定义shapedrawable、dataBinding，到最近看到的通过LayoutInflater.Factory类等等方法，可见天下真苦秦久矣。

加上最近在学习Vue、小程序等等前端的知识，前面也写过一个为《MVVM With Kotlin》系列提供的脚手架工具.

因此便有了一个通过Vue快速生成shape背景图的想法。

Shape4Android

名称灵感来自于inloop的shadow4android，Vue看看官网的教程，边看边实践，css不熟悉，所以直接搬的element-ui，还用到了以前收藏的You-need-to-know-css的技巧，趁着周末完善了一下，上传到了github-pages上。

image

Feature

支持常用的retangle和oval两种样式

支持设置颜色

支持shape和selector (selector支持常用的pressed和unable)

支持设置圆角

支持设置边框宽度和颜色

支持修改文件名称

默认命名规则

shape： shape_type_color_roundTL_roundTR_roundBL_roundBR_borderWidth_borderColor.xml

selector：selector_shape_n_color_p_pressedColor_u_unableColor.xml

如果自定义文件名称，那么selector中的shape默认会跟上type名，比如xx_norm.xml/xx_pressed.xml/xx_unable.xml

TODO

更多形状

虚线

渐变色

rippleColor

优化界面

写在最后

实质上跟APT编译生成所需的Java/Kotlin文件差不多，但是Vue能够节省很多编译的时间，所以写着感觉很快。

代码实际上也非常简单，就是根据填写的参数拼装成shape或者selector.xml文件而已，毕竟都是模板化的代码，再用filesaver.js下载下来就行。

关于我