Changing multiple textures in scene

Question

according to examples from site andengine examples I've created own project but with more than one object. Let's say it is a chess board, I have 8 colors per 8 rectangles. Now I stuck because if one of rectangles with specific color will be set to false (I have variable isclicked = false/true ) all rectangles with the same color will also also changed. How should I fix this problem?

I wrote the same code like the source from link above. I store colors in single pic which is further splitting.

Here are a pics:

not clicked colors


clicked colors


in game (none was clicked)


in game (one was clicked)

Here is my code, I'll appreciate for any help.

public class Main extends SimpleBaseGameActivity {

    private static final int SIZE = 50;
    private static final int IMAGES_COUNT = 8;
    private static int CAMERA_WIDTH = 400;
    private static int CAMERA_HEIGHT = 600;
    private ITextureRegion[] mColorsRegion = new ITextureRegion[8];

    //
    private BitmapTextureAtlas mColorsTextureAtlas;
    private TiledTextureRegion mColorsTextureRegion;
    private TextureRegion mBackgroundTextureRegion;
    private BitmapTextureAtlas mBackgroundTextureAtlas;
    private BitmapTextureAtlas mPanelTextureAtlas;
    private TextureRegion mPanelTextureRegion;

    @Override
    public EngineOptions onCreateEngineOptions() {
        final Camera camera = new Camera(0, 0, CAMERA_WIDTH, CAMERA_HEIGHT);
        return new EngineOptions(true, ScreenOrientation.PORTRAIT_FIXED, new RatioResolutionPolicy(CAMERA_WIDTH, CAMERA_HEIGHT), camera);
    }

    @Override
    protected void onCreateResources() {

        BitmapTextureAtlasTextureRegionFactory.setAssetBasePath("gfx/");

        // stuff with colors
        this.mColorsTextureAtlas = new BitmapTextureAtlas(this.getTextureManager(), 320, 40, TextureOptions.BILINEAR);
        this.mColorsTextureRegion = BitmapTextureAtlasTextureRegionFactory.createTiledFromAsset(this.mColorsTextureAtlas, this, "bar.png",
                0, 0, 8, 1);
        this.mColorsTextureAtlas.load();

        // woohoo! stuff with background
        this.mBackgroundTextureAtlas = new BitmapTextureAtlas(getTextureManager(), 400, 800, TextureOptions.BILINEAR_PREMULTIPLYALPHA);
        this.mBackgroundTextureRegion = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBackgroundTextureAtlas, this,
                "bg.jpg", 0, 0);
        this.mBackgroundTextureAtlas.load();

        // stuff with panel
        this.mPanelTextureAtlas = new BitmapTextureAtlas(getTextureManager(), 400, 800, TextureOptions.BILINEAR_PREMULTIPLYALPHA);
        this.mPanelTextureRegion = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mPanelTextureAtlas, this, "panel.png", 0, 0);
        this.mPanelTextureAtlas.load();

    }

    @Override
    protected Scene onCreateScene() {

        this.mEngine.registerUpdateHandler(new FPSLogger());

        final Scene scene = new Scene();
        scene.setBackground(new Background(5.F, 5.F, 5.F));

        // show background
        Sprite background = new Sprite(0, 0, mBackgroundTextureRegion, getVertexBufferObjectManager());
        scene.attachChild(background);

        // show panel
        Sprite panel = new Sprite(0, 400, mPanelTextureRegion, getVertexBufferObjectManager());
        scene.attachChild(panel);

        // show minirectangles

        // Init generating color numbers
        MyColors colors = new MyColors(IMAGES_COUNT);

        // Init minirectangles with randomed images
        MiniRectangle[] minirectangle = new MiniRectangle[IMAGES_COUNT * IMAGES_COUNT];
        for (int i = 0; i < IMAGES_COUNT; i++) {
            for (int j = 0; j < IMAGES_COUNT; j++) {
                final int index = i * IMAGES_COUNT + j;
                minirectangle[index] = new MiniRectangle(j * SIZE + 2, i * SIZE + 2, SIZE - 4, SIZE - 4,
                        mColorsTextureRegion.getTextureRegion(colors.getRan(index)), getVertexBufferObjectManager()) {

                    @Override
                    public boolean onAreaTouched(TouchEvent pSceneTouchEvent, float pTouchAreaLocalX, float pTouchAreaLocalY) {

                        if (this.isVisible()) {
                            setClicked();

                            togglex(this.isClicked());

                        }
                        return true;
                    }
                };

                // further setting for minirectangle
                minirectangle[index].setIndexX(j);
                minirectangle[index].setIndexY(i);
                minirectangle[index].setNumber(index);
                minirectangle[index].setClicked(false);
                minirectangle[index].setColorNumber(colors.getRan(index));
                minirectangle[index].addColors(mColorsRegion);

                // attach to scene and register touch arena
                scene.attachChild(minirectangle[index]);
                scene.registerTouchArea(minirectangle[index]);
            }
        }

        return scene;
    }

    protected void togglex(boolean clicked) {
        this.mColorsTextureAtlas.clearTextureAtlasSources();
        boolean xclicked = clicked;
        BitmapTextureAtlasTextureRegionFactory.createTiledFromAsset(this.mColorsTextureAtlas, this, xclicked ? "bar2.png"
                : "bar.png", 0, 0, 8, 1);

    }
}

Answer 1

You can't change the contents of the texture atlas - all of your texture regions are referencing it, so they are all changed.

Think of a texture atlas as a large array . The texture regions are like pointers to different regions in this array. So if you want to update your sprite's texture region, you should point it to another area in the texure . But instead, you are changing the contents of this large array, the texture. So all of the texture regions which reference it are changing, too.

Solution :

You should load both images to your atlas, and change the texture regions only .

Loading both images:

this.mColorsTextureAtlas = new BitmapTextureAtlas(this.getTextureManager(), 320, 80, TextureOptions.BILINEAR); //Note that I doubled the height of the texture.
this.mColorsNotClickedTextureRegion = BitmapTextureAtlasTextureRegionFactory.createTiledFromAsset(this.mColorsTextureAtlas, this, "bar.png", 0, 0, 8, 1);
this.mColorsClickedTextureRegion = BitmapTextureAtlasTextureRegionFactory.createTiledFromAsset(this.mColorsTextureAtlas, this, "bar2.png", 0, 40, 8, 1); //The position of bar2.png is not 0,0 because it'll override bar.png. If the height is 40, we position it 40 units below the position of bar.png.
this.mColorsTextureAtlas.load();

Now, when a rectangle is clicked, change it's texture region.