当前位置: 首页 > 编程笔记 >

Android中ViewFlipper的使用及设置动画效果实例详解

鲍钊
2023-03-14
本文向大家介绍Android中ViewFlipper的使用及设置动画效果实例详解,包括了Android中ViewFlipper的使用及设置动画效果实例详解的使用技巧和注意事项,需要的朋友参考一下

本文实例讲述了Android中ViewFlipper的使用及设置动画效果。分享给大家供大家参考,具体如下:

说到左右滑动,其实实现左右滑动的方式很多,有ViewPaer,自定义实现Viewgroup,gallery等都可以达到这种效果。这里做下ViewFliper实现左右滑动的效果。
会用到以下的技术:

1、ViewFlipper
2、GestureDetector
3、Animation

主要是这三个类在起作用。

ViewFlipper,不妨把它看做一个容器吧,你可以把许多的View放在这个容器中,让它展示给用户,虽然它每次只展示一个view,我感觉它的用途更好是作为广告展示,比如类似购物网站那样的广告滚动展示。比如可以设置自动播放功能,就可以滚动广告了!

原理:向左向右滑动主要是依赖手势来控制,手势向右滑动就调用 viewFlipper.showNext()方法,同理,向左滑动就会去调用viewFlipper.showPrevious()方法。

效果图如下:

接下来直接上代码:

首先在布局文件中添加ViewFlipper的标签:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
  android:layout_width="fill_parent" 
  android:layout_height="wrap_content" 
  android:background="@drawable/pattern1" > 
  <Button 
    android:id="@+id/treasure_chest_btn" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_alignParentRight="true" 
    android:background="@drawable/treasure" /> 
  <ViewFlipper 
    android:id="@+id/viewflipper" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:layout_below="@id/treasure_chest_btn" > 
  </ViewFlipper> 
  <Button 
    android:id="@+id/garbage_btn" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_alignParentLeft="true" 
    android:layout_below="@id/viewflipper" 
    android:background="@drawable/garbage" /> 
</RelativeLayout>

其次是在anim中定义动画:

slide_left_in.xml:

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android" > 
  <!-- 
   画面转换位置移动动画效果  
   开始向左动画 
   fromXDelta : 动画开始时 X坐标位置 
   toXDelta :动画结束时 X坐标位置 
   duration :动画持续时间 
  --> 
  <translate 
    android:duration="800" 
    android:fromXDelta="100%p" 
    android:toXDelta="0" /> 
</set>

slide_left_out.xml:

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android" > 
  <translate 
    android:duration="800" 
    android:fromXDelta="0" 
    android:toXDelta="-100%p" /> 
</set>

slide_right_in.xml:

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android" > 
  <translate 
    android:duration="800" 
    android:fromXDelta="-100%p" 
    android:toXDelta="0" /> 
</set>

slide_right_out.xml:

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android" > 
  <translate 
    android:duration="800" 
    android:fromXDelta="0" 
    android:toXDelta="100%p" /> 
</set>

最后是Activity中的实现:

