Android基于ImageSwitcher实现图片切换功能_Android

左右切换图片控件大家都用ViewPager, ViewFipper比较多吧,我之前也用ViewPager实现了,使用ViewPager实现左右循环滑动图片,有兴趣的可以去看下,今天介绍的是基于ImageSwitcher实现的左右切换图片,先上截图吧

好了,接下来来看代码吧,第一张图是一个GridView,点击item跳转到第二个界面,第一个界面可以忽略,主要是讲解ImageSwitcher的左右却换图片,先看布局文件

<?xml version="1.0" encoding="UTF-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent" >
  <ImageSwitcher
    android:id="@+id/imageSwitcher1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
  </ImageSwitcher> 

  <RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >
    <LinearLayout
      android:id="@+id/viewGroup"
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:layout_alignParentBottom="true"
      android:layout_marginBottom="30dp"
      android:gravity="center_horizontal"
      android:orientation="horizontal" >
    </LinearLayout>
  </RelativeLayout>
</FrameLayout>

然后就是Activity代码啦,总体来说比较简单,代码我添加了注释

package com.example.photoalbum; 

import android.app.Activity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.view.ViewGroup;
import android.view.animation.AnimationUtils;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout.LayoutParams;
import android.widget.Toast;
import android.widget.ViewSwitcher.ViewFactory; 

public class ShowPhotoActivity extends Activity implements ViewFactory, OnTouchListener{
  /**
   * ImagaSwitcher 的引用
   */
  private ImageSwitcher mImageSwitcher;
  /**
   * 图片id数组
   */
  private int[] imgIds;
  /**
   * 当前选中的图片id序号
   */
  private int currentPosition;
  /**
   * 按下点的X坐标
   */
  private float downX;
  /**
   * 装载点点的容器
   */
  private LinearLayout linearLayout;
  /**
   * 点点数组
   */
  private ImageView[] tips; 

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.show_photo); 

    imgIds = new int[]{R.drawable.item01,R.drawable.item02,R.drawable.item03,R.drawable.item04,
        R.drawable.item05, R.drawable.item06, R.drawable.item07, R.drawable.item08,R.drawable.item09,
        R.drawable.item10, R.drawable.item11, R.drawable.item12};
    //实例化ImageSwitcher
    mImageSwitcher = (ImageSwitcher) findViewById(R.id.imageSwitcher1);
    //设置Factory
    mImageSwitcher.setFactory(this);
    //设置OnTouchListener,我们通过Touch事件来切换图片
    mImageSwitcher.setOnTouchListener(this); 

    linearLayout = (LinearLayout) findViewById(R.id.viewGroup); 

    tips = new ImageView[imgIds.length];
    for(int i=0; i<imgIds.length; i++){
      ImageView mImageView = new ImageView(this);
      tips[i] = mImageView;
      LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(new ViewGroup.LayoutParams(LayoutParams.WRAP_CONTENT,
          LayoutParams.WRAP_CONTENT));
      layoutParams.rightMargin = 3;
      layoutParams.leftMargin = 3; 

      mImageView.setBackgroundResource(R.drawable.page_indicator_unfocused);
      linearLayout.addView(mImageView, layoutParams);
    } 

    //这个我是从上一个界面传过来的,上一个界面是一个GridView
    currentPosition = getIntent().getIntExtra("position", 0);
    mImageSwitcher.setImageResource(imgIds[currentPosition]); 

    setImageBackground(currentPosition); 

  } 

   /**
   * 设置选中的tip的背景
   * @param selectItems
   */
  private void setImageBackground(int selectItems){
    for(int i=0; i<tips.length; i++){
      if(i == selectItems){
        tips[i].setBackgroundResource(R.drawable.page_indicator_focused);
      }else{
        tips[i].setBackgroundResource(R.drawable.page_indicator_unfocused);
      }
    }
  }  

  @Override
  public View makeView() {
    final ImageView i = new ImageView(this);
    i.setBackgroundColor(0xff000000);
    i.setScaleType(ImageView.ScaleType.CENTER_CROP);
    i.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
    return i ;
  } 

  @Override
  public boolean onTouch(View v, MotionEvent event) {
    switch (event.getAction()) {
    case MotionEvent.ACTION_DOWN:{
      //手指按下的X坐标
      downX = event.getX();
      break;
    }
    case MotionEvent.ACTION_UP:{
      float lastX = event.getX();
      //抬起的时候的X坐标大于按下的时候就显示上一张图片
      if(lastX > downX){
        if(currentPosition > 0){
          //设置动画,这里的动画比较简单,不明白的去网上看看相关内容
          mImageSwitcher.setInAnimation(AnimationUtils.loadAnimation(getApplication(), R.anim.left_in));
          mImageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(getApplication(), R.anim.right_out));
          currentPosition --;
          mImageSwitcher.setImageResource(imgIds[currentPosition % imgIds.length]);
          setImageBackground(currentPosition);
        }else{
          Toast.makeText(getApplication(), "已经是第一张", Toast.LENGTH_SHORT).show();
        }
      }  

      if(lastX < downX){
        if(currentPosition < imgIds.length - 1){
          mImageSwitcher.setInAnimation(AnimationUtils.loadAnimation(getApplication(), R.anim.right_in));
          mImageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(getApplication(), R.anim.lift_out));
          currentPosition ++ ;
          mImageSwitcher.setImageResource(imgIds[currentPosition]);
          setImageBackground(currentPosition);
        }else{
          Toast.makeText(getApplication(), "到了最后一张", Toast.LENGTH_SHORT).show();
        }
      }
      } 

      break;
    } 

    return true;
  } 

}

上面切换图片主要用到的就是动画了,用的是translate移动动画,这里我就不介绍了,接下来我吧动画代码贴出来,在res新建一个anim的目录,如下图

左边进入的动画,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

<?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>

右边出去的动画,right_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>

好了,介绍完了,代码写的不是很好,写的不好的地方希望大家谅解,小编一定更加努力。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索android
, 图片切换
ImageSwitcher
android实现tab切换、android 实现主题切换、android实现界面切换、android实现页面切换、android 实现语言切换,以便于您获取更多的相关知识。

时间: 2024-11-17 16:46:04

Android基于ImageSwitcher实现图片切换功能_Android的相关文章

Android基于SoftReference缓存图片的方法_Android

本文实例讲述了Android基于SoftReference缓存图片的方法.分享给大家供大家参考,具体如下: Java中的SoftReference即对象的软引用.如果一个对象具有软引用,内存空间足够,垃圾回收器就不会回收它:如果内存空间不足了,就会回收这些对象的内存.只要垃圾回收器没有回收它,该对象就可以被程序使用.软引用可用来实现内存敏感的高速缓存.使用软引用能防止内存泄露,增强程序的健壮性. SoftReference的特点是它的一个实例保存对一个Java对象的软引用,该软引用的存在不妨碍垃

Android控件ImageSwitcher实现左右图片切换功能_Android

ImageSwitcher类是ViewSwitcher类的子类,它实现的效果是在完成ImageView的切换并且带有动画效果.要使用这个类需要以下两个步骤: 1)为ImageSwitcher类提供一个ViewFactory,该ViewFactory生成的View组件必须是ImageView. 2)需要切换的时候,只需要嗲用ImageSwitcher的setImageDrawable().setImageResource().setImageURL()方法即可实现切换. activity_main

Android使用ViewFlipper实现图片切换功能

今天给大家简单的讲一下Android手势,目前市场上的App中手势的运用比较少. Android提供了两种手势: ①.Android提供了手势检测,并为手势检测提供了相应的监听器 ②.Android允许开发者添加手势,并提供了相应的API识别用户手势 在之前的一片博客我讲过如何使用ViewPager实现图片滑动切换 地址:Android使用ViewPager实现图片滑动预览效果 但是ViewPager拥有自带的手势识别,意思就是它会自动识别手势是右滑还是左滑. 今天我讲一下如何使用ViewFli

c#代码-用unity做一个多图片切换功能!

问题描述 用unity做一个多图片切换功能! 如图所示

Android ViewPager撤消左右滑动切换功能实现代码

最近做项目要求某种情况下ViewPager不能滑动,那么我们只需要重写这个方法就可以禁止ViewPager滑动.下面通过本文给大家ViewPager取消左右滑动切换功能的实例代码,具体代码如下所示: IndexViewPager.Java: <span style="background-color: rgb(255, 255, 255);">import android.content.Context; import android.support.v4.view.Vie

Android基于SoftReference缓存图片的方法

本文实例讲述了Android基于SoftReference缓存图片的方法.分享给大家供大家参考,具体如下: Java中的SoftReference即对象的软引用.如果一个对象具有软引用,内存空间足够,垃圾回收器就不会回收它:如果内存空间不足了,就会回收这些对象的内存.只要垃圾回收器没有回收它,该对象就可以被程序使用.软引用可用来实现内存敏感的高速缓存.使用软引用能防止内存泄露,增强程序的健壮性. SoftReference的特点是它的一个实例保存对一个Java对象的软引用,该软引用的存在不妨碍垃

Android 基于ImageSwitcher实现的左右切换图片

左右切换图片控件大家都用ViewPager, ViewFipper比较多吧,我之前也用ViewPager实现了,使用ViewPager实现左右循环滑动图片,有兴趣的可以去看下,今天介绍的是基于ImageSwitcher实现的左右切换图片,先上截图吧 好了,接下来来看代码吧,第一张图是一个GridView,点击item跳转到第二个界面,第一个界面可以忽略,主要是讲解ImageSwitcher的左右却换图片,先看布局文件 [html] view plaincopy <?xml version="

Android控件ImageSwitcher实现左右图片切换功能

ImageSwitcher类是ViewSwitcher类的子类,它实现的效果是在完成ImageView的切换并且带有动画效果.要使用这个类需要以下两个步骤: 1)为ImageSwitcher类提供一个ViewFactory,该ViewFactory生成的View组件必须是ImageView. 2)需要切换的时候,只需要嗲用ImageSwitcher的setImageDrawable().setImageResource().setImageURL()方法即可实现切换. activity_main

Android自定义ViewPager实现个性化的图片切换效果_Android

第一次见到ViewPager这个控件,瞬间爱不释手,做东西的主界面通通ViewPager,以及图片切换也抛弃了ImageSwitch之类的,开始让ViewPager来做.时间长了,ViewPager的切换效果觉得枯燥,形成了审美疲劳~~我们需要改变,今天教大家如何改变ViewPager切换时的效果,实现个性化的图片切换 看一下这样效果的图片切换: 是不是比传统的效果个性很多,嘿嘿~~其实很简单,学习完这篇文章,保证你可以自定义切换效果,做出各式各样的效果.1.制作前的分析 观察下效果图,实际上改