Swipe using Gesture

Web Hosting
In this tutorial, I will show you how to swipe left to right vice versa on your layout. For this tutorial I used Gesture Listener, here's the code. Just named it SimpleGestureFilter.java.

SimpleGestureFilter.java

package com.send_money.albert;

import android.app.Activity;
import android.view.GestureDetector;
import android.view.GestureDetector.SimpleOnGestureListener;
import android.view.MotionEvent;


public class SimpleGestureFilter extends SimpleOnGestureListener{
    
 public final static int SWIPE_UP    = 1;
 public final static int SWIPE_DOWN  = 2;
 public final static int SWIPE_LEFT  = 3;
 public final static int SWIPE_RIGHT = 4;

 public final static int MODE_TRANSPARENT = 0;
 public final static int MODE_SOLID       = 1;
 public final static int MODE_DYNAMIC     = 2;

 private final static int ACTION_FAKE = -13; //just an unlikely number
 private int swipe_Min_Distance = 100;
 private int swipe_Max_Distance = 350;
 private int swipe_Min_Velocity = 100;

 private int mode      = MODE_DYNAMIC;
 private boolean running = true;
 private boolean tapIndicator = false;

 private Activity context;
 private GestureDetector detector;
 private SimpleGestureListener listener;


 public SimpleGestureFilter(Activity context,SimpleGestureListener sgl) {

  this.context = context;
  this.detector = new GestureDetector(context, this);
  this.listener = sgl; 
 }

 public void onTouchEvent(MotionEvent event){
  
   if(!this.running)
  return;  
  
   boolean result = this.detector.onTouchEvent(event); 
  
   if(this.mode == MODE_SOLID)
    event.setAction(MotionEvent.ACTION_CANCEL);
   else if (this.mode == MODE_DYNAMIC) {
  
     if(event.getAction() == ACTION_FAKE) 
       event.setAction(MotionEvent.ACTION_UP);
     else if (result)
       event.setAction(MotionEvent.ACTION_CANCEL); 
     else if(this.tapIndicator){
      event.setAction(MotionEvent.ACTION_DOWN);
      this.tapIndicator = false;
     }
  
   }
   //else just do nothing, it's Transparent
 }

 public void setMode(int m){
  this.mode = m;
 }

 public int getMode(){
  return this.mode;
 }

 public void setEnabled(boolean status){
  this.running = status;
 }

 public void setSwipeMaxDistance(int distance){
  this.swipe_Max_Distance = distance;
 }

 public void setSwipeMinDistance(int distance){
  this.swipe_Min_Distance = distance;
 }

 public void setSwipeMinVelocity(int distance){
  this.swipe_Min_Velocity = distance;
 }

 public int getSwipeMaxDistance(){
  return this.swipe_Max_Distance;
 }

 public int getSwipeMinDistance(){
  return this.swipe_Min_Distance;
 }

 public int getSwipeMinVelocity(){
  return this.swipe_Min_Velocity;
 }


 @Override
 public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
   float velocityY) {

  final float xDistance = Math.abs(e1.getX() - e2.getX());
  final float yDistance = Math.abs(e1.getY() - e2.getY());

  if(xDistance > this.swipe_Max_Distance || yDistance > this.swipe_Max_Distance)
   return false;

  velocityX = Math.abs(velocityX);
  velocityY = Math.abs(velocityY);
        boolean result = false;

  if(velocityX > this.swipe_Min_Velocity && xDistance > this.swipe_Min_Distance){
   if(e1.getX() > e2.getX()) // right to left
    this.listener.onSwipe(SWIPE_LEFT);
   else
    this.listener.onSwipe(SWIPE_RIGHT);
   
   result = true;
  }
  else if(velocityY > this.swipe_Min_Velocity && yDistance > this.swipe_Min_Distance){
   if(e1.getY() > e2.getY()) // bottom to up 
    this.listener.onSwipe(SWIPE_UP);
   else
    this.listener.onSwipe(SWIPE_DOWN);
   
   result = true;
  }

   return result;
 }

 @Override
 public boolean onSingleTapUp(MotionEvent e) {
  this.tapIndicator = true;
  return false;
 }

 @Override
 public boolean onDoubleTap(MotionEvent arg0) {
  this.listener.onDoubleTap();;
  return true;
 }

 @Override
 public boolean onDoubleTapEvent(MotionEvent arg0) {
  return true;
 }

 @Override
 public boolean onSingleTapConfirmed(MotionEvent arg0) {
  
  if(this.mode == MODE_DYNAMIC){        // we owe an ACTION_UP, so we fake an       
     arg0.setAction(ACTION_FAKE);      //action which will be converted to an ACTION_UP later.                                    
     this.context.dispatchTouchEvent(arg0);  
  }   
     
  return false;
 }


    static interface SimpleGestureListener{
     void onSwipe(int direction);
     void onDoubleTap();
 }


}


