• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

Cocos 扩展 - 骨骼查看器: [Cocos Creator 编辑器扩展] 用于快速预览骨骼动画。提供独 ...

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称:

Cocos 扩展 - 骨骼查看器

开源软件地址:

https://gitee.com/ifaswind/ccc-skeleton-viewer

开源软件介绍:

骨骼查看器

介绍

[Cocos Creator 编辑器扩展]

用于快速预览骨骼动画。提供独立窗口,也可以附着在编辑器中;可以在编辑器内直接选中资源来预览,也支持打开外部的资源...

目前仅支持 Spine 3.5~4.0 资源,未来应该也会支持 DragonBones 资源。

开源

本扩展项目完全开源,仓库地址:https://gitee.com/ifaswind/ccc-skeleton-viewer

如果你觉得这个项目还不错,请不要忘记点 star

如有使用上的问题,可以在 Gitee 仓库中提 Issue 或者添加我的微信 im_chenpipi 并留言。

截图

screenshot-1

screenshot-2

screenshot-3

screenshot-4

screenshot-5

screenshot-6

screenshot-7

screenshot-8

setting-panel

运行环境

平台:Windows、macOS

引擎:Cocos Creator 2.x

下载 & 安装

扩展商店安装

本扩展已上架 Cocos 商店,点击 Cocos Creator 编辑器顶部菜单栏中的 扩展 -> 扩展商店 即可打开扩展商店。

在上方搜索栏中输入“骨骼查看器”并搜索就可以找到本插件,点进去直接安装即可(建议安装到全局)。

cocos-store

骨骼查看器:http://store.cocos.com/app/detail/3008

自行下载安装

此处或仓库发行版处下载最新的扩展压缩包。

下载完成后将压缩包解压:

  • Windows:解压到 C:\Users\${你的用户名}\.CocosCreator\packages\ 目录下
  • macOS:解压到 ~/.CocosCreator/packages/ 目录下

以我的电脑为例,扩展的 package.json 文件的完整路径分别为:

  • Windows:C:\Users\Shaun\.CocosCreator\packages\ccc-skeleton-viewer\package.json
  • macOS:/Users/shaun/.CocosCreator/packages/ccc-skeleton-viewer/package.json

使用说明

预览

点击编辑器顶部菜单栏中的 扩展 -> 骨骼查看器 -> 预览 即可打开扩展的预览面板。

界面

预览区

面板上半部分是「预览区」:

  • 左上角的三个图标分别是:「资源信息」、「选择骨骼动画资源」、「重置」;
  • 而右上角为当前正在使用的骨骼动画运行时版本。

鼠标悬停在「资源信息图标」上即可查看当前的骨骼动画资源信息。

当鼠标处于「预览区」中时,滑动鼠标滚轮可以快速缩放预览画面。

选项区

面板下半部分为「选项区」,包含骨骼动画的一些可选项。

这些选项只有选择了骨骼动画资源后才会生效。

附着到编辑器

预览面板可以附着到编辑器窗口内的任意区域(如上方截图中的 7 与 8)。

只需要拖拽到想要的位置并与编辑器窗口交互即可。

附着后点击面板右上角的「弹出」按钮即可恢复为独立面板。

选择资源

编辑器内资源

打开骨骼预览面板(或处于附着状态):

  1. 在编辑器内的「资源管理器」选中任意骨骼资源;
  2. 在编辑器内的「层级管理器」选中带有 sp.Skeleton 组件并且已经挂载了骨骼资源的节点。

预览面板会自动检测并读取相应的骨骼动画并自动播放。

你也可以预先选中骨骼资源或节点后再打开预览面板,同样会自动读取。

骨骼资源指的是整套动画资源中的 jsonskel 格式的文件。

外部资源

点击「预览区」左上角的「选择骨骼动画资源」按钮即可选择外部的动画文件。

至少需要选择一个骨骼文件(jsonskel 格式),纹理(png 格式)和图集(atlas 格式)可选可不选。

设置

点击编辑器顶部菜单栏中的 扩展 -> 骨骼查看器 -> 设置 即可打开扩展的设置面板。

在设置面板中你可以选择一个用来快速打开预览面板的快捷键,也可以自定义一个自己喜欢的快捷键。

不过需要注意的是,并非所有的按键都可以使用,因为有些快捷键已被系统或 Cocos Creator 占用。

键盘快捷键参考:https://www.electronjs.org/docs/api/accelerator


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap