選択 モバイル版に入る | PC版を継続
Android開発に助かるApkSchool版主募集中DISCUZ!X3.1 Japanese Version提供
表示: 1587|返信: 0

Android UI編 ViewFlipper ビューのスライドショー②

[リンクをコピー]
发表于 2013-7-22 15:56:16 | 显示全部楼层 |阅读模式
webhostingpad
この記事は最後 niuxs より 2013-7-22 16:10 編集された

画面を指でスライドさせると次のビューが表示されます。

activity_main.xml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="fill_parent"
  4.     android:layout_height="fill_parent"
  5.     android:orientation="vertical" >

  6.     <ViewFlipper
  7.         android:id="@+id/flipper"
  8.         android:layout_width="fill_parent"
  9.         android:layout_height="fill_parent" >

  10.         <LinearLayout
  11.             android:id="@+id/layout_first"
  12.             android:layout_width="fill_parent"
  13.             android:layout_height="fill_parent" >

  14.             <ImageView
  15.                 android:id="@+id/imageview_first"
  16.                 android:layout_width="fill_parent"
  17.                 android:layout_height="fill_parent"
  18.                 android:src="@drawable/ic_launcher1" >
  19.             </ImageView>
  20.         </LinearLayout>

  21.         <LinearLayout
  22.             android:id="@+id/layout_second"
  23.             android:layout_width="fill_parent"
  24.             android:layout_height="fill_parent" >

  25.             <ImageView
  26.                 android:id="@+id/imageview_second"
  27.                 android:layout_width="fill_parent"
  28.                 android:layout_height="fill_parent"
  29.                 android:src="@drawable/ic_launcher2" >
  30.             </ImageView>
  31.         </LinearLayout>
  32.     </ViewFlipper>

  33. </LinearLayout>
コードコピー
MainActivity.java
  1. package net.apkschool.viewfliper2;

  2. import android.app.Activity;
  3. import android.os.Bundle;
  4. import android.view.MotionEvent;
  5. import android.view.View;
  6. import android.view.animation.AnimationUtils;
  7. import android.widget.ImageView;
  8. import android.widget.ViewFlipper;

  9. public class MainActivity extends Activity implements View.OnTouchListener {
  10.      
  11.     private ViewFlipper viewFlipper;
  12.     private float firstTouch;
  13.     private boolean isFlip = false;
  14.     private ImageView firstImageView;
  15.     private ImageView secondImageView;
  16.      
  17.     @Override
  18.     public void onCreate(Bundle savedInstanceState) {
  19.         super.onCreate(savedInstanceState);
  20.         setContentView(R.layout.activity_main);
  21.         viewFlipper = (ViewFlipper) findViewById(R.id.flipper);
  22.         firstImageView = (ImageView)findViewById(R.id.imageview_first);
  23.         secondImageView = (ImageView)findViewById(R.id.imageview_second);
  24.         findViewById(R.id.layout_first).setOnTouchListener(this);
  25.         findViewById(R.id.layout_second).setOnTouchListener(this);
  26.     }

  27.     @Override
  28.     public boolean onTouch(View v, MotionEvent event) {
  29.         int x = (int)event.getRawX();
  30.         switch(v.getId()) {
  31.         case R.id.layout_first:
  32.         case R.id.layout_second:
  33.             switch(event.getAction()) {
  34.             case MotionEvent.ACTION_DOWN:
  35.                 firstTouch = event.getRawX();
  36.                 return true;
  37.             case MotionEvent.ACTION_MOVE:
  38.                 if(!isFlip) {
  39.                     if(x - firstTouch > 50) {
  40.                         isFlip = true;
  41.                         viewFlipper.setInAnimation(AnimationUtils.loadAnimation(this, R.anim.move_in_left));
  42.                         viewFlipper.setOutAnimation(AnimationUtils.loadAnimation(this, R.anim.move_out_right));
  43.                         viewFlipper.showNext();
  44.                     }
  45.                     else if(firstTouch - x > 50) {
  46.                         isFlip = true;
  47.                         viewFlipper.setInAnimation(AnimationUtils.loadAnimation(this, R.anim.move_in_right));
  48.                         viewFlipper.setOutAnimation(AnimationUtils.loadAnimation(this, R.anim.move_out_left));
  49.                         viewFlipper.showPrevious();
  50.                     }
  51.                 }
  52.                 break;
  53.             case MotionEvent.ACTION_UP:
  54.                 isFlip = false;
  55.                 break;
  56.             }
  57.         }
  58.          
  59.         return false;
  60.     }
  61. }
コードコピー
MainActivity.javaの44、45、50、51行目にある
アニメーションの設定によって、画面がスライドしているようになります。
下記の4ファイルを res/anim フォルダに入れますと、スライドショーが完成します。

move_in_left.xml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <translate
  3.     xmlns:android="http://schemas.android.com/apk/res/android"
  4.     android:duration="350"
  5.     android:fromXDelta="-100%p"
  6.     android:toXDelta="0"
  7.     android:fromYDelta="0"
  8.     android:toYDelta="0">
  9. </translate>
コードコピー
move_in_right.xml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <translate
  3.     xmlns:android="http://schemas.android.com/apk/res/android"
  4.     android:duration="350"
  5.     android:fromXDelta="100%p"
  6.     android:toXDelta="0"
  7.     android:fromYDelta="0"
  8.     android:toYDelta="0">
  9. </translate>
コードコピー
move_out_left.xml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <translate
  3.     xmlns:android="http://schemas.android.com/apk/res/android"
  4.     android:duration="350"
  5.     android:fromXDelta="0"
  6.     android:toXDelta="-100"
  7.     android:fromYDelta="0"
  8.     android:toYDelta="0">
  9. </translate>
コードコピー
move_out_right.xml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <translate
  3.     xmlns:android="http://schemas.android.com/apk/res/android"
  4.     android:duration="350"
  5.     android:fromXDelta="0"
  6.     android:toXDelta="100"
  7.     android:fromYDelta="0"
  8.     android:toYDelta="0">
  9. </translate>
コードコピー
返信

道具使用 レポート

返信は先にログインが必要 ログイン | 直ぐ登録

フォーラム点数規則

フリーランス

モバイル版|APK School Net  

GMT+8, 2017-12-12 06:48 , Processed in 0.114098 second(s), 24 queries .

Powered by Discuz! X3.1

© 2001-2013 Comsenz Inc.

快速返信 トップへ リストへ