美文网首页
flutter中使用iconfont

flutter中使用iconfont

作者: 知止至得 | 来源:发表于2019-11-21 10:29 被阅读0次

    第一种 直接引入ttf文件,使用十六进制

    第二种 引入ttf文件,转换成 dart

    const fs = require("fs");
    const path = require("path");
    
    // 从命令行中获取存储路径和文件名,默认使用 "/lib/assets/iconfont.dart" 存储,默认json和dart一个目录
    function getStoragePath() {
      let defaultStoragePath = "./lib/assets";
      let defaultFileName = "iconfont.dart";
      let storagePath = process.argv[process.argv.length - 1];
      if (storagePath) {
        let pathObj = path.parse(storagePath);
    
        if (pathObj.extname === ".dart") {
          return JSON.parse(JSON.stringify(pathObj));
        } else {
          return {
            dir: storagePath,
            base: defaultFileName
          };
        }
      }
    }
    
    // 获取存储的文件路径
    const filePah = getStoragePath();
    
    // 读取iconfont文件的数据
    const iconfontBuffer = fs.readFileSync(
      path.join(filePah.dir, "/iconfont.json")
    );
    
    const iconfontJson = JSON.parse(iconfontBuffer);
    
    /**
     * 中划线转驼峰
     *
     * @param {*} str 需要转换的字符串
     * @returns 驼峰形式的变量名
     */
    function transformStr(str) {
      var reg = /-(\w)/g;
      return str.replace(reg, function($0, $1) {
        return $1.toUpperCase();
      });
    }
    
    /**
     * 将json转换成dart文件
     *
     * @returns 转换后的文件内容
     */
    function changeJsonToDart() {
      // 需要返回的结果
      let dartContentString = "";
    
      // 遍历json,拼接字符串(注意在iconfont起的名字的格式)
      iconfontJson.glyphs.map(item => {
        dartContentString += `static const IconData ${transformStr(
          item.font_class
        )} = const IconData(0x${item.font_class},fontFamily: ${iconfontJson.font_family});\n`;
      });
    
      let dartFileContent = `
        import 'package:flutter/cupertino.dart';
    
        class Iconfont {
          ${dartContentString}
        }
    
      `;
      return dartFileContent;
    }
    
    // 执行转换函数
    const dartFileContent = changeJsonToDart();
    
    // 递归创建目录 同步方法
    function mkdirs(dirname, callback) {
      fs.exists(dirname, exists => {
        if (exists) {
          callback();
        } else {
          mkdirs(path.dirname(dirname), () => {
            fs.mkdir(dirname, callback);
          });
        }
      });
    }
    
    mkdirs(filePah.dir, () => {
      // 写入文件
      fs.writeFileSync(
        path.join(filePah.dir, filePah.base),
        dartFileContent,
        err => {
          if (err) {
            console.log(err);
          } else {
            console.log("success");
          }
        }
      );
    });
    
    

    相关文章

      网友评论

          本文标题:flutter中使用iconfont

          本文链接:https://www.haomeiwen.com/subject/eapzictx.html