Android View 拖動

Android View 拖動&插入 研究


  View 拖動&插入

  即: 支持 拖動圖標 然後把之插入 2個View 之間

  爲了降低難度 選用了若干ImageView 放入ViewGroup : vertical LinearLayout

  [代碼 步驟]

  1. 定義佈局:main.xml :

  Xml代碼

  < ?xml version="1.0" encoding="utf-8"?>

  < LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

  android:orientation="vertical"

  android:layout_width="fill_parent"

  android:layout_height="fill_parent"

  android:id="@+id/linear"

  >

  < ImageButton

  android:layout_width="100dip"

  android:layout_height="100dip"

  android:src="@drawable/beijing1_b"/>

  < ImageButton

  android:layout_width="100dip"

  android:layout_height="100dip"

  android:src="@drawable/beijing2_b"/>

  < ImageButton

  android:layout_width="100dip"

  android:layout_height="100dip"

  android:src="@drawable/beijing3_b"/>

  < ImageButton

  android:layout_width="100dip"

  android:layout_height="100dip"

  android:src="@drawable/beijing3_b"/>

  < /LinearLayout>

  < ?xml version="1.0" encoding="utf-8"?>

  < LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

  android:orientation="vertical"

  android:layout_width="fill_parent"

  android:layout_height="fill_parent"

  android:id="@+id/linear"

  >

  < ImageButton

  android:layout_width="100dip"

  android:layout_height="100dip"

  android:src="@drawable/beijing1_b"/>

  < ImageButton

  android:layout_width="100dip"

  android:layout_height="100dip"

  android:src="@drawable/beijing2_b"/>

  < ImageButton

  android:layout_width="100dip"

接上頁

  android:layout_height="100dip"

  android:src="@drawable/beijing3_b"/>

  < ImageButton

  android:layout_width="100dip"

  android:layout_height="100dip"

  android:src="@drawable/beijing3_b"/>

  < /LinearLayout>

  2. 變量初始化

  Java代碼

  lLayout = (LinearLayout)findViewById(R.id.linear);

  lLayout = (LinearLayout)findViewById(R.id.linear);

  3. 定義OnTouchListener 用於監聽所有動作 並註冊LinearLayour的所有View 實現爲:

  Java代碼

  touchListener = new OnTouchListener(){

  @Override

  public boolean onTouch(View v, MotionEvent event) {

  // TODO Auto-generated method stub

  int action = event.getAction();

  int x = (int) event.getRawX();

  int y = (int) event.getRawY();

  switch(action){

  //鼠標按下 拖拉動作開始

  case MotionEvent.ACTION_DOWN:

  point1 = v.getTop();

  startX = (int)event.getX();

  startY = y - v.getTop();

  break;

  //鼠標移動 拖拉動作進行中

  case MotionEvent.ACTION_MOVE:

  v.layout(x - startX, y - startY, x + v.getWidth()

  - startX, y - startY + v.getHeight());

  v.bringToFront();

  v.postInvalidate();

  break;

  //鼠標釋放 拖拉動作結束

  case MotionEvent.ACTION_UP:

  point2 = v.getTop();

  //計算插入位置 位於哪兩個相鄰View之間

  int dest = getLocation(v);

  //remove ori view, and then add view here

  lLayout.removeView(v);

  lLayout.addView(v, dest);

  break;

  }

  return false;

  }

  };

  //to listener all ImageView

  for(int i=0;i< p> 

  ImageView iv = (ImageView)lLayout.getChildAt(i);

接上頁

  if(iv !=null){

  iv.setOnTouchListener(touchListener);

  }

  else {

  //error, view is null!

  }

  }

  touchListener = new OnTouchListener(){

  @Override

  public boolean onTouch(View v, MotionEvent event) {

  // TODO Auto-generated method stub

  int action = event.getAction();

  int x = (int) event.getRawX();

  int y = (int) event.getRawY();

  switch(action){

  //鼠標按下 拖拉動作開始

  case MotionEvent.ACTION_DOWN:

  point1 = v.getTop();

  startX = (int)event.getX();

  startY = y - v.getTop();

  break;

  //鼠標移動 拖拉動作進行中

  case MotionEvent.ACTION_MOVE:

  v.layout(x - startX, y - startY, x + v.getWidth()

  - startX, y - startY + v.getHeight());

  v.bringToFront();

  v.postInvalidate();

  break;

  //鼠標釋放 拖拉動作結束

  case MotionEvent.ACTION_UP:

  point2 = v.getTop();

  //計算插入位置 位於哪兩個相鄰View之間

  int dest = getLocation(v);

  //remove ori view, and then add view here

  lLayout.removeView(v);

  lLayout.addView(v, dest);

  break;

  }

  return false;

  }

  };

  //to listener all ImageView

  for(int i=0;i< p> 

  ImageView iv = (ImageView)lLayout.getChildAt(i);

  if(iv !=null){

  iv.setOnTouchListener(touchListener);

  }

  else {

  //error, view is null!

  }

  }

  4. getLocation(View) 用於: 根據目標View 判斷待插入的位置 即:哪2個相鄰ImageView 之間 實現爲:

  Java代碼

  public int getLocation(View v){

  for(int i=0;i< p> 

 接上頁

  ImageView iv = (ImageView)lLayout.getChildAt(i);

  ImageView iv2 = (ImageView)lLayout.getChildAt(i+1);

  if(iv.getTop()< v.getTop() && iv2.getTop() > v.getTop()){

  //refer delta of point1 & point2

  if(point1 < point2){//drag to bottom

  return i+1;

  }

  else {//drag to up

  return i+1;

  }

  }

  }

  //otherwise return last location

  return lLayout.getChildCount()-1;

  }

  public int getLocation(View v){

  for(int i=0;i< p> 

  ImageView iv = (ImageView)lLayout.getChildAt(i);

  ImageView iv2 = (ImageView)lLayout.getChildAt(i+1);

  if(iv.getTop()< v.getTop() && iv2.getTop() > v.getTop()){

  //refer delta of point1 & point2

  if(point1 < point2){//drag to bottom

  return i+1;

  }

  else {//drag to up

  return i+1;

  }

  }

  }

  //otherwise return last location

  return lLayout.getChildCount()-1;

  }

  5. emulator
 運行截圖:

  - 拖拉前:

  - 拖拉後:

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章