Scrolling with Touch Events

  ... tutorials on how to use AndEngine.

Re: Scrolling with Touch Events

Postby Programminglinguist » Tue Jun 21, 2011 4:07 am

My activity already extends BaseGameActivity.

I'm not sure how I extend it to IOnSceneTouchListener also. Do I need a new file for that? I'm a bit confused.
Programminglinguist
 
Posts: 16
Joined: Mon Jun 20, 2011 9:24 am

Re: Scrolling with Touch Events

Postby coder_t2 » Tue Jun 21, 2011 5:26 pm

Programminglinguist wrote:My activity already extends BaseGameActivity.

I'm not sure how I extend it to IOnSceneTouchListener also. Do I need a new file for that? I'm a bit confused.


It should implement IOnSceneTouchListener. So

Extends BaseGameActivity implements IOnSceneTouchListener

Hope that helps
coder_t2
 
Posts: 27
Joined: Wed Jun 01, 2011 11:40 pm

Re: Scrolling with Touch Events

Postby drjava72 » Tue Jul 05, 2011 11:50 am

I think you can do it in just two steps (scrolling IEntity on screen)

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. public class StartGame extends BaseGameActivity implements IScrollDetectorListener, IOnSceneTouchListener[syntax=""][/syntax]
Parsed in 0.031 seconds, using GeSHi 1.0.8.4


Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. @Override
  2.         public Scene onLoadScene() {
  3.                 mScene = new Scene();
  4.                
  5.                 this.mScrollDetector = new SurfaceScrollDetector(this);        
  6.                 this.mScrollDetector.setEnabled(true);
  7.                 this.mScene.setOnSceneTouchListener(this);
  8.                 this.mScene.setOnSceneTouchListenerBindingEnabled(true);
  9.                
Parsed in 0.031 seconds, using GeSHi 1.0.8.4


Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. @Override
  2.         public void onScroll(ScrollDetector pScollDetector, TouchEvent pTouchEvent, float pDistanceX, float pDistanceY) {
  3.                 this.mCamera.offsetCenter(-pDistanceX, -pDistanceY);           
  4.         }
  5.  
  6.         @Override
  7.         public boolean onSceneTouchEvent(Scene pScene, TouchEvent pSceneTouchEvent) {
  8.                 this.mScrollDetector.onTouchEvent(pSceneTouchEvent);
  9.                 return true;           
  10.         }
Parsed in 0.035 seconds, using GeSHi 1.0.8.4

And you are done :)
Best Regards,
drJava72
drjava72
 
Posts: 287
Joined: Fri Apr 29, 2011 8:03 am

Re: Scrolling with Touch Events

Postby Alexander13 » Fri Jul 15, 2011 8:47 pm

Hi, everybody.

I'm absolutely new to andEngine, but I have experience in Android development. So, please help me to solve this little problem.

I have a big picture - 1024x768, so I have to scroll it. Also I must put some clickable areas on this picture and place animated objects.

I've already done scrolling picture, but problem is that if I start scrolling from a clickable area I got a "click" result, but not scrolling. I don't know how to differ click from scroll.