For me, I apply it on my tabmenu. H
ere's the complete code below. I just named it TabMenuActivity.java

TabMenuActivity.java

package com.send_money.albert;

import android.app.TabActivity;
import android.content.Context;
import android.content.Intent;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.Window;
import android.view.animation.AccelerateInterpolator;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.view.animation.TranslateAnimation;
import android.widget.RelativeLayout;
import android.widget.TabHost;
import android.widget.TabHost.OnTabChangeListener;
import android.widget.TabHost.TabSpec;
import android.widget.TextView;
import android.widget.Toast;

import com.send_money.albert.SimpleGestureFilter.SimpleGestureListener;


@SuppressWarnings("deprecation")
public class TabMenuActivity extends TabActivity implements OnTabChangeListener, SimpleGestureListener {


   private static TabHost tabHost;
   private View currentView;
   private int currentTab;
   
   
private void setupTabHost() {
tabHost = (TabHost) findViewById(android.R.id.tabhost);
tabHost.setup();
}

private SimpleGestureFilter detector;

/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// construct the tabhost
this.requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.main);

detector = new SimpleGestureFilter(this,this);

setupTabHost();
tabHost.getTabWidget().setDividerDrawable(R.drawable.tab_divider);

setupTab1(new TextView(this), "Transaction");
setupTab2(new TextView(this), "Charges");



tabHost.setOnTabChangedListener(this);
}

private void setupTab1(final View view, final String tag) {
View tabview1 = createTabView(tabHost.getContext(), tag);
Intent trans = new Intent(this, Send_Money.class);
TabSpec tab1= tabHost.newTabSpec(tag);
tab1.setIndicator(tabview1).setContent(trans);


tabHost.addTab(tab1);


}

private void setupTab2(final View view, final String tag) {
View tabview2 = createTabView(tabHost.getContext(), tag);
Intent rates = new Intent(this, Send_Money_Rates.class);
TabSpec tab2= tabHost.newTabSpec(tag);
tab2.setIndicator(tabview2).setContent(rates);


tabHost.addTab(tab2);

}

private static View createTabView(final Context context, final String text) {
View view = LayoutInflater.from(context).inflate(R.layout.tabs_bg, null);
TextView tv = (TextView) view.findViewById(R.id.tabsText);
tv.setText(text);
return view;
}



@Override
public boolean dispatchTouchEvent(MotionEvent ev) {
   // TODO Auto-generated method stub
      this.detector.onTouchEvent(ev);
      return super.dispatchTouchEvent(ev);
}


@Override
public void onSwipe(int direction) {
   // TODO Auto-generated method stub

     switch (direction) {

     case SimpleGestureFilter.SWIPE_RIGHT : 
     Send_Money_Menu.tabHost.setCurrentTab(0);   
     break;
     case SimpleGestureFilter.SWIPE_LEFT :  
     Send_Money_Menu.tabHost.setCurrentTab(1);
         break;
     } 

}



@Override
public void onDoubleTap() {
// TODO Auto-generated method stub

}
@Override
   public void onTabChanged(String tabId)
   {
       currentView = tabHost.getCurrentView();
       if (tabHost.getCurrentTab() > currentTab)
       {
        Toast.makeText(getApplicationContext(), Integer.toString(tabHost.getCurrentTab())+ " " + Integer.toString(currentTab), Toast.LENGTH_SHORT).show();

        RelativeLayout rl = (RelativeLayout) currentView.findViewById(R.id.rl_fade1);
        RelativeLayout r2 = (RelativeLayout) currentView.findViewById(R.id.main_info);
    Animation hyperspaceJump = AnimationUtils.loadAnimation(this, R.anim.flip_in);
    rl.startAnimation(hyperspaceJump);
    r2.startAnimation(hyperspaceJump);
   
   
       }
       else
       {

        Toast.makeText(getApplicationContext(), Integer.toString(tabHost.getCurrentTab())+ " " + Integer.toString(currentTab), Toast.LENGTH_SHORT).show();
        RelativeLayout rl = (RelativeLayout) currentView.findViewById(R.id.rl_child);
    Animation hyperspaceJump = AnimationUtils.loadAnimation(this, R.anim.flip_in);
    rl.startAnimation(hyperspaceJump);
   
       }
       
       currentTab = tabHost.getCurrentTab();
       
      
   
   

   }




   
}



And lastly the layout. Just named it main.xml.

main.xml

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/main1" />
        
<View android:layout_width="fill_parent" android:layout_height="2dip"
android:background="#696969" />
<View android:layout_width="fill_parent" android:layout_height="2dip"
android:background="#000" />

       <TabWidget android:id="@android:id/tabs"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:layout_marginLeft="0dip" android:layout_marginRight="0dip" />

    </LinearLayout>

</TabHost>

Web Hosting
That's all, hope this tutorial may help you.

No comments:

Post a Comment