package net.loonggg.demo.slider; 
import android.app.Activity; 
import android.os.Bundle; 
import android.view.GestureDetector; 
import android.view.GestureDetector.OnGestureListener; 
import android.view.LayoutInflater; 
import android.view.MotionEvent; 
import android.view.View; 
import android.view.View.OnTouchListener; 
import android.view.Window; 
import android.view.animation.Animation; 
import android.view.animation.Animation.AnimationListener; 
import android.view.animation.AnimationSet; 
import android.view.animation.AnimationUtils; 
import android.widget.Button; 
import android.widget.ImageView; 
import android.widget.TextView; 
import android.widget.ViewFlipper; 
public class MainActivity extends Activity implements OnGestureListener, 
    OnTouchListener { 
  private GestureDetector detector; 
  private ViewFlipper myViewFlipper; 
  private int[] imgs = { R.drawable.img0, R.drawable.img1, R.drawable.img2, 
      R.drawable.img3, R.drawable.img4, R.drawable.img5 }; 
  private int displayedChildIndex = 0; 
  private Button treasure_btn; 
  private Button garbage_btn; 
  @Override 
  public void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    requestWindowFeature(Window.FEATURE_NO_TITLE); 
    setContentView(R.layout.main); 
    myViewFlipper = (ViewFlipper) findViewById(R.id.viewflipper); 
    treasure_btn = (Button) findViewById(R.id.treasure_chest_btn); 
    garbage_btn = (Button) findViewById(R.id.garbage_btn); 
    myViewFlipper.setOnTouchListener(this); 
    myViewFlipper.setLongClickable(true);// 设置长按事件 
    // myViewFlipper.setAutoStart(true);// 设置是否自动播放,默认不自动播放 
    detector = new GestureDetector(this); 
    addFlipperView(); 
  } 
  /** 
   * 向FlipperView中动态添加View 
   */ 
  private void addFlipperView() { 
    for (int i = 0; i < imgs.length; i++) { 
      View view = LayoutInflater.from(this).inflate( 
          R.layout.myviewflipper, null); 
      TextView title = (TextView) view.findViewById(R.id.view_title); 
      title.setText("头像"); 
      ImageView iv = (ImageView) view.findViewById(R.id.view_image); 
      iv.setBackgroundResource(imgs[i]); 
      myViewFlipper.addView(view); 
    } 
  } 
  @Override 
  public boolean onDown(MotionEvent e) { 
    return false; 
  } 
  @Override 
  public void onShowPress(MotionEvent e) { 
  } 
  @Override 
  public boolean onSingleTapUp(MotionEvent e) { 
    return false; 
  } 
  @Override 
  public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, 
      float distanceY) { 
    return false; 
  } 
  @Override 
  public void onLongPress(MotionEvent e) { 
  } 
  @Override 
  public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, 
      float velocityY) { 
    // 返回当前正在显示的子视图的索引 
    displayedChildIndex = myViewFlipper.getDisplayedChild(); 
    final ImageView iv = (ImageView) myViewFlipper.getChildAt( 
        displayedChildIndex).findViewById(R.id.view_image); 
    if (e2.getX() - e1.getX() >= 100 && e1.getY() - e2.getY() >= 100) { 
      AnimationSet outAnim = (AnimationSet) AnimationUtils.loadAnimation( 
          this, R.anim.collect_treasure); 
      iv.startAnimation(outAnim); 
      outAnim.setAnimationListener(new AnimationListener() { 
        public void onAnimationStart(Animation animation) { 
        } 
        public void onAnimationRepeat(Animation animation) { 
        } 
        public void onAnimationEnd(Animation animation) { 
          showNextView(); 
          AnimationSet downAnim = (AnimationSet) AnimationUtils 
              .loadAnimation(MainActivity.this, R.anim.up_or_down); 
          treasure_btn.setAnimation(downAnim); 
          iv.clearAnimation(); 
        } 
      }); 
    } else if (e1.getX() - e2.getX() >= 100 && e2.getY() - e1.getY() >= 100) { 
      AnimationSet outAnim = (AnimationSet) AnimationUtils.loadAnimation( 
          this, R.anim.throw_garbage); 
      iv.startAnimation(outAnim); 
      outAnim.setAnimationListener(new AnimationListener() { 
        public void onAnimationStart(Animation animation) { 
        } 
        public void onAnimationRepeat(Animation animation) { 
        } 
        public void onAnimationEnd(Animation animation) { 
          showNextView(); 
          AnimationSet leftAnim = (AnimationSet) AnimationUtils 
              .loadAnimation(MainActivity.this, 
                  R.anim.left_or_right); 
          garbage_btn.setAnimation(leftAnim); 
          iv.clearAnimation(); 
        } 
      }); 
    } else if (e1.getX() - e2.getX() >= 100) { 
      showNextView(); 
    } else if (e2.getX() - e1.getX() >= 100) { 
      showPreviousView(); 
    } 
    return false; 
  } 
  private void showPreviousView() { 
    myViewFlipper.setInAnimation(AnimationUtils.loadAnimation(this, 
        R.anim.slide_right_in)); 
    myViewFlipper.setOutAnimation(AnimationUtils.loadAnimation(this, 
        R.anim.slide_right_out)); 
    myViewFlipper.showPrevious(); 
  } 
  private void showNextView() { 
    myViewFlipper.setInAnimation(AnimationUtils.loadAnimation(this, 
        R.anim.slide_left_in)); 
    myViewFlipper.setOutAnimation(AnimationUtils.loadAnimation(this, 
        R.anim.slide_left_out)); 
    myViewFlipper.showNext(); 
  } 
  @Override 
  public boolean onTouch(View v, MotionEvent event) { 
    return detector.onTouchEvent(event); 
  } 
}

希望本文所述对大家Android程序设计有所帮助。

 类似资料:
  • 本文向大家介绍Android ViewPager画廊效果详解及实例,包括了Android ViewPager画廊效果详解及实例的使用技巧和注意事项,需要的朋友参考一下 Android ViewPager 画廊效果 从上面的图片可以看到,当添加多张图片的时候,能够在下方形成一个画廊的效果,我们左右拉动图片来看我们添加进去的图片,效果是不是好了很多呢?下面来看看怎么实现吧! 上面的效果类似Androi

  • 本文向大家介绍Android中利用viewflipper动画切换屏幕效果,包括了Android中利用viewflipper动画切换屏幕效果的使用技巧和注意事项,需要的朋友参考一下 整个项目的 感悟:ViewFlipper貌似可以做成新下载的应用 ,用户第一次进入的大概描述。。最后再做个button,进入应用。 1.先在main.xml文件中添加viewflipper,然后在MainActivity

  • 本文向大家介绍Android ListView 滚动条的设置详解及实例代码,包括了Android ListView 滚动条的设置详解及实例代码的使用技巧和注意事项,需要的朋友参考一下 Android ListView 滚动条的设置详解 1.滚动条的属性 设置是否始终显示水平滚动条。这里用ScrollView、ListView测试均没有效果。 设置是否始终显示垂直滚动条。这里用ScrollView、

  • 本文向大家介绍Vue动画事件详解及过渡动画实例,包括了Vue动画事件详解及过渡动画实例的使用技巧和注意事项,需要的朋友参考一下 为了应用过渡效果,需要在目标元素上使用 transition 特性: transition 特性可以与下面资源一起用: v-if v-show v-for (只在插入和删除时触发,使用 vue-animated-list 插件) 动态组件 在组件的根节点上,并且被 Vue

  • 本文向大家介绍Android ImageView的selector效果实例详解,包括了Android ImageView的selector效果实例详解的使用技巧和注意事项,需要的朋友参考一下 Android ImageView的selector效果实例详解 在平时开发中如Button我们给它加上selector分别呈现pressed以及normal效果能给我们的用户体验上大大增色不少,可是我们当我

  • 本文向大家介绍Android IntentService详解及使用实例,包括了Android IntentService详解及使用实例的使用技巧和注意事项,需要的朋友参考一下 Android IntentService详解 一、IntentService简介 IntentService是Service的子类,比普通的Service增加了额外的功能。先看Service本身存在两个问题:  Servi