gkajs/gka

一款高效、高性能的帧动画生成工具

gka's Issues

序列帧播放在移动端部分手机上出现闪动问题

我按照使用流程生成序列帧代码， 在一些手机上线是能正常播放的， 但在华为 OPPO的一些机型上就会出现闪动情况， 这个怎么解决

不能直接导出 gif 文件么 ， 可以用javascript来控制 每一帧的内容么

能规定固定尺寸或者选择以最大图为尺寸吗

我想要的是这样的：

现在素材是这样的：

如果能固定一个每帧尺寸，图片居中，应该就能满足需求了。
如果选最大的图作为尺寸，也很方便。

当然，其实这样也不太好。
因为素材尺寸不一，它于画面中的居中可能结果并不是预期。
暂时没想到什么好办法。

合成的图片过大

我有156张图片， 每张图片大小50kb，生成的图片100多m，使用的是 -u canvas ,应如何优化

请问直接合好的图片能够生成css代码吗?

请问直接合好的图片能够生成css代码吗?

输出指定的图像尺寸这个功能有了吗？

我不想图片太宽了，想让它能换个行

生成合图时遇到异常情况没有抛出实际的错误，导致无法排查问题

举个例子，当 png 图片的签名非法时，合图出错，但没有抛出实际的错误，继续执行 writeFileSync 的逻辑，最终抛出了 TypeError: Cannot read property 'image' of undefined 的异常，无法获悉具体的错误情况

目前的报错：

            fs.writeFileSync(filepath, r.image);
                                         ^
TypeError: Cannot read property 'image' of undefined
    at /Users/neal/Workspace/xxx/node_modules/[email protected]@gka/lib/plugins/ImageSpritesPlugin.js:24:42
    at /Users/neal/Workspace/xxx/node_modules/[email protected]@mkdirp/index.js:30:20
    at FSReqCallback.oncomplete (fs.js:148:20)

实际的错误为：

Error: Invalid file signature
    at module.exports.Parser._parseSignature (/Users/neal/Workspace/xxx/node_modules/[email protected]@pngjs/lib/parser.js:50:18)
    ...

一种解决方案：

// 在合图异常时，直接抛出 error
// ImageSpritePlugin.js:23
function gsprites(srcs, filepath, algorithm, callback) {
    Spritesmith.run({
        src: srcs,
        algorithm: algorithm,
        algorithmOpts: {sort: false},
    }, function(err, r) {
        if (err) throw err;
        mkdirp(path.dirname(filepath), function (err) {
            fs.writeFileSync(filepath, r.image);
            // console.log('[-] ' + path.basename(filepath) +' generated');
            callback && callback(r, filepath);
        });
    });
}

首次加载图片闪烁问题

第一次加载帧动画会出现图片闪烁

install warn

npm WARN deprecated [email protected]: gulp-util is deprecated - replace it, following the guidelines at https://medium.com/gulpjs/gulp-util-ca3b1f9f9ac5
npm WARN deprecated [email protected]: Please use the native JSON object instead of JSON 3
/usr/local/bin/gka -> /usr/local/lib/node_modules/gka/bin/gka.js

是不是mac环境下用不了？

如图，在生成的gka-icon-u-normal文件夹或gka-icon-u-canvas里，只有img文件夹，没有其他文件。
使用命令:
$gka ./icon -t

can't install

canvas模板下开启--diff模式报错：Invalid file signature

环境：
node 6.11.5
npm 3.10.10

生成多张合并图片

我有个需求，有260张连续图片，希望生成多张4*3的合并图。
目前，如果使用-s合并，只能生成一张270M的图片，没法使用

可以支持放出接口

现在是一个命令行工具，如果想在项目中用呢？比如希望有如下操作：

const gka = require('gka');

...

你好，请问安装失败如何解决

如图，想做点动图放到微信小游戏上。。

安装失败，node版本：16.20.0

试了几个版本的node都安装失败 安装命令：sudo npm install -g gka --unsafe-perm=true --allow-root

生成的sprite图片不按照预定的顺序排列

采用水平或竖直排列图片时，是否能够支持文件生成的image顺序和本地文件预设的顺序一致

gka tool 命令输出无 css 文件

无法像 gka 命令一样生成 css 文件

在使用图片压缩的时候报错的了

我在使用图片压缩的时候报错如下：

C:\WINDOWS\system32>gka -t C:\Users\xxx\Pictures\tinified
gka version:1.4.6

• optimizing image..
  dir: C:\Users\xxx\Pictures\tinified
  [ 'C:\Users\xxx\Pictures\tinified' ]
  (node:11740) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 44): Error: Error in file: C:/Users/xxx/Pictures/tinified/0002.png
  ϵͳ�Ҳ���ָ����·����
  (node:11740) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

node版本为V8.1.3，请问这个是我使用错了么？

能限定图片尺寸吗，因为是以 px 为单位来定位背景的，不方便改变父级大小

当修改父级宽度时，旁边相连的 sprite 就出来了。
个人一般用 bg-size 的倍数，并用 % 为单位来定位背景。
我也不知道这样做对不对，但还是提一下吧。

生成2的N次幂sprite图

用--ratio 2不能实现，有其他命令？或者要自行实现模板？

[email protected] --count参数还是无效

图片首次闪烁

gka E:\img指令看生成的代码虽然有做图片预加载，但是在css里面animatio引用还是直接引用的本地的，和没有预处理差不多

安装时出现没权限的情况

问题

安装时出现 EACCES error，无权限错误

解决方式

方式一：

sudo npm install -g gka --unsafe-perm=true --allow-root

方式二：

修改权限,使得有权限node install.js，方式见：How to Prevent Permissions Errors

使用样例图片输出svg，比例失真

我在使用样例的一序列图片输出svg时， 打开看到动画失真
svg：

这个是css输出：

还有另一个问题 默认的svg模板 是输出svg文件出来吗？如果是的话 为什么在使用svg模板输出没有svg文件？

请问你们的官网文档使用什么写的

最好再加段js用于加载吧

当调取几百张图时会一闪一闪，和图片加载有关