在项目开发过程中随着项目的逐渐增大,项目当中的图片资源会越来越多,而且有些时候因为命名不规范和人员的变动等原因会造成项目当中重复的图片资源越来越多,而且Xcode查看图片的方式也不集中,查找起来也不方便,这种情况下我们往往会更倾向于添加一个新的图片资源,从而更加剧了图片资源重复的问题。
为了解决这个问题,我们打算来写一个脚本,把工程当中图片数据扫描一遍,然后用html集中显示出来,这样就方便我们来查找了。
问题分析
我们基本上需要解决以下3个问题
- 工程资源文件扫描脚本的编写
- html展示页面的编写
- html页面和扫描脚本的数据交互
1和2两点查阅相关资料就可以比较容易解决,主要是第3点,一般情况下浏览器是不提供操作文件的接口的,网上说的ActiveXObject
也只是IE浏览器提供。这个地方我们采用了一个比较特殊的方式,就是将脚本扫描得到的数据直接利用脚本的文件操作写成一个js文件,虽然浏览器不能操作文件,但是可以直接读取js文件,这样就比较好的解决了脚本和html交互的问题。
代码实现
脚本采用python实现,是一个递归查找并记录的过程,代码整体逻辑并不复杂,表现层的html也都是比较简单的原生html代码和js代码,这里就不做详细介绍了,我们简单的看下检查依赖和数据交互的逻辑。
下面这段代码就是检查依赖的方法,以前都是在文档当中提示使用者手动安装,现在我们可以用这样一个方法检索用户的特定库的安装列表,如果没有安装相应库,则执行相应命令帮其安装。
def checkDepend():
print "检查依赖库..."
isHavePillow = False
r = os.popen("pip freeze")
x = r.readlines()
for line in x:
if line.startswith("Pillow="):
isHavePillow = True
if isHavePillow:
print "依赖库存在"
else:
print "依赖库不存在,安装依赖库..."
os.system("sudo pip install Pillow")
print "依赖库安装完成"
下面这个方法就是将检索到数据生成js的方法,我们可以看到它是直接将数组当中的内容转化为json并拼接成一个赋值给imageData变量的字符串,利用python的文件操作,将此字符串写入一个名为imageData.js的文件当中,这样就可以被html引用并操作imageData变量了。
def generateJSFile(mArrImageData):
if os.path.exists("./imageData.js"):
os.remove("./imageData.js")
f = open("./imageData.js", 'w')
strJson = json.dumps({"data":mArrImageData})
strDes = "var imageData = " + strJson
# print strJson
f.write(strDes)
f.close()
源代码请戳这里FindImage。
使用
将源代码clone或者下载到本地,并根据README当中提示修改path
为自己的工程目录,然后执行下面命令,脚本便会帮你检索并打开相应的浏览页面,轻松一行命令搞定。
python findImage.py
补充
html5提供了读取文件的API——FileReader,利用它来实现数据交互也是一个不错的选择。