滑動版面
建國科技大學 資管系饒瑞佶
2013/7 V1
滑動版面
• 需要–Gesture( 手勢辨識 )–ViewFlipper (view 切換容器 )–滑動 animation( 上下左右 )
SignFlipDemo.java
透過覆寫自動產生
ViewFlipper
手勢辨識
@Overridepublic void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); detector = new GestureDetector(this);//手勢辨識 flipper = new ViewFlipper(this); flipper.setBackgroundColor(Color.WHITE); flipper.addView(addTextView("step 1", 0));// flipper.addView(addTextView("step 2", 1)); flipper.addView(addTextView("step 3", 2)); flipper.addView(addTextView("step 4", 3)); flipper.addView(addTextView("step 5", 4)); flipper.addView(addTextView("step 6", 5));
setContentView(flipper);}
SignFlipDemo.java - onCreate
將版面放入ViewFlippe
r用
ViewFlipper設定起始畫面
SignFlipDemo.java - addTextView
private View addTextView(String text, int i) { TextView tv = new TextView(this); tv.setText(text); tv.setGravity(1); LinearLayout output = new LinearLayout(this); output.setOrientation(LinearLayout.VERTICAL); Drawable dabg; switch (i) { case 0: dabg = this.getResources().getDrawable(R.drawable.bg0); output.setBackgroundDrawable(dabg); //建立一個 ImageView ImageView imgv= new ImageView(this); imgv.setBackgroundResource(R.drawable.icon); //設定圖示 //設定 ImageView的格式 RelativeLayout.LayoutParams forimgv = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT); //將 ImageView加入 LinearLayout output.addView(imgv,forimgv); break;
SignFlipDemo.java - addTextView case 1: dabg = this.getResources().getDrawable(R.drawable.bg1); output.setBackgroundDrawable(dabg); break; case 2: dabg = this.getResources().getDrawable(R.drawable.bg2); output.setBackgroundDrawable(dabg); break; case 3: dabg = this.getResources().getDrawable(R.drawable.bg3); output.setBackgroundDrawable(dabg); break; case 4: dabg = this.getResources().getDrawable(R.drawable.bg4); output.setBackgroundDrawable(dabg); break; case 5: dabg = this.getResources().getDrawable(R.drawable.bg5); output.setBackgroundDrawable(dabg); break; } output.addView(tv); return output;}
SignFlipDemo.java - onFling
animation
SignFlipDemo.java - onTouchEvent
@Overridepublic boolean onTouchEvent(MotionEvent event) { return this.detector.onTouchEvent(event);}
left_in.xml
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"> <translate android:fromXDelta="100%p" android:toXDelta="0" android:duration="500" /></set>
left_out.xml
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"> <translate android:fromXDelta="0" android:toXDelta="-100%p" android:duration="500" /></set>
向左滑動
right_in.xml
right_out.xml
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"> <translate android:fromXDelta="-100%p" android:toXDelta="0" android:duration="500" /></set>
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"> <translate android:fromXDelta="0" android:toXDelta="100%p" android:duration="500" /></set>
向右滑動
push_down_in.xml
push_down_out.xml
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"> <translate android:fromYDelta="-100%p" android:toYDelta="0" android:duration="700" /> <alpha android:fromAlpha="1.0" android:toAlpha="1.0" android:duration="700" /></set>
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"> <translate android:fromYDelta="0" android:toYDelta="100%p" android:duration="700" /> <alpha android:fromAlpha="1.0" android:toAlpha="1.0" android:duration="700" /></set>
向下滑動
push_up_in.xml
push_up_out.xml
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"> <translate android:fromYDelta="100%p" android:toYDelta="0" android:duration="700" /> <alpha android:fromAlpha="1.0" android:toAlpha="1.0" android:duration="700" /></set>
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"> <translate android:fromYDelta="0" android:toYDelta= "-100%p" android:duration="700" /> <alpha android:fromAlpha="1.0" android:toAlpha="1.0" android:duration="700" /></set>
向上滑動