DxLibSpineViewer

Spine viewer with practical manipulation feature, based on runtime for DxLib.

Spine runtime

• Spine runtime for DxLib provides functionality to (1) load texture and (2) render skeleton.
• There are two kind of runtimes depending on the official generic runtimes to be used with.
  • dxlib_spine.cpp and dxlib_spine.h are to be used with spine-cpp. (3.8 to 4.1)
  • dxlib_spine_c.cpp and dxlib_spine_c.h are to be used with spine-c. (3.5 to 4.1)
    • Class is used because DxLib is C++ library, but STL is avoided.

Besides, there is a runtime for spine 2.1.27 under projects/DxLibSpineViewerC-2.1. But note that transformation method is totally different from later versions.

Spine viewer

The viewer is built with Spine generic runtime 2.1, 3.5, 3.6, 3.7, 3.8, 4.0, and 4.1.

Feature

• Multiple Spines rendering
  • Rendered in filename ascending or descending order.
• Runtime manipulation
  • Exclude slot
  • Mix skins
  • Mix animations
  • Replace attachment
• Media file export
  • As PNG, GIF, JPG, and H264.
    • H264 encoding is available only for Intel CPU.
• Transparent/borderless window style

Demonstration

Multiple rendering

Multiple.rendering.mp4

Mix animations

Mix.animation.mp4

Exclude slot

Exclude.slot.mp4

Replace attachment

Replace.attachment.mp4

Media export

Media.export.mp4

Transparent window

Transparent.window.mp4

The following sections are on the viewer.

Menu functions

Entry	Item	Action
File	Open folder	Open folder-select-dialogue.
-	Setting	Open a dialogue to set atlas/skelton extensions to pick up when opening folder.
-	Select files	Pick up atlas and skeleton files one by one regardless of their extension.
Image	Manipulation	Open a dialogue to specify slots to be excluded, skins or animations to be mixed.
-	Re-attachment	Open a dialogue to replace attachment.
Window	Through-seen	Toggle window's transparancy.
-	Allow manual sizing	Allow/forbid manual sizing of window. Default: forbidden
-	Move view on release	Toggle view-point behaviour; move while dragging or when dragged button is released.

Load spine(s) via Open folder

1. In the Setting dialogue, specify atlas and skeleton extensions.
2. From Open folder, select a folder containing atlas/skel(s) with specified extensions.

Load spine(s) via Select files

1. From Select files, first select atlas file(s) to load.
2. In the secoend dialogue, select skel file(s) which is/are pair(s) of atlas.

Context-menu function

• The context-menu appears only when spine is loaded, and the items of which varies depending on whether it is under recording or not.

Idle state

Menu item	Action
Snap as PNG	Save the current screen as PNG.
Snap as JPG	Save the current screen as JPG.
Start image recording	Start storing screen frames at intervals.
Start video recording	Start recording screen as H264.

Image storing state

Menu item	Action
Save as GIF	Save stored frames into a single GIF file.
Save as PNGs	Save stored frames as separate PNG files.

Video recording state

Menu item	Action
End recording	End video recording.

• The files are saved in the subdirectory of the execution file.
  • The folder is named after folder-name when loaded via Open folder, and the first atlas filename when via Select files.
• PNG and JPG file will be named like home_4.475018.png where home is animation name, and 4.475018 is animation frame when saved.
• GIF file will be named like wait.gif where wait is animation name.
• Mind that width * height * 4 byte of memory will be consumed every recording frame.
• H264 file will be named like fp.mp4 where fp is animation name.

Mouse functions

Input	Action
Wheel scroll	Scale up/down. Combining with Ctrl to retain window size.
Left pressed + wheel scroll	Speed up/down the animation.
Left click	Switch the animation.
Left drag	Move view-point.
Middle click	Reset scale, animation speed, and view-point to default.
Right pressed + middle click	Hide/show window's border and menu. Having hidden, the window goes to the origin of display.
Right pressed + left click	Start moving borderless window. Left click to end.
Right pressed + wheel scroll	Switch the skin.

Tip on transparent window

1. Check menu item Window->Through-seen to make window transparent.
2. Right pressed + middle click to make window borderless.
3. Right pressed + left click to move borderless window.

Keyboard functions

Input	Action
Esc	Close the application.
Up	Open the previpus folder.
Down	Open the next folder.
A	Enable/disable premultiplied alpha. Default: enabled.
B	Prefer/ignore blned-mode specified by slots. Default: preferred.
R	Toggle draw-order between filename asc/descending order. Default: ascending order.
Z	Enable/disable depth-buffer. Default: disabled.

• Up and Down key are valid only when the current spine(s) is/are loaded via Open folder.
• Disable PMA with A if it is too bright, and enable if darkish.
• Force normal blend mode with B if multiply is not well represented.

External libraries

• DxLib
• Spine Runtimes

Build

1. Run shared-src/deps/CMakeLists.txt.
2. Open DxLibSpineViewer.sln with Visual Studio.

The CMakeLists.txt modifies some of the external sources as well as obtains them.

• For spine-c 3.5, renames some of the functions which lack sp prefix in extension.c and extension.h so as to be consistent with those of 3.6 and later.
• For spine-c 2.1, supplies binary skeleton reader which is lacking in official 2.1.25 runtime, and overwrites some of the files with those from here.

deps directory will be as follows:

...
├ DxLibSpineC
│  └ ...
├ DxLibSpineCpp
│  └ ...
├ projects
│  └ ...
├ shared-src
│  ├ deps
│  │  ├ dxlib // static libraries and headers of DxLib for VC
│  │  │  └ ...
│  │  ├ spine-c-x.x // Spine C generic runtime for version x.x
│  │  │  ├ include
│  │  │  │  └ ...
│  │  │  └ src
│  │  │     └ ...
│  │  ├ ...
│  │  ├ spine-cpp-x.x // Spine C++ generic runtime for version x.x
│  │  │  ├ include
│  │  │  │  └ ...
│  │  │  └ src
│  │  │     └ ...
│  │  └ ...
│  └ ...
├ DxLibSpineViewer.sln
└ ...