Spritemate是Commodore 64的新精灵编辑器。它可以与Windows,Mac和Linux上的大多数现代浏览器一起使用,并且是纯JavaScript和HTML-无插件。所有数据仅在客户端处理。 Spritemate支持Commodore 64(例如SpritePad)最常见的文件格式的导入和导出,并且几乎可以用作浏览器的任何设备上的查看器和编辑器。
Spritemate仍在开发中。如果您喜欢的话,请告诉我;)随时提交拉动请求或提交问题部分中的想法,错误和请求。干杯!
最新稳定版本:https://spritemate.com/
Beta版本:https://beta.spritemate.com/
较早版本的视频:https://www.youtube.com/watch?v=n59axaeqdwe

使用npm
$ npm install
$ npm run dev
| 象征 | 捷径 | 功能 |
|---|---|---|
![]() | - | 加载文件。 支持格式:Spritemate(SPM),SpritePad(SPD,SPR) |
![]() | - | 保存文件。 支持格式:Spritemate(SPM),SpritePad 2.0和1.8.1(SPD),ASM源(TXT) |
![]() | z | 撤消。因为当你搞砸了。 |
![]() | Shift + Z | 重做。因为当您意识到这还不错 |
![]() | d | 绘制像素 |
![]() | f | 洪水填充 |
![]() | e | 橡皮 |
![]() | m | 移动 |
| 象征 | 捷径 | 功能 |
|---|---|---|
![]() | m | 在SingleColor和多色模式之间切换 |
![]() | - | 向左移动精灵 |
![]() | - | 向右移动精灵 |
![]() | - | 移动精灵 |
![]() | - | 将精灵转移 |
![]() | - | 翻转精灵水平 |
![]() | - | 翻转精灵垂直 |
![]() | - | 打开/关格显示网格显示 |
![]() ![]() | - | 缩放窗口进出 |
| 1,2,3,4 | 选择单个颜色,透明,多色1或多色2 | |
| Shift +鼠标 | 删除像素 |
| 象征 | 捷径 | 功能 |
|---|---|---|
![]() | - | 水平伸展精灵 |
![]() | - | 垂直拉伸精灵 |
![]() | - | 覆盖下一个精灵 |
![]() ![]() | - | 缩放窗口进出 |
| 象征 | 捷径 | 功能 |
|---|---|---|
![]() | - | 创建新的精灵 |
![]() | - | 删除选定的精灵 |
![]() | - | 复制精灵 |
![]() | - | 糊状精灵 |
![]() | - | 打开/关格显示网格显示 |
![]() ![]() | - | 缩放窗口进出 |
| 光标左右与右 | 循环穿过精灵列表 |
最初,我想从该项目中删除jQuery和jQuery UI,并用Vanilla JS替换它。建立时间已经增长到10秒,我发现这很烦人。复制jQuery的模态功能比预期的更具挑战性,因此我决定再次将jQuery排除在JS捆绑中,然后将其从CDN中加载。这将编译时间大大减少到4秒以下。总体而言,该应用程序仍然非常小,主要的应用程序代码约为20KB,jQuery约为98KB。
请注意,Sprite命名功能引入了两个更改:Sprite以索引号为0而不是1开始,例如第一个精灵称为“ Sprite_0”而不是“ Sprite_1”。这是始终性和我的个人理智所必需的 - 内部索引号总是为0而不是1。另一个更改是,将其导出为ASM或基本文件的Sprite数据不会再通过增加索引来标记Sprites。这意味着,无论您是否将其在精灵列表中排序到另一个位置(这似乎很明显,但以前不是这样),Sprite都会保留其名称。
Sprite命名功能是向后兼容的,因此,当您加载旧的SPM文件时,将应用默认名称。
在多色模式下,Sprite Anvert(或SpritePad中的“负”)看起来有些奇怪,但这不是错误。在SingleColor中,一个0(透明)被1(像素)代替,反之亦然,但在多色中,我们还有另外两种颜色。在这种情况下,Spritemate会像SpritePad一样开关颜色3和4。
使用多个文件时,这可能会有所帮助。如果文件尚未保存,也是一个很好的指标。请注意,由于浏览器如何保存文件和操作系统处理安全性的性质,如果在下载位置中已经存在相同的文件名(例如“ mysprites(1).spm”而不是“ mysprites.spm”),则文件可能会稍有不同的名称保存。
菜单栏似乎确实为某些设置故障,但是目前的问题是不可再现的。 THX2到Leissa进行其他测试,并发现Firefox中关闭“内容阻止”可能会解决该问题。如果您在菜单栏上遇到可再现的问题,请在此处报告说明:https://github.com/esshahn/spritemate/issues
该版本的重点是更好的用光。尽管从技术上讲没有添加功能,但现在的整体工作流程应该更好。例如,新的移动工具不再拥有四个不同的图标来向上,向下,左或右移动精灵,而是让您现在更直观。作为副作用,较少的图标使UI复杂化。
擦除像素的选项以前已经在Spritemate中(通过在绘图时按住“ Shift”),但是现在“橡皮擦”工具使其更明显,更易于在单手工作流程中使用。
已经引入了一个新的复制精灵的选项。以前通过“复制”,“新”和“糊状”(实际上是新的副本)的组合可以实现这一点,但这应该增加更直观的体验。
还有其他改进,例如视觉上更可区分的“垃圾”图标来删除精灵。如果您习惯了Photoshop(例如Photoshop),那么所有合并后的Spritemate应该开始感到更加熟悉。
尽管添加了很多功能,但我花了很长时间才完成此版本。我不得不将很多我无法可靠地工作的非常酷的新功能恢复了很多代码。因此,我必须将两个代码分支和Backport功能维护到稳定版本中。我终于决定将新功能搁置并专注于其他功能。
由于我的商业东西吸收了我所有的空闲时间,我几个月来没有机会在Spritemate上工作。另外,反馈最近也停止了,这也没有激励我太多。最终,我检查了Spritemate的流量,并对用户稳定的数量感到惊讶。因此,我决定再次将更多时间用于这个项目。无论如何,如果您喜欢Spritemate,则可以通过Mail(INGO在AWSM dot de)或给我发送推文( @AWSM9000)来使我有所不同。让我知道我如何使您改善您!
Spritemate现在在本地保存设置。它可能仍然有些奇怪,我至少知道该代码有效但不应该对我的理解(但是我是谁评判开发人员...)的情况。无论如何,为将来的更新奠定了更多配置选项的基础。
Spritemate现在在公共Beta中。感谢所有帮助找到错误并提出功能和改进的Beta测试人员。请查看Github上的文档以获取功能概述。
最常见的动作已接收到热键以快速访问。在浏览器中使用Hotkeys总是有点棘手,因为浏览器采用了许多组合(例如“复制”的CMD/CTRL + C)。因此,一些快捷方式似乎不太直观。这些功能现在可以通过按键立即获得:
(1,2,3,4) - 设置四个可用的笔/颜色(F)之一 - 切换全屏打开/OFF(D) - 在“ draw”和“ fill”模式(z) - dusto,(shift + z)= redo(m) - toggle singlecolor/multicolor/multicolor(Cursor左,左,右) -
预览窗口中的切换精灵叠加层。以下精灵将用作叠加层。预览窗口显示了精灵,编辑窗口显示了另一个精灵的可见度(例如洋葱皮)。请注意,当前Sprite覆盖信息仅以本机施加格式存储。