Libgdx之Skin 皮肤类

Posted 2022-06-18 zqiang_55

上一节介绍了List，应该接着继续介绍其余的Widget，但是每次都要定义Style，还要定义各种属性，感觉特别麻烦。下面介绍另外一种方法，通过定义Skin来省去定义各种Style。
Skin储存Widget的各种样式(Style)来使用(如 纹理，字体，颜色，NinePatches)。当然也可以使用Libgdx系统提供的Skin，要是想这样使用的话必须添加下面资源：

可以点击这里进行下载 这时官方示例中的。

• uiskin.json 这个文件定义了默认字体， 颜色， 各种Style的属性:
• uiskin.png skin中用的各种图片的集合
• uiskin.atlas skin中用到图片的各种属性，和上面文件相当于用TexturePacker打包的集合
• default.png default.fnt 这2个文件是默认字体文件

下面重新写List的测试代码：

    Stage stage;
    List<String> list;
    String[] listName = "Libgdx", "CSDN", "daXiao","Leitu","Renhua";
    StretchViewport viewport;

    Skin skin;
    @Override
    public void create() 
        viewport = new StretchViewport(Gdx.graphics.getWidth(), Gdx.graphics.getHeight());
        viewport.getCamera().translate(Gdx.graphics.getWidth() / 2, Gdx.graphics.getHeight() /2, 0);
        viewport.getCamera().update();
        // 将ListStyle换成skin
        skin = new Skin(Gdx.files.internal("uiskin.json"));

        list = new List<String>(skin);
        list.setItems(listName);
        // 如果不设大小，那么selection就不会显示，也不会响应click事件
        list.setSize(list.getPrefWidth(), list.getPrefHeight());
        list.setPosition(200, 200);
        list.addListener(new ClickListener() 

            @Override
            public void clicked(InputEvent event, float x, float y) 
                System.out.println("selected index=" + list.getSelectedIndex());
                System.out.println("setected=" + list.getSelected());
                super.clicked(event, x, y);
            

        );
        Gdx.app.log("List", "width="+list.getWidth() + "prefer width="+list.getPrefWidth());

        stage = new Stage(viewport);
        Gdx.input.setInputProcessor(stage);

        stage.addActor(list);
    

    @Override
    public void render() 
        Gdx.gl.glClearColor(0.39f, 0.58f, 0.92f, 1.0f);
        Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);

        stage.act();
        stage.draw();
    

    @Override
    public void resize(int width, int height) 
        viewport.update(width, height);
    

    @Override
    public void dispose() 
        stage.dispose();
        //  不用的Skin要注销掉
        skin.dispose();
    

下面是效果图，可以看出选中的时的背景图发生了变化：