1. 目标
- 学会将当前文件夹下的图片【‘jpg’, ‘png’, ‘jpeg’, ‘bmp’】,转换成base64,保存到icon.js的文件中;
- 学会读取图片文件,将文件转成 base64 的字符串;
- 学会获取文件夹下的所有图片文件;
- 学会将 base64 的字符串存入 icon.js 文件中。
2. 引入依赖模块
import os
import base64
3. 获取文件夹下所有的文件
- 读取当前给出的路径下的所有文件和文件夹名称
- 返回所有文件和文件夹名称列表
# 获取文件夹下所有的文件
def get_all_file(path):
names = None
try:
names = os.listdir(path)
except Exception as e:
print(e)
else:
return names
4. 获取文件列表中的图片列表
- 循环传入的文件和文件夹列表
- 切割获取文件后缀名称
- 判断后缀名是不是 [‘jpg’, ‘png’, ‘jpeg’, ‘bmp’] 图片后缀名
- 是就存入图片列表
- 返回收集的图片名称列表
# 获取文件列表中的图片列表
def get_all_images(files):
images = []
try:
for name in files:
suffix = name.split('.').pop()
if suffix in ['jpg', 'png', 'jpeg', 'bmp']:
images.append(name)
except Exception as e:
print(e)
else:
return images
5. 获取 base64 的列表
- 创建写入 icon.js 文件的内容列表
- 循环图片名列表
- 将每个图片转成 base64 的字符串
- 将图片名和【base64 的字符串】组成key:value的键值对存入列表
- 循环完成补全js文件的输出
- 返回icon.js的内容列表
# 获取 base64 的列表
def get_images_base64(path, files):
jss = [
"const icon = {\n"
]
try:
for name in files:
suffix = name.split('.')[0]
img_url = f'{path}/{name}'
base_img = img_to_base64(img_url)
jss.append(f' "{suffix}Icon": "{base_img}",\n')
except Exception as e:
print(e)
else:
jss.append("}\n")
jss.append("module.exports = icon;")
return jss
6. 创建 js 文件,写入内容
- 创建传入的js名称
- 将内容列表写入文件
# 创建 js 文件,写入内容
def create_js_folder(path, foldername, base_imgs):
try:
with open(path + "/" + foldername + ".js", "w",encoding="utf-8") as js:
js.writelines(base_imgs)
except Exception as e:
print(e)
7. 完整代码
#!/usr/bin/env python
"""
@Author :Rattenking
@CSDN :https://blog.csdn.net/m0_38082783
"""
import os
import time
import base64
# 将图片转换成base64
def img_to_base64(path):
with open(path,"rb") as f:
base64_data = base64.b64encode(f.read())
return f'data:image/jpg;base64,{base64_data.decode()}'
# 获取文件列表中的图片列表
def get_all_images(files):
images = []
try:
for name in files:
suffix = name.split('.').pop()
if suffix in ['jpg', 'png', 'jpeg', 'bmp']:
images.append(name)
except Exception as e:
print(e)
else:
return images
# 获取文件夹下所有的文件
def get_all_file(path):
names = None
try:
names = os.listdir(path)
except Exception as e:
print(e)
else:
return names
# 创建 js 文件,写入内容
def create_js_folder(path, foldername, base_imgs):
try:
with open(path + "/" + foldername + ".js", "w",encoding="utf-8") as js:
js.writelines(base_imgs)
except Exception as e:
print(e)
# 获取 base64 的列表
def get_images_base64(path, files):
jss = [
"const icon = {\n"
]
try:
for name in files:
suffix = name.split('.')[0]
img_url = f'{path}/{name}'
base_img = img_to_base64(img_url)
jss.append(f' "{suffix}Icon": "{base_img}",\n')
except Exception as e:
print(e)
else:
jss.append("}\n")
jss.append("module.exports = icon;")
return jss
if __name__ == "__main__":
start_time = int(round(time.time() * 1000))
path = "./"
# 获取所有的文件
files = get_all_file(path)
# 获取所有的图片
images = get_all_images(files)
# 将图片列表转base64字符串
icons = get_images_base64(path, images)
# 创建 icon 的js文件
create_js_folder(path, "icon", icons)
end_time = int(round(time.time() * 1000))
print(f'本次图片转换时间为:{end_time - start_time}ms')
8. 总结
- 由于微信小程序开发,很多小图标放服务器替换不方便,所需要将图标转base64,但是一个一个转换,比较麻烦,采用【批量将图片转base64工具.exe】工具,可以快速将当前文件夹下的图标转成一个icon.js文件,开发中只需要读取这个文件中对应的图片名!
9.使用
- 存放图标的文件夹放入转换工具
- 运行工具生成 icon.js
- 在使用页面引入 icon.js
注意生成的base64的图片名称是在原来图片名称后加了Icon的后缀
- wxml 界面使用图标
- 更新图标只需要将图标放入文件夹重新运行工具【方便快捷,不需要修改替换之前代码】