Этот сайт лучше всего просматривать в современном браузере с включённым JavaScript.

[Libgdx]Large amount of profile images

jayn

Hi. I'm trying to figure out how to have many cropped profiles on my character with many different attachments.

On my character, it has many hair styles, bodies, etc. It would take a lot of space to have many profile pngs with this method.
Is there a better way to do it either in editor or in runtime?

Nate

See here:
Runtime Skins - Spine Runtimes Guide: Creating attachments
You could pack the attachment images into an atlas at runtime. You'll still have many images, but the atlas would only have the images necessary.

jayn

Thanks the reply.
My other question is about cropping the skeleton. I'm follow the code from: https://gist.github.com/badlogic/a07a45c977c1d0b737f70c197aef5535 but I'm not sure how to set the size of the cropped region. I use FitViewport and here's my code:

override fun create() {
        camera = OrthographicCamera()
        viewport = FitViewport(WORLD_WIDTH, WORLD_HEIGHT, camera)
        batch = PolygonSpriteBatch()
        skin = Skin(Gdx.files.internal("ui/default_skin/uiskin.json"))
        stage = Stage(viewport, batch)

    Gdx.app.logLevel = Application.LOG_ERROR

    Gdx.input.inputProcessor = stage

    skeletonRenderer = SkeletonRenderer()
    skeletonRenderer.premultipliedAlpha = true

    val skeletonAtlas = TextureAtlas(Gdx.files.internal("game/humans/human.atlas"))
    val skeletonJson = SkeletonJson(skeletonAtlas)
    val skeletonData = skeletonJson.readSkeletonData(Gdx.files.internal("game/humans/human.json"))
    skeleton = Skeleton(skeletonData).apply {
        setPosition(250f,50f)
    }

    animationStateData = AnimationStateData(skeletonData)
    animationState = AnimationState(animationStateData)


    fbo = FrameBuffer(Pixmap.Format.RGBA8888, 512, 512, false)
    fboRegion = TextureRegion(fbo.colorBufferTexture)
}


override fun render() {
    Gdx.gl.glClearColor(0f, 0f, 0f, 1f)
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT)
    viewport.apply()
    stage.act()
    stage.draw()

    skeleton.updateWorldTransform()
    if (Gdx.input.isKeyJustPressed(Input.Keys.SPACE)) {
        useFbo = !useFbo;
    }

    if (useFbo) {
        fbo.begin();
        Gdx.gl.glClearColor(0f, 0f, 0f, 0f);
        Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
        batch.projectionMatrix = camera.combined
        batch.begin()
        skeletonRenderer.draw(batch, skeleton)
        batch.end()
        fbo.end()

        // Render FBO color buffer texture to screen
        batch.projectionMatrix = camera.combined
        batch.begin();
        batch.draw(fboRegion, skeleton.x,skeleton.y);
        batch.end();
    }
    else {
        batch.begin()
        skeletonRenderer.draw(batch, skeleton)
        batch.end()
    }
}

override fun resize(width: Int, height: Int) {
    super.resize(width, height)
    viewport.update(width, height, true)
}

When I press SPACE to draw the cropped region, my skeleton changes its width to about half and it moves slightly to the top right for some reason.

Nate

The gist code you linked renders the skeleton the same whether directly to the screen or via an FBO. Did you start with that? I can help a little less when your code is not Java. Your code has a stage, but that isn't necessary for this

it's always best to make the simplest test code possible.

The original code uses setToOrtho while your code tries to use the camera as configured by the viewport. Using a viewport is probably not what you want. Viewport apply is using HdpiUtils.glViewport which uses Gdx.graphics.getWidth() and that will be wrong for your FBO unless it happens to be the size of the application window. You can set the screen size on the viewport, but you are probably better off without it.

Make your test code simpler, render to the FBO using images or lines so you understand how that works without using a viewport, then try using a viewport if you want (though it's not required), only after all that try rendering a skeleton. Clear the FBO with 1,0,0,1 so you can see the bounds. Basically when you begin the FBO, it's like rendering to a screen (application window) that is the size of the FBO.

We've added an FBO test to spine-libgdx-tests:
https://github.com/EsotericSoftware/spine-runtimes/blob/4.0-beta/spine-libgdx/spine-libgdx-tests/src/com/esotericsoftware/spine/FboTest.java