Here is my class:
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. public class AndEngineLayoutActivity extends LayoutGameActivity implements IOnSceneTouchListener {
  2.        
  3.     private static final int CAMERA_WIDTH = 1000;
  4.     private static final int CAMERA_HEIGHT = 1000;
  5.    
  6.     private Camera mCamera;
  7.     private Texture mTexture;
  8.     private TextureRegion mHouseMapTextureRegion;
  9.     private TextureRegion mWardrobeRoomRegion;
  10.    
  11.     private static boolean isMove = false;
  12.  
Parsed in 0.037 seconds, using GeSHi 1.0.8.4


My onLoadScene:
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. public Scene onLoadScene() {
  2.                 this.mEngine.registerUpdateHandler(new FPSLogger());
  3.                
  4.                 final Scene scene = new Scene();
  5.  
  6.         final Sprite face = new Sprite(0, 0, this.mHouseMapTextureRegion);
  7.         final Sprite roomWardrobe = new Sprite(100,100,this.mRoomRegion){
  8.                 @Override
  9.                 public boolean onAreaTouched(final TouchEvent pSceneTouchEvent, final float pTouchAreaLocalX, final float pTouchAreaLocalY){
  10.                         if (AndEngineLayoutActivity.isMove){
  11.                                 return true;
  12.                         }
  13.                         Intent intent = new Intent(AndEngineLayoutActivity.this,Activity_Room.class);
  14.                                 startActivity(intent);
  15.                                 finish();
  16.                                 overridePendingTransition(0, 0);
  17.                         return true;
  18.                 }
  19.         };
  20.        
  21.         scene.attachChild(face);
  22.         scene.attachChild(roomWardrobe);
  23.         scene.registerTouchArea(roomWardrobe);
  24.        
  25.         scene.setOnSceneTouchListenerBindingEnabled(true);
  26.         //scene.setTouchAreaBindingEnabled(true);
  27.        
  28.         scene.setOnSceneTouchListener(this);
  29.         return scene;
  30.         }
  31.  
Parsed in 0.040 seconds, using GeSHi 1.0.8.4


And my onSceneTouchEvent. I use flag isMove to prevent event onAreaTouched if I during scrolling touch this area. This func is so long cause I don't want to scroll my image out of borders.
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. public boolean onSceneTouchEvent(Scene pScene, TouchEvent pTouchEvent) {
  2.  
  3.         if(pTouchEvent.getAction() == MotionEvent.ACTION_DOWN)
  4.         {
  5.                 mTouchX = pTouchEvent.getMotionEvent().getX();
  6.                 mTouchY = pTouchEvent.getMotionEvent().getY();
  7.         }
  8.         else if(pTouchEvent.getAction() == MotionEvent.ACTION_MOVE)
  9.         {
  10.                 AndEngineLayoutActivity.isMove = true;
  11.                 float currentX = pTouchEvent.getMotionEvent().getX();
  12.                 float currentY = pTouchEvent.getMotionEvent().getY();
  13.                
  14.                 mTouchOffsetX = (mTouchX - currentX);
  15.                 mTouchOffsetY = (mTouchY - currentY);
  16.                
  17.                 int maxX = (int)((bitmap.getWidth() / 2) - (mCamera.getWidth()/2));
  18.                 int maxY = (int)((bitmap.getHeight() /2 ) - (mCamera.getHeight() /2));
  19.                 final float maxLeft = 0;
  20.                 final float maxRight = maxX;
  21.                 final float maxTop = maxY;
  22.                 final float maxBottom = 0;
  23.                
  24.              // scrolling to left side of image (pic moving to the right)
  25.                                 if (currentX > mTouchX)
  26.                 {
  27.                     if (totalX == maxLeft)
  28.                         mTouchOffsetX = 0;
  29.                     if (totalX > maxLeft)
  30.                         totalX = totalX + mTouchOffsetX;
  31.                     if (totalX < maxLeft){
  32.                         mTouchOffsetX = maxLeft - (totalX - mTouchOffsetX);
  33.                         totalX = maxLeft;
  34.                     }
  35.                 }
  36.                 // scrolling to right side of image (pic moving to the left)
  37.                 if (currentX < mTouchX)
  38.                 {
  39.                     if (totalX == maxRight)
  40.                         mTouchOffsetX = 0;
  41.                     if (totalX < maxRight)
  42.                         totalX = totalX + mTouchOffsetX;
  43.                     if (totalX > maxRight){
  44.                         mTouchOffsetX = maxRight - (totalX - mTouchOffsetX);
  45.                         totalX = maxRight;
  46.                     }
  47.                 }
  48.                 // scrolling to top of image (pic moving to the bottom)
  49.                 if (currentY > mTouchY)
  50.                 {
  51.                     if (totalY == maxTop)
  52.                         mTouchOffsetY = 0;
  53.                     if (totalY > maxTop)
  54.                         totalY = totalY + mTouchOffsetY;
  55.                     if (totalY < maxTop){
  56.                         mTouchOffsetY = maxTop - (totalY - mTouchOffsetY);
  57.                         totalY = maxTop;
  58.                     }
  59.                 }
  60.                 // scrolling to bottom of image (pic moving to the top)
  61.                 if (currentY < mTouchY)
  62.                 {
  63.                     if (totalY == maxBottom)
  64.                         mTouchOffsetY = 0;
  65.                     if (totalY < maxBottom)
  66.                         totalY = totalY + mTouchOffsetY;
  67.                     if (totalY > maxBottom){
  68.                         mTouchOffsetY = maxBottom - (totalY - mTouchOffsetY);
  69.                         totalY = maxBottom;
  70.                     }
  71.                 }
  72.  
  73.                 float newScrollX = this.mCamera.getCenterX() - mTouchOffsetX;
  74.                 float newScrollY = this.mCamera.getCenterY() - mTouchOffsetY;
  75.                
  76.                 this.mCamera.setCenter(newScrollX, newScrollY);
  77.                
  78.                 mTouchX = currentX;
  79.                 mTouchY = currentY;
  80.         }
  81.                 if(pTouchEvent.getAction() == MotionEvent.ACTION_UP){
  82.                 AndEngineLayoutActivity.isMove = false;
  83.         }
  84.         return true;
  85. }
  86.  
Parsed in 0.049 seconds, using GeSHi 1.0.8.4


If anybody knows how to help me solve my problem or to optimize this code, please help me. I read about ScrollDetector and TouchDetector, but I don't understand how to use it.
Alexander13
 
Posts: 4
Joined: Thu Jul 14, 2011 3:10 pm

Re: Scrolling with Touch Events

Postby vito » Thu Oct 06, 2011 12:58 pm

Help me please!
I have a scene and I have a sprite on it. When I scrolling scene my sprite move with it to, but sprite must stay on the screen. How can I do it?
Sorry for my English, I am from Ukraine :)
vito
 
