# GKA **Repository Path**: Component_Technology/GKA ## Basic Information - **Project Name**: GKA - **Description**: GKA 是一款简单的、高效的帧动画生成工具，图片处理工具 - **Primary Language**: JavaScript - **License**: MIT - **Default Branch**: master - **Homepage**: https://www.oschina.net/p/gka - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 3 - **Created**: 2020-02-26 - **Last Updated**: 2020-12-19 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README

gka

gka

简单的、高效的帧动画生成工具

--- # GKA [gka](https://github.com/joeyguo/gka) 是一款简单的、高效的帧动画生成工具，图片处理工具。 只需一行命令，快速图片优化、生成动画文件，支持效果预览。 * **一键式:** 图片文件批量序列化重命名，生成帧动画文件，支持预览 * **性能佳:** 支持`相同图片复用`✓ `图片空白裁剪`✓ `合图优化`✓ `图片压缩`✓ `图片空白拆分优化`✓ `图片像素差优化`✓ `多倍图适配`✓ * **多模板:** 内置多种文件输出模板，支持自定义模板 在线官方文档：[https://gka.js.org](https://gka.js.org) ![gka-show](https://user-images.githubusercontent.com/10385585/28651130-77b0bc80-72b2-11e7-9c42-7aad9e5774a7.jpg) # 快速开始 ## 安装 ```bash npm i gka -g ``` 注：安装时如出现权限问题，可先查看此[issues](https://github.com/gkajs/gka/issues/23) ## 开始使用 只需一行命令，快速生成动画文件，支持效果预览。 ```bash gka E:\img # 对 E:\img 目录中的图片进行处理 ``` 生成新的文件、效果预览
处理前处理后
 

./img
├── gka_1.png
├── gka_2.png
├── gka_3.png
└── ...


./gka-img
└── gka.html
└── gka.css
└── img
    ├── gka_1.png
    ├── gka_2.png
    ├── gka_3.png
    └── ...
![rockit](https://user-images.githubusercontent.com/10385585/28810071-499e24a2-76ba-11e7-9ee8-cd600c0035b1.gif) # 使用教程 ## gka 一键快速图片优化、生成动画文件。 ### Command 命令 ```bash gka [options] ``` ### Options 参数选项 ``` -d, --dir # 图片文件夹地址 -u, --unique [boolean]       # 开启相同图片复用优化 -c, --crop [boolean] # 开启空白裁剪优化 -s, --sprites [boolean] # 开启合图优化 -m, --mini [boolean]     # 开启图片压缩 -p, --prefix [string]         # 文件重命名前缀 -t, --template # 生成动画文件模板 默认 css ，可选模见 Templates 模板列表 -f, --frameduration # 每帧时长，默认 0.04 -i, --info [boolean]         # 开启输出信息文件 -o, --output # 指定生成目录地址 -a, --algorithm # 合图布局模式 默认 left-right，可选 binary-tree | top-down .. --bgcolor # 为图片增加背景色，可选，支持格式：'rgb(255,205,44)'、 '#ffcd2c' --count # 生成多合图，指定几张图片合成一张合图，可选 --ratio             # 生成指定的N倍图动画，如 --ratio 2 支持retina屏幕的2倍图动画， 可选 --split [boolean]             # 开启图片空白拆分优化，与 -t canvas 结合使用 --diff [boolean]             # 开启图片像素差优化，与 -t canvas 结合使用 --minirate [string]           # 自定义压缩比率，格式: min-max，与 -m 结合使用 ``` ### Templates 模板列表 使用方式 ```bash gka 图片目录 -t 模板名 ``` #### 内置的模板列表 - css - 默认模板 - 输出 css 动画文件 - 结合 -ucs 支持 `相同帧图片复用`✓ `空白裁剪优化`✓ `合图优化`✓ (可选)  - canvas - 输出 canvas 动画文件 - 结合 -ucs 支持 `相同帧图片复用`✓ `空白裁剪优化`✓ `合图优化`✓ (可选)  - 结合 --diff 支持 `图片像素差优化`✓ (可选)  - 结合 --split 支持 `图片空白拆分优化`✓ (可选)  - svg - 输出 svg 动画文件，支持 `自适应缩放雪碧图`✓ - 结合 -ucs 支持 `相同帧图片复用`✓ `空白裁剪优化`✓ `合图优化`✓ (可选)  #### 内置的自定义模板列表 - percent - 输出 css 百分比动画文件 - 使用该方案支持 `移动端多倍图适配`✓ `自适应缩放雪碧图`✓ - 结合 -u 支持 `相同帧图片复用`✓ (可选)  - 默认开启 `开启合图优化`✓ - [Github 地址](https://github.com/gkajs/gka-tpl-percent) - createjs - 输出 createjs 精灵图动画文件 - 结合 -uc 支持 `相同帧图片复用`✓ `空白裁剪优化`✓ (可选)  - 默认开启 `开启合图优化`✓ - [Github 地址](https://github.com/gkajs/gka-tpl-createjs) - studiojs - 输出 studiojs 动画文件 - 结合 -uc 支持 `相同帧图片复用`✓ `空白裁剪优化`✓ (可选)  - 默认开启 `开启合图优化`✓ - [Github 地址](https://github.com/gkajs/gka-tpl-studiojs) #### 增加模板 模板支持动态增加，只需安装需要的模板。即时安装，即刻可用。 ```bash npm i gka-tpl-模板名 -g ``` ### 使用示例 对 E:\img 目录中的图片进行处理。 1. 快速生成帧动画 ```bash gka E:\img ``` 2. 进行图片去重、合图优化，输出 css 动画文件 ```bash gka E:\img -us ``` 3. 进行图片去重、空白裁剪、合图优化，使用 canvas 模板，输出 canvas 动画文件 ```bash gka E:\img -ucs -t canvas ``` # 定制化 ## 开发模板 TODO #### 命名规范 #### 开发流程 #### 发布模版 #### 使用模板 # Welcome * 欢迎 Pull requests、Issues 一般在24小时内处理 * 讨论与咨询请+QQ 3201590286 :D # License [MIT](./LICENSE) Copyright (c) 2017 - present, joeyguo