Style added to exported JSON after it's referenced

[axlan]

I'm getting an error when I try to serialize a skin exported from skin composer. I'm able to trivially manually fix the JSON by reordering a style to appear before it's referenced. I'm guessing there's some issue with the field names/types between versions of VisUI, but it's still weird that this issue presents this way.

I created a new project by importing the skin packaged with VisUI 1.3.0 . See these files
basic.zip

This gave the warnings:

Property listStyle value cleared for SelectBox: default (Unsupported propety value)
Property label value cleared for TextTooltip: default (Unsupported propety value)

and when I export the project I get the warnings:

Property listStyle value cleared for SelectBox: default (Unsupported propety value)
Property label value cleared for TextTooltip: default (Unsupported propety value)
Did not export custom style default for class VisSplitPaneStyle (All fields null)
Did not export custom style default for class MultiSplitPaneStyle (All fields null)
Did not export style title for class LabelStyle (All fields null)
Did not export style select-box for class ScrollPaneStyle (All fields null)

When I try to load the exported skin in the AssetManager in libGDX I get the error:

Caused by: com.badlogic.gdx.utils.SerializationException: Error reading file: skins/custom/custom.json
	at com.badlogic.gdx.utils.Json.fromJson(Json.java:758)
	at com.badlogic.gdx.scenes.scene2d.ui.Skin.load(Skin.java:102)
	... 14 more
Caused by: com.badlogic.gdx.utils.SerializationException: Serialization trace:
{}."com.kotcrab.vis.ui.widget.ListViewStyle".default.scrollPaneStyle
scrollPaneStyle (com.kotcrab.vis.ui.widget.ListViewStyle)
	at com.badlogic.gdx.utils.Json.readFields(Json.java:870)
	at com.badlogic.gdx.scenes.scene2d.ui.Skin$1.readFields(Skin.java:462)
	at com.badlogic.gdx.utils.Json.readValue(Json.java:1011)
	at com.badlogic.gdx.scenes.scene2d.ui.Skin$1.readValue(Skin.java:436)
	at com.badlogic.gdx.utils.Json.readValue(Json.java:928)
	at com.badlogic.gdx.scenes.scene2d.ui.Skin$2.readNamedObjects(Skin.java:485)
	at com.badlogic.gdx.scenes.scene2d.ui.Skin$2.read(Skin.java:474)
	at com.badlogic.gdx.scenes.scene2d.ui.Skin$2.read(Skin.java:468)
	at com.badlogic.gdx.utils.Json.readValue(Json.java:962)
	at com.badlogic.gdx.scenes.scene2d.ui.Skin$1.readValue(Skin.java:436)
	at com.badlogic.gdx.utils.Json.fromJson(Json.java:756)
	... 15 more
Caused by: com.badlogic.gdx.utils.GdxRuntimeException: No com.badlogic.gdx.scenes.scene2d.ui.ScrollPane$ScrollPaneStyle registered with name: list
	at com.badlogic.gdx.scenes.scene2d.ui.Skin.get(Skin.java:160)
	at com.badlogic.gdx.scenes.scene2d.ui.Skin$1.readValue(Skin.java:435)
	at com.badlogic.gdx.utils.Json.readFields(Json.java:863)
	... 25 more

I can get rid of the error by moving this block of JSON:

com.badlogic.gdx.scenes.scene2d.ui.ScrollPane$ScrollPaneStyle: {
	default: {
		background: border
		hScroll: scroll-horizontal
		hScrollKnob: scroll-knob-horizontal
		vScroll: scroll
		vScrollKnob: scroll-knob-vertical
	}
	list: {
		hScroll: scroll-horizontal
		hScrollKnob: scroll-knob-horizontal
		vScroll: scroll
		vScrollKnob: scroll-knob-vertical
	}
}

to line 548 (right before the list style is reference in com.kotcrab.vis.ui.widget.ListViewStyle)

Here's the skin composer project I'm working with:
custom.zip

[raeleus]

I'll have to investigate more thoroughly later, but I imagine the default vis skin creates some colors inline or something to that effect. Skin Composer does not play well with Skins made this way. Import only works well with Skins created by Skin Composer.

If there is a demand, I'll create an importable version of the default Vis skin. I won't be able to that until after the next major feature update.

[axlan]

Hmm, I hit a similar issue when I was trying to fill in additional classes to one of the skins I downloaded off the gallery. Here's my reproduction process. in Skin Composer.

1. Create a class Foo
2. Realize I want it to reference a style for another class Bar I hadn't added yet.
3. Create the class Bar
4. Add a style property in Foo referencing a style in Bar.
5. Export the project and try to load it.

I'm seeing that in both the scmp and the JSON file the classes are added in the order they were created. This causes the style not to be found when loading. Manually reordering the scmp seems to fix things persistently.

[axlan]

I also have the same problem importing then exporting the skin on https://ray3k.wordpress.com/neutralizer-ui-skin-for-visui

[raeleus]

The order that the classes are listed is important. I'll look into it and also, someday, add support to reordering the styles from within the editor. Thanks.

[axlan]

Thanks for the clarification!

[filipjonckers]

If there is a demand, I'll create an importable version of the default Vis skin. I won't be able to that until after the next major feature update.

@raeleus is an importable version of the default vis skin already available somewhere? I'm also struggling with this issue.

[raeleus]

If there is a demand, I'll create an importable version of the default Vis skin. I won't be able to that until after the next major feature update.

@raeleus is an importable version of the default vis skin already available somewhere? I'm also struggling with this issue.

Not yet, I've been tied up with a lot of different projects. I feel like I should just release my current version of Skin Composer before delaying any further. Sorry!

[filipjonckers]

No worries ! ;-) Removed VisUI and using the stock skin files to start from
Would be nice if the widgets from VisUI would be included into libgdx which would be easier to support :-)