Posts: 1
Joined: Thu Oct 06, 2011 12:50 pm

Re: Scrolling with Touch Events

Postby Pleerock » Wed Oct 19, 2011 12:16 pm

vito wrote:Help me please!
I have a scene and I have a sprite on it. When I scrolling scene my sprite move with it to, but sprite must stay on the screen. How can I do it?
Sorry for my English, I am from Ukraine :)


Yeah, its a very actual problem. Can anyone help?
Pleerock
 
Posts: 15
Joined: Sat Sep 24, 2011 8:06 am

Re: Scrolling with Touch Events

Postby zeljkoa » Wed Oct 19, 2011 3:36 pm

Use HUD.
Image
Get Run 'em over on Google Play!
zeljkoa
 
Posts: 74
Joined: Wed Jul 06, 2011 2:11 pm
Location: Slovenia

Re: Scrolling with Touch Events

Postby bos » Sun Mar 04, 2012 3:14 am

vito wrote:I have a scene and I have a sprite on it. When I scrolling scene my sprite move with it to, but sprite must stay on the screen. How can I do it?

Untested: detach the parent-child-relationship when scrolling, and re-attach after scrolling. As long as there's a relationship, the sprite goes with the parent (scene).
bos
 
Posts: 44
Joined: Fri Jan 13, 2012 4:15 am

Re: Scrolling with Touch Events

Postby chetan.sonparote » Mon Mar 11, 2013 2:39 pm

great Example!!

used it to make top down scroll list.

Please tell me how to set the limits of scrolling in y axis.
thanks
chetan.sonparote
 
Posts: 3
Joined: Fri Jan 25, 2013 9:39 am

Re: Scrolling with Touch Events

Postby vitors » Wed Apr 03, 2013 8:21 pm

chetan.sonparote wrote:great Example!!

used it to make top down scroll list.

Please tell me how to set the limits of scrolling in y axis.
thanks


In PinchZoomExample i deleted the Zoom parts of the code and changed this:

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.         @Override
  2.         public void onScrollStarted(final ScrollDetector pScollDetector, final int pPointerID, final float pDistanceX, final float pDistanceY) {
  3.                 final float zoomFactor = this.mZoomCamera.getZoomFactor();
  4.                 this.mZoomCamera.offsetCenter(-pDistanceX / zoomFactor, 0);
  5.         }
  6.  
  7.         @Override
  8.         public void onScroll(final ScrollDetector pScollDetector, final int pPointerID, final float pDistanceX, final float pDistanceY) {
  9.                 final float zoomFactor = this.mZoomCamera.getZoomFactor();
  10.                 this.mZoomCamera.offsetCenter(-pDistanceX / zoomFactor, 0);
  11.         }
  12.        
  13.         @Override
  14.         public void onScrollFinished(final ScrollDetector pScollDetector, final int pPointerID, final float pDistanceX, final float pDistanceY) {
  15.                 final float zoomFactor = this.mZoomCamera.getZoomFactor();
  16.                 this.mZoomCamera.offsetCenter(-pDistanceX / zoomFactor, 0);
  17.         }
  18.  
Parsed in 0.039 seconds, using GeSHi 1.0.8.4


And now the scroll only occur on x axis.
vitors
 
Posts: 95
Joined: Mon Mar 18, 2013 2:36 pm

Previous

Return to Tutorials

Who is online

Users browsing this forum: M26 and 27 guests