I want to show a triangle strip when user swap finger on screen. I am not sure how to do it with AndEngine, using particle system or using sprites or using Triangle Strip algo...
I haven't wrote any code because I am struck that what to do. I am uploading an image please share your ideas.
Update
someone has done this in Iphone but unfortunately I am unfamiliar with language syntax please help me in understanding algo of this code https://github.com/hiepnd/CCBlade
**Effect I want **
Complete Android Project Download
http://www.andengine.org/forums/resources/complete-runnable-project/1301
I have done this code but could not get the desired effect...
package org.az.algo.examples;
import javax.microedition.khronos.opengles.GL10;
import org.anddev.andengine.engine.Engine;
import org.anddev.andengine.engine.camera.Camera;
import org.anddev.andengine.engine.options.EngineOptions;
import org.anddev.andengine.engine.options.EngineOptions.ScreenOrientation;
import org.anddev.andengine.engine.options.resolutionpolicy.RatioResolutionPolicy;
import org.anddev.andengine.entity.particle.ParticleSystem;
import org.anddev.andengine.entity.particle.emitter.RectangleParticleEmitter;
import org.anddev.andengine.entity.particle.initializer.AlphaInitializer;
import org.anddev.andengine.entity.particle.initializer.ColorInitializer;
import org.anddev.andengine.entity.particle.initializer.GravityInitializer;
import org.anddev.andengine.entity.particle.initializer.RotationInitializer;
import org.anddev.andengine.entity.particle.modifier.AlphaModifier;
import org.anddev.andengine.entity.particle.modifier.ColorModifier;
import org.anddev.andengine.entity.particle.modifier.ExpireModifier;
import org.anddev.andengine.entity.scene.Scene;
import org.anddev.andengine.entity.scene.Scene.IOnSceneTouchListener;
import org.anddev.andengine.entity.sprite.Sprite;
import org.anddev.andengine.entity.util.FPSLogger;
import org.anddev.andengine.input.touch.TouchEvent;
import org.anddev.andengine.opengl.texture.TextureOptions;
import org.anddev.andengine.opengl.texture.atlas.bitmap.BitmapTextureAtlas;
import org.anddev.andengine.opengl.texture.atlas.bitmap.BitmapTextureAtlasTextureRegionFactory;
import org.anddev.andengine.opengl.texture.region.TextureRegion;
import android.view.ViewGroup.MarginLayoutParams;
import android.widget.Toast;
public class ParticleSystemSimpleExample extends BaseExample {
// ===========================================================
// Constants
// ===========================================================
private static final int CAMERA_WIDTH = 720;
private static final int CAMERA_HEIGHT = 480;
// ===========================================================
// Fields
// ===========================================================
private Camera mCamera;
private BitmapTextureAtlas mBitmapTextureAtlas;
private TextureRegion mParticleTextureRegion;
private BitmapTextureAtlas mBitmapTextureAtlasStreak;
private TextureRegion mStreadTextureRegion;
private Sprite[] mSprite = new Sprite[20];
private int mIndex = 0;
// ===========================================================
// Constructors
// ===========================================================
// ===========================================================
// Getter & Setter
// ===========================================================
// ===========================================================
// Methods for/from SuperClass/Interfaces
// ===========================================================
#Override
public Engine onLoadEngine() {
Toast.makeText(this, "Touch the screen to move the particlesystem.", Toast.LENGTH_LONG).show();
this.mCamera = new Camera(0, 0, CAMERA_WIDTH, CAMERA_HEIGHT);
return new Engine(new EngineOptions(true, ScreenOrientation.LANDSCAPE, new RatioResolutionPolicy(CAMERA_WIDTH, CAMERA_HEIGHT), this.mCamera));
}
#Override
public void onLoadResources() {
this.mBitmapTextureAtlas = new BitmapTextureAtlas(32, 32, TextureOptions.BILINEAR_PREMULTIPLYALPHA);
this.mParticleTextureRegion = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlas, this, "gfx/particle_point.png", 0, 0);
this.mBitmapTextureAtlasStreak = new BitmapTextureAtlas(128, 16, TextureOptions.BILINEAR_PREMULTIPLYALPHA);
this.mStreadTextureRegion = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlasStreak, this, "gfx/streak1.png", 0, 0);
this.mEngine.getTextureManager().loadTextures(this.mBitmapTextureAtlas, this.mBitmapTextureAtlasStreak);
}
#Override
public Scene onLoadScene() {
this.mEngine.registerUpdateHandler(new FPSLogger());
final Scene scene = new Scene();
// final CircleOutlineParticleEmitter particleEmitter = new CircleOutlineParticleEmitter(CAMERA_WIDTH * 0.5f, CAMERA_HEIGHT * 0.5f + 20, 80);
final RectangleParticleEmitter particleEmitter = new RectangleParticleEmitter(CAMERA_WIDTH * 0.5f, CAMERA_HEIGHT * 0.5f, 5f,5f);
// final PointParticleEmitter particleEmitter = new PointParticleEmitter(10, 10);
final ParticleSystem particleSystem = new ParticleSystem(particleEmitter, 100, 100, 1000, this.mParticleTextureRegion);
particleSystem.setParticlesSpawnEnabled(false);
scene.setOnSceneTouchListener(new IOnSceneTouchListener() {
#Override
public boolean onSceneTouchEvent(final Scene pScene, final TouchEvent pSceneTouchEvent) {
if(pSceneTouchEvent.getAction() == TouchEvent.ACTION_MOVE){
particleSystem.setParticlesSpawnEnabled(true);
particleEmitter.setCenter(pSceneTouchEvent.getX(), pSceneTouchEvent.getY());
mSprite[getIndex()].setPosition(pSceneTouchEvent.getX(), pSceneTouchEvent.getY());
mSprite[getIndex()].setVisible(true);
}else if (pSceneTouchEvent.getAction() == TouchEvent.ACTION_UP){
particleSystem.setParticlesSpawnEnabled(false);
hideAll();
}else if(pSceneTouchEvent.getAction() == TouchEvent.ACTION_DOWN){
particleSystem.reset();
}
return true;
}
});
particleSystem.addParticleInitializer(new ColorInitializer(1, 0, 0));
particleSystem.addParticleInitializer(new AlphaInitializer(0));
particleSystem.setBlendFunction(GL10.GL_SRC_ALPHA, GL10.GL_ONE);
// particleSystem.addParticleInitializer(new VelocityInitializer(-2, 2, -20, -10));
particleSystem.addParticleInitializer(new GravityInitializer());
// particleSystem.addParticleModifier(new ScaleModifier(0.5f, 1.0f, 0, 1.5f));
particleSystem.addParticleModifier(new ColorModifier(1, 1, 0, 0.5f, 0, 0, 0, 3));
particleSystem.addParticleModifier(new ColorModifier(1, 1, 0.5f, 1, 0, 1, 4, 6));
particleSystem.addParticleModifier(new AlphaModifier(0, 1, 0, 0.5f));
particleSystem.addParticleModifier(new AlphaModifier(1, 0, 2.5f, 3.5f));
particleSystem.addParticleModifier(new ExpireModifier(6, 6f));
scene.attachChild(particleSystem);
for(int i = 0; i < mSprite.length; i++){
mSprite[i] = new Sprite(-20, 0, mStreadTextureRegion);
mSprite[i].setVisible(false);
scene.attachChild(mSprite[i]);
}
return scene;
}
#Override
public void onLoadComplete() {
}
private int getIndex(){
if(mIndex >= mSprite.length -1){
mIndex = 0;
}
System.out.println("Index ........ "+mIndex);
return mIndex++;
}
private void hideAll(){
for(int i = 0; i<mSprite.length; i++){
mSprite[i].setVisible(false);
mSprite[i].setPosition(-CAMERA_WIDTH, 0);
}
}
// ===========================================================
// Methods
// ===========================================================
// ===========================================================
// Inner and Anonymous Classes
// ===========================================================
}
image I used with this code is also attached
Updated
partial effect achieved.. but problem on fast swiping.. all complete projects are uploaded here http://www.andengine.org/forums/post31772.html#p31772
Here is a solution in LibGDX. It uses GL_TRIANGLE_STRIP.
https://github.com/mattdesl/lwjgl-basics/wiki/LibGDX-Finger-Swipe
The final solution uses two triangle strips and a custom texCoord attribute, allowing for us to use a lookup texture to achieve fake (but efficient) anti-aliasing. A more efficient/flexible anti-aliasing would use shaders and a single triangle strip. Use vertex attribute -1.0 for the top and 1.0 for the bottom edge of your swipe, and 1.0 for the tips. Then in the frag shader, use abs() -- so 0.0 means "center" and 1.0 means "edge."
Something like this:
color.a *= smoothstep(0.0, 2./thickness, 1.0-abs(vTexCoord.t));
Related
I'd like to have a path transition in such a way, that the path behaves relative to the window size, even when the size is changed during the animation. Furthermore, when the animation is completed, the animated element should use the stay at the relative destination location.
tileWidthProperty and tileHeightProperty are class members that I added for convinience and they simply divide the main pane's size in eights.
This is the code I have:
public void applyMove(final Ellipse toBeMoved, final int startCol, final int startRow, final int endCol, final int endRow)
{
Platform.runLater(() ->
{
final Path path = new Path();
final MoveTo startingPoint = new MoveTo();
final LineTo endPoint = new LineTo();
startingPoint.xProperty().bind(tileWidthProperty.multiply(startCol).add(tileWidthProperty.divide(2)));
startingPoint.yProperty().bind(tileHeightProperty.multiply(startRow).add(tileHeightProperty.divide(2)));
endPoint.xProperty().bind(tileWidthProperty.multiply(endCol).add(tileWidthProperty.divide(2)));
endPoint.yProperty().bind(tileHeightProperty.multiply(endRow).add(tileHeightProperty.divide(2)));
path.getElements().add(startingPoint);
path.getElements().add(endPoint);
toBeMoved.centerXProperty().unbind();
toBeMoved.centerYProperty().unbind();
PathTransition transition = new PathTransition(Duration.millis(10000), path, toBeMoved);
transition.setOrientation(PathTransition.OrientationType.NONE);
transition.setCycleCount(1);
transition.setAutoReverse(false);
//bind the node at the destination.
transition.setOnFinished(event ->
{
toBeMoved.centerXProperty().bind(tileWidthProperty.multiply(endCol).add(tileWidthProperty.divide(2)));
toBeMoved.centerYProperty().bind(tileHeightProperty.multiply(endRow).add(tileHeightProperty.divide(2)));
toBeMoved.setTranslateX(0.0);
toBeMoved.setTranslateY(0.0);
});
transition.play();
});
}
The col and row parameters are integers that are known to be 0 <= x < 8. They are the column and row of the tile position in the 8*8 grid.
The binding of the MoveTo and LineTo elements, however does not seem to have any effect.
First of all, once any standard Animation is started it does not change parameters.
So if anything changes, you have to stop the animation and start it again with new parameters.
I noticed you're trying to bind centerX and centerY after the transition is complete, which is wrong: PathTransition moves elements using translateX and translateY.
And for better debug you can actually add Path to the scene graph to see where your element will go.
Path path = new Path();
parent.getChildren().add(path);
I assume that tileWidthProperty and tileHeightProperty are bound to the actual parent size using something like this:
tileWidthProperty.bind(parent.widthProperty().divide(8));
tileHeightProperty.bind(parent.heightProperty().divide(8));
So I created example just to show how it might look like.
import javafx.animation.PathTransition;
import javafx.application.Application;
import javafx.application.Platform;
import javafx.beans.InvalidationListener;
import javafx.beans.property.DoubleProperty;
import javafx.beans.property.SimpleDoubleProperty;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.scene.shape.Ellipse;
import javafx.scene.shape.LineTo;
import javafx.scene.shape.MoveTo;
import javafx.scene.shape.Path;
import javafx.stage.Stage;
import javafx.util.Duration;
public class Main extends Application {
private Pane parent;
private final DoubleProperty
tileWidthProperty = new SimpleDoubleProperty(),
tileHeightProperty = new SimpleDoubleProperty();
private EllipseTransition ellipseTransition;
#Override
public void start(Stage primaryStage) {
this.parent = new Pane();
tileWidthProperty.bind(parent.widthProperty().divide(8));
tileHeightProperty.bind(parent.heightProperty().divide(8));
// create ellipse
final Ellipse ellipse = new Ellipse(25., 25.);
parent.getChildren().add(ellipse);
// show the stage
primaryStage.setScene(new Scene(parent, 800, 800));
primaryStage.show();
// create listeners that listen to size changes
InvalidationListener sizeChangeListener = l -> {
if(ellipseTransition != null) {
// refreshAndStart returns null if transition is completed
// let's call it delayed cleanup :)
ellipseTransition = ellipseTransition.refreshAndStart();
} else {
System.out.println("ellipseTransition cleaned up!");
}
};
// add listeners to the corresponding properties
tileWidthProperty.addListener(sizeChangeListener);
tileHeightProperty.addListener(sizeChangeListener);
// move ellipse 0,0 -> 7,7
applyMove(ellipse, 0, 0, 7, 7, Duration.millis(5000));
// interrupt transition at the middle, just for fun
/*new Thread(() -> {
try {
Thread.sleep(2500);
} catch (InterruptedException e) {
return;
}
applyMove(ellipse, 2, 3, 4, 5, Duration.millis(1000));
}).start();*/
}
public void applyMove(final Ellipse toBeMoved, final int startCol, final int startRow, final int endCol, final int endRow, final Duration duration) {
Platform.runLater(() -> {
// if transition is still up, then stop it
if(ellipseTransition != null) {
ellipseTransition.finish();
}
// and create a new one
ellipseTransition = new EllipseTransition(toBeMoved, startCol, startRow, endCol, endRow, Duration.ZERO, duration, 0);
// then start it
ellipseTransition.start();
});
}
// I decided to write separate class for the transition to make it more convenient
private class EllipseTransition {
// these variables are the same you used in your code
private final Path path;
private final Ellipse ellipse; // this one was "toBeMoved"
private final int startCol, startRow, endCol, endRow;
private final Duration duration;
private final PathTransition transition;
// if we change parent size in the middle of the transition, this will give the new transition information about where we were.
private Duration startTime;
// we call System.currentTimeMillis() when we start
private long startTimestamp;
// if true, transition would not start again
private boolean finished;
public EllipseTransition(Ellipse ellipse, int startCol, int startRow, int endCol, int endRow, Duration startTime, Duration duration, long realStartTimestamp) {
this.path = new Path();
this.ellipse = ellipse;
this.startCol = startCol;
this.startRow = startRow;
this.endCol = endCol;
this.endRow = endRow;
this.startTime = startTime;
this.duration = duration;
this.transition = new PathTransition();
// applyMove passes 0, because we don't know our start time yet
this.startTimestamp = realStartTimestamp;
}
// this is called right before starting the transition
private void init() {
// show path for debugging
parent.getChildren().add(path);
// binding values here is useless, you can compute everything in old-fashioned way for better readability
final MoveTo startingPoint = new MoveTo();
startingPoint.setX(tileWidthProperty.get() * startCol + tileWidthProperty.get() / 2.);
startingPoint.setY(tileHeightProperty.get() * startRow + tileHeightProperty.get() / 2.);
final LineTo endPoint = new LineTo();
endPoint.setX(tileWidthProperty.get() * endCol + tileWidthProperty.get() / 2);
endPoint.setY(tileHeightProperty.get() * endRow + tileHeightProperty.get() / 2);
path.getElements().clear(); // clear paths from the last time
path.getElements().add(startingPoint);
path.getElements().add(endPoint);
ellipse.translateXProperty().unbind();
ellipse.translateYProperty().unbind();
transition.setNode(ellipse);
transition.setDuration(duration);
transition.setPath(path);
transition.setOrientation(PathTransition.OrientationType.NONE);
transition.setCycleCount(1);
transition.setAutoReverse(false);
transition.setOnFinished(event ->
{
// bind ellipse to the new location
ellipse.translateXProperty().bind(tileWidthProperty.multiply(endCol).add(tileWidthProperty.divide(2)));
ellipse.translateYProperty().bind(tileHeightProperty.multiply(endRow).add(tileHeightProperty.divide(2)));
// cleanup
stop();
// mark as finished
finished = true;
});
}
// stops the transition
private void stop() {
// remove debug path ( added it in init() )
parent.getChildren().remove(path);
transition.stop();
}
// starts the transition
public void start() {
if(finished) {
return;
}
init(); // initialize parameters
// start from the place where previous we stopped last time
// if we did not stop anywhere, then we start from beginning (applyMove passes Duration.ZERO)
this.transition.playFrom(startTime);
// applyMove passes 0, as it doesn't know when transition will start
// but now we know
if(this.startTimestamp == 0) {
this.startTimestamp = System.currentTimeMillis();
}
}
// stops the transition
public void finish() {
stop();
finished = true;
}
// stops and refreshes the transition.
// that will continue transition but for new values
private void refresh() {
// stop the transition
stop();
// determine how much time we spend after transition has started
long currentDuration = System.currentTimeMillis() - startTimestamp;
// update startTime to the current time.
// when we call start() next time, transition will continue, but with new parameters
this.startTime = Duration.millis(currentDuration);
}
// this method is called from change listener
public EllipseTransition refreshAndStart() {
if(finished) {
// return null to the listener
// we want to cleanup completely
return null;
}
// refresh new values and start
refresh(); start();
return this;
}
}
public static void main(String[] args) {
launch(args);
}
}
enter image description hereI have 4 sprites. I am placing all 4 sprites in different place on the mobile screen. But it is taking the last added sprite image that is (sprite4.png) all the sprites images(sprite1.png, sprite2.png, sprite3.png and sprite4.png).
In short its displaying all the sprite images same.
The code is given below, please share your experience
// the below code is running without error but displaying same images in all the sprites
package com.example.test1;
import org.andengine.engine.camera.Camera;
import org.andengine.engine.options.EngineOptions;
import org.andengine.engine.options.ScreenOrientation;
import org.andengine.engine.options.resolutionpolicy.RatioResolutionPolicy;
import org.andengine.entity.scene.Scene;
import org.andengine.entity.scene.background.Background;
import org.andengine.entity.sprite.Sprite;
import org.andengine.entity.util.FPSLogger;
import org.andengine.input.touch.TouchEvent;
import org.andengine.opengl.texture.TextureOptions;
import org.andengine.opengl.texture.atlas.bitmap.BitmapTextureAtlas;
import org.andengine.opengl.texture.atlas.bitmap.BitmapTextureAtlasTextureRegionFactory;
import org.andengine.opengl.texture.region.ITextureRegion;
/*;
* (c) 2010 Nicolas Gramlich
* (c) 2011 Zynga
*
* #author Nicolas Gramlich
* #since 15:13:46 - 15.06.2010
*/
public class Puzzle extends GameActivity {
// ===========================================================
// Constants
// ===========================================================
private static final int CAMERA_WIDTH = 720;
private static final int CAMERA_HEIGHT = 480;
final Scene scene = new Scene();
// ===========================================================
// Fields
// ===========================================================
private BitmapTextureAtlas mBitmapTextureAtlas;
private ITextureRegion spriteTextureRegion1;
private ITextureRegion spriteTextureRegion2;
private ITextureRegion spriteTextureRegion3;
private ITextureRegion spriteTextureRegion4;
// ===========================================================
// Constructors
// ===========================================================
// ===========================================================
// Getter & Setter
// ===========================================================
// ===========================================================
// Methods for/from SuperClass/Interfaces
// ===========================================================
#Override
public EngineOptions onCreateEngineOptions() {
// Toast.makeText(this, "Touch & Drag the face!", Toast.LENGTH_LONG).show();
final Camera camera = new Camera(0, 0, CAMERA_WIDTH, CAMERA_HEIGHT);
return new EngineOptions(true, ScreenOrientation.LANDSCAPE_FIXED, new RatioResolutionPolicy(CAMERA_WIDTH, CAMERA_HEIGHT), camera);
}
#Override
public void onCreateResources() {
BitmapTextureAtlasTextureRegionFactory.setAssetBasePath("gfx/");
this.mBitmapTextureAtlas = new BitmapTextureAtlas(this.getTextureManager(), 96, 96, TextureOptions.BILINEAR);
this.spriteTextureRegion1 = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlas, this, "sprite1.png", 0, 0);
this.spriteTextureRegion2 = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlas, this, "sprite2.png", 0, 0);
this.spriteTextureRegion3 = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlas, this, "sprite3.png", 0, 0);
this.spriteTextureRegion4= BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlas, this, "sprite4.png", 0, 0);
// scene.attachChild(sprite1);
this.mBitmapTextureAtlas.load();
}
#Override
public Scene onCreateScene() {
this.mEngine.registerUpdateHandler(new FPSLogger());
scene.setBackground(new Background(0.09804f, 0.6274f, 0.8784f));
/* set sprite1 positions on screen */
final float sprite1_posX = (40);
final float sprite1_posY = (40);
final Sprite sprite1 = new Sprite(sprite1_posX, sprite1_posY, this.spriteTextureRegion1, this.getVertexBufferObjectManager()) {
#Override
public boolean onAreaTouched(final TouchEvent pSceneTouchEvent, final float pTouchAreaLocalX, final float pTouchAreaLocalY) {
this.setPosition(pSceneTouchEvent.getX() - this.getWidth() / 2, pSceneTouchEvent.getY() - this.getHeight() / 2);
return true;
}
};
//sprite1.setScale(3);
scene.attachChild(sprite1);
scene.registerTouchArea(sprite1);
scene.setTouchAreaBindingOnActionDownEnabled(true);
/* set sprite2 positions on screen */
final Sprite sprite2 = new Sprite(sprite1_posX, sprite1_posY + (sprite1.getHeight()*3 + 10), this.spriteTextureRegion2, this.getVertexBufferObjectManager()) {
#Override
public boolean onAreaTouched(final TouchEvent pSceneTouchEvent, final float pTouchAreaLocalX, final float pTouchAreaLocalY) {
this.setPosition(pSceneTouchEvent.getX() - this.getWidth() / 2, pSceneTouchEvent.getY() - this.getHeight() / 2);
return true;
}
};
//sprite2.setScale(3);
scene.attachChild(sprite2);
scene.registerTouchArea(sprite2);
scene.setTouchAreaBindingOnActionDownEnabled(true);
/* set sprite3 positions on screen */
final Sprite sprite3 = new Sprite(sprite1_posX, sprite1_posY + (sprite1.getHeight() + 20), this.spriteTextureRegion3, this.getVertexBufferObjectManager()) {
#Override
public boolean onAreaTouched(final TouchEvent pSceneTouchEvent, final float pTouchAreaLocalX, final float pTouchAreaLocalY) {
this.setPosition(pSceneTouchEvent.getX() - this.getWidth() / 2, pSceneTouchEvent.getY() - this.getHeight() / 2);
return true;
}
};
// sprite3.setScale(3);
scene.attachChild(sprite3);
scene.registerTouchArea(sprite3);
scene.setTouchAreaBindingOnActionDownEnabled(true);
/* set sprite3 positions on screen */
final Sprite sprite4 = new Sprite(sprite1_posX, sprite1_posY + (sprite1.getHeight() + 30), this.spriteTextureRegion4, this.getVertexBufferObjectManager()) {
#Override
public boolean onAreaTouched(final TouchEvent pSceneTouchEvent, final float pTouchAreaLocalX, final float pTouchAreaLocalY) {
this.setPosition(pSceneTouchEvent.getX() - this.getWidth() / 2, pSceneTouchEvent.getY() - this.getHeight() / 2);
return true;
}
};
// sprite4.setScale(3);
scene.attachChild(sprite4);
scene.registerTouchArea(sprite4);
scene.setTouchAreaBindingOnActionDownEnabled(true);
return scene;
}
}
Oh sorry I know what is the problem:
this.spriteTextureRegion1 = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlas, this, "sprite1.png", 0, 0);
this.spriteTextureRegion2 = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlas, this, "sprite2.png", 0, 0);
this.spriteTextureRegion3 = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlas, this, "sprite3.png", 0, 0);
this.spriteTextureRegion4= BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlas, this, "sprite4.png", 0, 0);
At the end, where you put 0, 0 - you declare where your region should be located on the Texture atlas. Imagine stickers you put on the sheet of paper. You put one, then on this you put another, and third and fourth. This way you can see only the one that is on top. So you have to put your regions in different places of the texture atlas. If all your images are 40x40 it should look like this (also your atlas might be bigger (512x512):
this.mBitmapTextureAtlas = new BitmapTextureAtlas(this.getTextureManager(), 512, 512, TextureOptions.BILINEAR);
this.spriteTextureRegion1 = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlas, this, "sprite1.png", 0, 0);
this.spriteTextureRegion2 = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlas, this, "sprite2.png", 50, 0);
this.spriteTextureRegion3 = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlas, this, "sprite3.png", 0, 50);
this.spriteTextureRegion4= BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.mBitmapTextureAtlas, this, "sprite4.png", 50, 50);
I am trying to make a HUD at AndEngine, but when I write this code below and run the emulator, only thing appears on Emulator is a black screen with crashed HUD image.
This is what I want to display,
and This is how my code show.
This is my code -
package com.example.andenginetester;
import org.andengine.engine.camera.Camera;
import org.andengine.engine.camera.hud.HUD;
import org.andengine.engine.options.EngineOptions;
import org.andengine.engine.options.ScreenOrientation;
import org.andengine.engine.options.resolutionpolicy.RatioResolutionPolicy;
import org.andengine.entity.scene.Scene;
import org.andengine.entity.scene.background.Background;
import org.andengine.entity.sprite.Sprite;
import org.andengine.opengl.texture.atlas.bitmap.BitmapTextureAtlas;
import org.andengine.opengl.texture.atlas.bitmap.BitmapTextureAtlasTextureRegionFactory;
import org.andengine.opengl.texture.region.TextureRegion;
import org.andengine.ui.activity.SimpleBaseGameActivity;
public class SpriteTester extends SimpleBaseGameActivity {
public static final int CAMERA_WIDTH = 720;
public static final int CAMERA_HEIGHT = 480;
private HUD myHUD;
private Sprite myHUDSprite;
private BitmapTextureAtlas myAtlas;
private TextureRegion myHUDImage;
final Camera camera = new Camera(0, 0, CAMERA_WIDTH, CAMERA_HEIGHT);
#Override
public EngineOptions onCreateEngineOptions() {
return new EngineOptions(true, ScreenOrientation.LANDSCAPE_FIXED, new RatioResolutionPolicy(CAMERA_WIDTH, CAMERA_HEIGHT), camera);
}
#Override
protected void onCreateResources() {
myAtlas = new BitmapTextureAtlas(this.getTextureManager(), 1024, 1024);
myHUDImage = BitmapTextureAtlasTextureRegionFactory.createFromAsset(this.myAtlas, this, "gfx/HUD.png", 0, 0);
mEngine.getTextureManager().loadTexture(myAtlas);
}
#Override
protected Scene onCreateScene() {
final Scene scene = new Scene();
scene.setBackground(new Background(0, 0, 0));
myHUDSprite = new Sprite(0, 0, myHUDImage, this.getVertexBufferObjectManager());
myHUD.attachChild(myHUDSprite);
camera.setHUD(myHUD);
return scene;
}
}
How I should fix it?
Well, I managed to get the correct result , let me know if it works for you:
a) I updated the AndroidManifest.xml
Added in the <activity ... >:
1) android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|uiMode|screenSize|smallestScreenSize|mcc|mnc"
2) android:screenOrientation="landscape"
b) The updated activity:
public class MainActivity extends SimpleBaseGameActivity {
public static final int CAMERA_WIDTH = 720;
public static final int CAMERA_HEIGHT = 480;
private HUD myHUD = new HUD();
private Sprite myHUDSprite;
private BitmapTextureAtlas myAtlas;
private TextureRegion myHUDImage;
final Camera camera = new Camera(0, 0, CAMERA_WIDTH, CAMERA_HEIGHT);
#Override
public EngineOptions onCreateEngineOptions() {
return new EngineOptions(true, ScreenOrientation.LANDSCAPE_FIXED,
new RatioResolutionPolicy(CAMERA_WIDTH, CAMERA_HEIGHT), camera);
}
#Override
protected void onCreateResources() {
myAtlas = new BitmapTextureAtlas(this.getTextureManager(), 1024, 1024);
myHUDImage = BitmapTextureAtlasTextureRegionFactory.createFromAsset(
this.myAtlas, this, "gfx/HUD.png", 0, 0);
mEngine.getTextureManager().loadTexture(myAtlas);
}
#Override
protected Scene onCreateScene() {
final Scene scene = new Scene();
scene.setBackground(new Background(0, 0, 0));
myHUDSprite = new Sprite(0, 0, myHUDImage,
this.getVertexBufferObjectManager());
myHUD.attachChild(myHUDSprite);
myHUD.setPosition(CAMERA_WIDTH/2,CAMERA_HEIGHT/2);
camera.setHUD(myHUD);
return scene;
}
}
I am new in android game development,I have two buttons on screen , one for forward and one for reverse, also one player sprite.I want to move large background on buttons click.
I have idea about auto-parallax background,but how can i move background on buttons click?
please help
I am doing some thing like this, but it is not smooth and also i think this is not a good approach
public class MainActivity extends SimpleBaseGameActivity implements IOnSceneTouchListener {
private static final int CAMERA_WIDTH = 480;
private static final int CAMERA_HEIGHT = 320;
// ===========================================================
// Fields
// ===========================================================
BitmapTextureAtlas ForwardAtlas,backgroundAtlas,backAtlas,mFontTexture;
ITextureRegion ForwardAtlasRegion,backgroundAtlasRegion,backAtlasRegion;
Sprite ForwardSprite,backgroundSprite,backSprite;
AnimatedSprite player;
private BitmapTextureAtlas mBitmapTextureAtlas;
private TiledTextureRegion mPlayerTextureRegion;
SequenceEntityModifier modifier;
AutoParallaxBackground autoParallaxBackground;
boolean flag=true;
Scene scene;
private Font mFont;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}
#Override
public EngineOptions onCreateEngineOptions() {
// TODO Auto-generated method stub
final Camera camera = new Camera(0, 0, CAMERA_WIDTH, CAMERA_HEIGHT);
EngineOptions eo = new EngineOptions(true, ScreenOrientation.LANDSCAPE_FIXED,new FillResolutionPolicy(),camera);
return eo;
}
#Override
protected void onCreateResources() {
// TODO Auto-generated method stub
BitmapTextureAtlasTextureRegionFactory.setAssetBasePath("gfx/");
this.mBitmapTextureAtlas = new BitmapTextureAtlas(256, 128, TextureOptions.BILINEAR);
this.mPlayerTextureRegion = BitmapTextureAtlasTextureRegionFactory.createTiledFromAsset(this.mBitmapTextureAtlas, this, "player.png", 0, 0, 3, 4);
this.mBitmapTextureAtlas.load(this.getTextureManager());
ForwardAtlas = new BitmapTextureAtlas(60,60);
ForwardAtlas.load(getTextureManager());
ForwardAtlasRegion = BitmapTextureAtlasTextureRegionFactory.createFromAsset(ForwardAtlas, getApplicationContext(), "forward.png",0,0);
backAtlas = new BitmapTextureAtlas(60,60);
backAtlas.load(getTextureManager());
backAtlasRegion = BitmapTextureAtlasTextureRegionFactory.createFromAsset(backAtlas, getApplicationContext(), "Back.png",0,0);
backgroundAtlas = new BitmapTextureAtlas(1000,480);
backgroundAtlas.load(getTextureManager());
backgroundAtlasRegion = BitmapTextureAtlasTextureRegionFactory.createFromAsset(backgroundAtlas, getApplicationContext(), "background-2.png",0,0);
this.mFontTexture = new BitmapTextureAtlas(256, 256, TextureOptions.BILINEAR_PREMULTIPLYALPHA);
this.mFont = new Font(this.mFontTexture, Typeface.create(Typeface.DEFAULT, Typeface.BOLD), 32, true, Color.BLACK);
this.mEngine.getTextureManager().loadTexture(this.mFontTexture);
this.getFontManager().loadFont(this.mFont);
}
#Override
protected Scene onCreateScene() {
// TODO Auto-generated method stub
this.mEngine.registerUpdateHandler(new FPSLogger());
scene = new Scene();
final int playerX = (CAMERA_WIDTH - this.mPlayerTextureRegion.getWidth()) / 2;
final int playerY = CAMERA_HEIGHT - this.mPlayerTextureRegion.getHeight() - 5;
//final Text x = new Text(100, 60, this.mFont,Integer.toString(playerX) , HorizontalAlign.CENTER);
//final Text y = new Text(120, 90, this.mFont,Integer.toString(playerY) , HorizontalAlign.CENTER);
player = new AnimatedSprite(playerX, playerY, this.mPlayerTextureRegion);
player.setScaleCenterY(this.mPlayerTextureRegion.getHeight());
player.setScale(2);
player.animate(new long[]{200, 200, 200}, 6, 8, true);
ForwardSprite = new Sprite(390,250, ForwardAtlasRegion);
backSprite = new Sprite(40,250, backAtlasRegion);
backgroundSprite = new Sprite(0,0,backgroundAtlasRegion);
autoParallaxBackground = new AutoParallaxBackground(0, 0, 0, 5);
autoParallaxBackground.attachParallaxEntity(new ParallaxEntity(-10.0f, new Sprite(0, CAMERA_HEIGHT - this.backgroundAtlasRegion.getHeight(), this.backgroundAtlasRegion)));
scene.setBackground(autoParallaxBackground);
scene.attachChild(player);
scene.attachChild(ForwardSprite);
scene.registerTouchArea(ForwardSprite);
scene.attachChild(backSprite);
scene.registerTouchArea(backSprite);
scene.setOnAreaTouchListener(new IOnAreaTouchListener() {
#Override
public boolean onAreaTouched(TouchEvent pSceneTouchEvent,
ITouchArea pTouchArea, float pTouchAreaLocalX,
float pTouchAreaLocalY)
{
if(pSceneTouchEvent.isActionUp())
{
autoParallaxBackground.attachParallaxEntity(new ParallaxEntity(0.0f, new Sprite(0, CAMERA_HEIGHT - backgroundAtlasRegion.getHeight(), backgroundAtlasRegion)));
if(pTouchArea == ForwardSprite)
if(pTouchArea == backSprite)
return true;
}
if(pSceneTouchEvent.isActionMove()) {
if(pTouchArea == ForwardSprite)
{
player.animate(new long[]{200, 200, 200}, 3, 5, true);
autoParallaxBackground.attachParallaxEntity(new ParallaxEntity(-10.0f, new Sprite(0, CAMERA_HEIGHT - backgroundAtlasRegion.getHeight(), backgroundAtlasRegion)));
//backgroundSprite.setPosition(backgroundSprite.getX()-5, backgroundSprite.getY());
}
if(pTouchArea == backSprite)
{
player.animate(new long[]{200, 200, 200}, 9, 11, true);
autoParallaxBackground.attachParallaxEntity(new ParallaxEntity(10.0f, new Sprite(0, CAMERA_HEIGHT - backgroundAtlasRegion.getHeight(), backgroundAtlasRegion)));
//backgroundSprite.setPosition(backgroundSprite.getX()+5, backgroundSprite.getY());
}
return true;
}
return false;
}
});
//scene.setOnSceneTouchListener(this);
return scene;
}
I've just answered similiar question. Please take a look at stop and start auto parallaxbackground in andengine
There isn't such function provided in andengine so you will need extend or add some features in AutoParallaxBacground class of AndEngine library.
package org.andengine.entity.scene.background;
/**
* (c) 2010 Nicolas Gramlich
* (c) 2011 Zynga Inc.
*
* #author Nicolas Gramlich
* #since 19:44:31 - 19.07.2010
*/
public class AutoParallaxBackground extends ParallaxBackground {
// ===========================================================
// Constants
// ===========================================================
// ===========================================================
// Fields
// ===========================================================
private float mParallaxChangePerSecond;
private boolean movingForward;
private boolean movingBackward;
// ===========================================================
// Constructors
// ===========================================================
public AutoParallaxBackground(final float pRed, final float pGreen, final float pBlue, final float pParallaxChangePerSecond) {
super(pRed, pGreen, pBlue);
this.mParallaxChangePerSecond = pParallaxChangePerSecond;
}
// ===========================================================
// Getter & Setter
// ===========================================================
public void setParallaxChangePerSecond(final float pParallaxChangePerSecond) {
this.mParallaxChangePerSecond = pParallaxChangePerSecond;
}
// ===========================================================
// Methods for/from SuperClass/Interfaces
// ===========================================================
#Override
public void onUpdate(final float pSecondsElapsed) {
super.onUpdate(pSecondsElapsed);
if(movingForward)
this.mParallaxValue += this.mParallaxChangePerSecond * pSecondsElapsed;
else if (moving Backward)
this.mParallaxValue -= this.mParallaxChangePerSecond * pSecondsElapsed;
}
// ===========================================================
// Methods
// ===========================================================
public void startForward(){
this.movingBackward = false;
this.movingForward = true;
}
public void startBackward(){
this.movingForward = false;
this.movingBackward = true;
}
public void stop(){
this.movingBackward = false;
this.movingForward = false;
}
// ===========================================================
// Inner and Anonymous Classes
// ===========================================================
}
I haven't tested that solution but it should work as expected. The only thing I am not sure right now is changing incrementation to decrementation enough.
I had written a code to move a ball with the help of accelerometer andengine, but i get force close.
My problem is the use of PhysicsWorld.
My library is:
andengine.jar
andenginephysicsbox2dextension.jar
my code is:
public class SnakeGameActivity extends BaseGameActivity implements IAccelerometerListener
{
private static final int CAMERA_WIDTH = 480;
private static final int CAMERA_HEIGHT = 320;
private float mGravityX;
private float mGravityY;
private Sprite splash ;
private final Vector2 mTempVector = new Vector2();
protected PhysicsWorld mPhysicsWorld;
private Camera mCamera;
private Texture mTexture;
private TextureRegion mSplashTextureRegion;
#Override
public Engine onLoadEngine() {
// TODO Auto-generated method stub
this.mCamera = new Camera(0, 0, CAMERA_WIDTH, CAMERA_HEIGHT);
return new Engine(new EngineOptions(true, ScreenOrientation.LANDSCAPE,
new RatioResolutionPolicy(CAMERA_WIDTH, CAMERA_HEIGHT), this.mCamera));
}
#Override
public void onLoadResources() {
// TODO Auto-generated method stub
this.mTexture = new Texture(512, 512, TextureOptions.BILINEAR_PREMULTIPLYALPHA);
this.enableAccelerometerSensor(this);
this.mSplashTextureRegion = TextureRegionFactory.createFromAsset(this.mTexture, this, "ball_enemy.png", 0, 0);
this.mEngine.registerUpdateHandler(new FPSLogger());
this.mEngine.getTextureManager().loadTexture(this.mTexture);
}
#Override
public Scene onLoadScene() {
this.mEngine.registerUpdateHandler(new FPSLogger());
Scene scene = new Scene(1);
this.mPhysicsWorld = new PhysicsWorld(new Vector2(0, SensorManager.GRAVITY_EARTH), false);
final int centerX = (CAMERA_WIDTH - this.mSplashTextureRegion.getWidth()) / 2;
final int centerY = (CAMERA_HEIGHT - this.mSplashTextureRegion.getHeight()) / 2;
splash = new Sprite(centerX, centerY, this.mSplashTextureRegion);
scene.getLastChild().attachChild(splash);
scene.registerUpdateHandler(this.mPhysicsWorld);
return scene;
}
#Override
public void onLoadComplete() {
// TODO Auto-generated method stub
}
public void onAccelerometerChanged(AccelerometerData pAccelerometerData) {
final Vector2 gravity = Vector2Pool.obtain(pAccelerometerData.getX(), pAccelerometerData.getY());
this.mPhysicsWorld.setGravity(gravity);
Vector2Pool.recycle(gravity);
}
}
my log error:
02-25 21:08:22.334: E/ActivityManager(69): Start proc com.android.deskclock for
broadcast com.android.deskclock/.AlarmInitReceiver: pid=255 uid=10019 gids={}
CPU usage from 16953ms to 19171ms later:
Thank you very much for your help