Flutter 引入阿里巴巴图标

阿里图标库:https://www.iconfont.cn/

1.载代码:

20250322104210275-20250322-103135

2.配置图标字体文件

图片[2]-Flutter 引入阿里巴巴图标-IT网络技术分享

3.运行python脚本 生成dart调用代码

flutter_dart.py

import re
from pathlib import Path
 
 
ROOT = Path(__file__).resolve().parent
MAIN = ROOT
 
 # 将 iconfont 的 css 自动转换为 dart 代码
def translate():
    print('Begin translate...')
 
    code = """
import 'package:flutter/widgets.dart';
// 代码由程序自动生成。请不要对此文件做任何修改。
class IconFont {
  IconFont._();
  static const font_name = 'IconFont';
{icon_codes}
}
""".strip()
 
    strings = []
 
    tmp = []
    p = re.compile(r'.icon-(.*?):.*?"\\(.*?)";')
 
    content = open(MAIN / 'iconfont.css').read().replace('\n  content', 'content')
 
    for line in content.splitlines():
        line = line.strip()
        if line:
            res = p.findall(line)
            if res:
                name, value = res[0]
                name = name.replace('-', '_')
                tmp.append((name.lower(), value))
 
    tmp.sort()
    for name, value in tmp:
        string = f'  static const IconData {name} = const IconData(0x{value}, fontFamily: font_name);'
        strings.append(string)
 
    strings = '\n'.join(strings)
    code = code.replace('{icon_codes}', strings)
 
    open(MAIN / 'iconfont.dart', 'w').write(code)
 
    print('Finish translate...')
 
 
if __name__ == "__main__":
    translate()
图片[3]-Flutter 引入阿里巴巴图标-IT网络技术分享
THE END
喜欢就支持一下吧
点赞0 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容