Android--UI之ImageSwitcher

简介:

前言

  这篇博客来聊一聊AndroidUI开发中ImageSwitcher控件的使用。ImageSwitcher控件与ImageView类似,都可以用于显示图片,但是ImageSwitcher通过名字可以看出,主要是用于多张图片的切换显示。在本篇博客中,会介绍ImageSwitcher控件的基本属性的设置以及常用方法的调用。在最后会通过一个示例Demo来展示本篇博客中讲到的一些内容。

 

ImageSwitcher

  ImageSwitcher是一个图片切换器,它间接继承自FrameLayout类,和ImageView相比,多了一个功能,那就是它说显示的图片切换时,可以设置动画效果,类似于淡进淡出效果,以及左进右出滑动等效果。

  既然ImageSwitcher是用来显示图片的控件,AndroidAPI为我们提供了三种不同方法来设定不同的图像来源,方法有:

  • setImageDrawable(Drawable):指定一个Drawable对象,用来给ImageSwitcher显示。
  • setImageResource(int):指定一个资源的ID,用来给ImageSwitcher显示。
  • setImageURL(URL):指定一个URL地址,用来给ImageSwitcher显示URL指向的图片资源。

动画效果设定

  上面介绍到,ImageSwitcher可以设置图片切换时,动画的效果。对于动画效果的支持,是因为它继承了ViewAnimator类,这个类中定义了两个属性,用来确定切入图片的动画效果和切出图片的动画效果:

  • android:inAnimation:切入图片时的效果。
  • android:outAnimation:切出图片时的效果。

  以上两个属性如果在XML中设定的话,当然可以通过XML资源文件自定义动画效果,但是如果只是想使用Android自带的一些简单的效果的话,需要设置参数为“@android:anim/AnimName”来设定效果,其中AnimName为指定的动画效果。如果在代码中设定的话,可以直接使用setInAnimation()和setOutAnimation()方法。它们都传递一个Animation的抽象对象,Animation用于描述一个动画效果,一般使用一个AnimationUtils的工具类获得。对于动画效果,不是本片博客的重点,关于Android的动画效果,以后再详细讲解。

  对于动画效果,一般定义在android.R.anim类中,它是一个final类,以一些int常量的形式,定义的样式,这里仅仅介绍两组样式,淡进淡出效果,以及左进右出滑动效果,如果需要其他效果,可以查阅官方文档。

  • fede_in:淡进。
  • fade_out:淡出
  • slide_in_left:从左滑进。
  • slide_out_right: 从右滑出。

  一般使用的话,通过这些常量名称就可以看出是什么效果,这里并不是强制Xxx_in_Xxx就一定对应了setInAnimation()方法,但是一般如果不成组设定的话,效果会很丑,建议还是成组的对应In和Out设定效果。

ViewFactory

  在使用ImageSwitcher的时候,有一点特别需要注意的,需要通过setFactory()方法为它设置一个ViewSwitcher.ViewFactory接口,设置这个ViewFactory接口时需要实现makeView()方法,该方法通常会返回一个ImageView,而ImageSwitcher则负责显示这个ImageView。如果不设定ViewFactory的话,ImageSwitcher将无法使用。通过官方文档了解到,setFactory()方法被声明在ViewSwitcher类中,而ImageSwitcher直接继承自ViewSwitcher类。ViewSwitcher的功能与ImageSwitcher类似,只是ImageSwitcher用于展示图片,而ViewSwitcher用于展示一些View视图。

  可以这么理解,通过ViewFactory中的makeView()方法返回一个新的View视图,用来放入ViewSwitcher中展示,而对于ImageSwitcher而言,这里通常返回的是一个ImageView。

 

示例程序

  下面通过一个Demo来说明上面讲到的内容。在示例中定义一个ImageSwitcher和两个Button,这两个按钮分别控制着图像的上一张、下一张显示,当然,在资源中必须存在这几个待切换的图片文件。。

  布局代码:

复制代码
 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2     xmlns:tools="http://schemas.android.com/tools"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:paddingBottom="@dimen/activity_vertical_margin"
 6     android:paddingLeft="@dimen/activity_horizontal_margin"
 7     android:paddingRight="@dimen/activity_horizontal_margin"
 8     android:paddingTop="@dimen/activity_vertical_margin"
 9     tools:context=".MainActivity" android:orientation="vertical">
10     
11     <ImageSwitcher
12         android:id="@+id/imageSwitcher1"
13         android:layout_width="fill_parent"
14         android:layout_height="150dp"
15          />
16     <Button
17         android:id="@+id/btnadd"
18         android:layout_width="fill_parent"
19         android:layout_height="wrap_content"
20         android:text="上一张" />
21     <Button
22         android:id="@+id/btnSub"
23         android:layout_width="fill_parent"
24         android:layout_height="wrap_content"
25         android:text="下一张" />
26 </LinearLayout>
复制代码

  实现代码:

复制代码
 1 package com.bgxt.imageswitcherDemo;
 2 
 3 import java.util.ArrayList;
 4 import java.util.List;
 5 
 6 import android.os.Bundle;
 7 import android.app.Activity;
 8 import android.graphics.drawable.Drawable;
 9 import android.view.Menu;
10 import android.view.View;
11 import android.view.View.OnClickListener;
12 import android.view.animation.Animation;
13 import android.view.animation.AnimationUtils;
14 import android.widget.Button;
15 import android.widget.ImageSwitcher;
16 import android.widget.ImageView;
17 import android.widget.ViewSwitcher.ViewFactory;
18 
19 public class MainActivity extends Activity {
20     private Button btnAdd, btnSub;
21     private ImageSwitcher imageSwitcher;
22     private int index = 0;
23     private List<Drawable> list;
24 
25     @Override
26     protected void onCreate(Bundle savedInstanceState) {
27         super.onCreate(savedInstanceState);
28         setContentView(R.layout.activity_main);
29         putData();
30         imageSwitcher = (ImageSwitcher) findViewById(R.id.imageSwitcher1);
31         btnAdd = (Button) findViewById(R.id.btnadd);
32         btnSub = (Button) findViewById(R.id.btnSub);
33         btnAdd.setOnClickListener(myClick);
34         btnSub.setOnClickListener(myClick);
35         
36         //通过代码设定从左缓进,从右换出的效果。
37         imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(MainActivity.this, android.R.anim.slide_in_left));
38         imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(MainActivity.this, android.R.anim.slide_out_right));
39         imageSwitcher.setFactory(new ViewFactory() {
40             
41             @Override
42             public View makeView() {
43                 // makeView返回的是当前需要显示的ImageView控件,用于填充进ImageSwitcher中。
44                 return new ImageView(MainActivity.this);
45             }
46         });
47         imageSwitcher.setImageDrawable(list.get(0));
48     }
49  
50     @Override
51     public boolean onCreateOptionsMenu(Menu menu) {
52         // Inflate the menu; this adds items to the action bar if it is present.
53         getMenuInflater().inflate(R.menu.main, menu);
54         return true;
55     }
56 
57     private View.OnClickListener myClick = new OnClickListener() {
58 
59         @Override
60         public void onClick(View v) {
61             switch (v.getId()) {
62             case R.id.btnadd:
63                 index--;
64                 if(index<0)
65                 {
66                     //用于循环显示图片
67                     index=list.size()-1;
68                 }
69                 //设定ImageSwitcher显示新图片
70                 imageSwitcher.setImageDrawable(list.get(index));
71                 break;
72 
73             case R.id.btnSub:
74                 index++;
75                 if(index>=list.size())
76                 {
77                     //用于循环显示图片
78                     index=0;
79                 }
80                 imageSwitcher.setImageDrawable(list.get(index));
81                 break;
82             }
83         }
84     };
85 
86     private void putData() {
87         //填充图片的Drawable资源数组
88         list = new ArrayList<Drawable>();
89         list.add(getResources().getDrawable(R.drawable.bmp1));
90         list.add(getResources().getDrawable(R.drawable.bmp2));
91         list.add(getResources().getDrawable(R.drawable.bmp3));
92         list.add(getResources().getDrawable(R.drawable.bmp4));
93         list.add(getResources().getDrawable(R.drawable.bmp5));
94     }
95 }
复制代码

  效果展示:

   源码下载

总结

  本篇博客主要讲解了ImageSwitcher的使用方式,而对于其父类ViewSwitcher的使用,大致上与ImageSwitcher相似,只是填充的内容不同而已,一般了解了ImageSwitcher的使用,再看ViewSwitcher就很好理解,以后有时间再详细讲解ViewSwitcher的使用。



本文转自承香墨影博客园博客,原文链接:http://www.cnblogs.com/plokmju/p/android_ImageSwitcher.html,如需转载请自行联系原作者


相关文章
|
1月前
|
搜索推荐 Android开发 开发者
探索安卓开发中的自定义视图:打造个性化UI组件
【10月更文挑战第39天】在安卓开发的世界中,自定义视图是实现独特界面设计的关键。本文将引导你理解自定义视图的概念、创建流程,以及如何通过它们增强应用的用户体验。我们将从基础出发,逐步深入,最终让你能够自信地设计和实现专属的UI组件。
|
21天前
|
XML 搜索推荐 前端开发
安卓开发中的自定义视图:打造个性化UI组件
在安卓应用开发中,自定义视图是一种强大的工具,它允许开发者创造独一无二的用户界面元素,从而提升应用的外观和用户体验。本文将通过一个简单的自定义视图示例,引导你了解如何在安卓项目中实现自定义组件,并探讨其背后的技术原理。我们将从基础的View类讲起,逐步深入到绘图、事件处理以及性能优化等方面。无论你是初学者还是有经验的开发者,这篇文章都将为你提供有价值的见解和技巧。
|
1月前
|
XML 前端开发 Android开发
Android:UI:Drawable:View/ImageView与Drawable
通过本文的介绍,我们详细探讨了Android中Drawable、View和ImageView的使用方法及其相互关系。Drawable作为图像和图形的抽象表示,提供了丰富的子类和自定义能力,使得开发者能够灵活地实现各种UI效果。View和ImageView则通过使用Drawable实现了各种图像和图形的显示需求。希望本文能为您在Android开发中使用Drawable提供有价值的参考和指导。
40 2
|
7月前
|
Android开发 算法 架构师
android的基础ui组件,这些知识点你会吗
android的基础ui组件,这些知识点你会吗
android的基础ui组件,这些知识点你会吗
|
7月前
|
Android开发 缓存 双11
android的基础ui组件,Android开发社招面试经验
android的基础ui组件,Android开发社招面试经验
android的基础ui组件,Android开发社招面试经验
|
3月前
|
XML Android开发 UED
💥Android UI设计新风尚!掌握Material Design精髓,让你的界面颜值爆表!🎨
随着移动应用市场的蓬勃发展,用户对界面设计的要求日益提高。为此,掌握由Google推出的Material Design设计语言成为提升应用颜值和用户体验的关键。本文将带你深入了解Material Design的核心原则,如真实感、统一性和创新性,并通过丰富的组件库及示例代码,助你轻松打造美观且一致的应用界面。无论是色彩搭配还是动画效果,Material Design都能为你的Android应用增添无限魅力。
85 1
|
4月前
|
存储 搜索推荐 Java
探索安卓开发中的自定义视图:打造个性化UI组件Java中的异常处理:从基础到高级
【8月更文挑战第29天】在安卓应用的海洋中,一个独特的用户界面(UI)能让应用脱颖而出。自定义视图是实现这一目标的强大工具。本文将通过一个简单的自定义计数器视图示例,展示如何从零开始创建一个具有独特风格和功能的安卓UI组件,并讨论在此过程中涉及的设计原则、性能优化和兼容性问题。准备好让你的应用与众不同了吗?让我们开始吧!
|
4月前
|
编解码 Android开发
【Android Studio】使用UI工具绘制,ConstraintLayout 限制性布局,快速上手
本文介绍了Android Studio中使用ConstraintLayout布局的方法,通过创建布局文件、设置控件约束等步骤,快速上手UI设计,并提供了一个TV Launcher界面布局的绘制示例。
74 1
|
4月前
|
API Android开发
Android项目架构设计问题之选择和使用合适的UI库如何解决
Android项目架构设计问题之选择和使用合适的UI库如何解决
56 0
|
5月前
|
XML Android开发 UED
💥Android UI设计新风尚!掌握Material Design精髓,让你的界面颜值爆表!🎨
【7月更文挑战第28天】随着移动应用市场的发展,用户对界面设计的要求不断提高。Material Design是由Google推出的设计语言,强调真实感、统一性和创新性,通过模拟纸张和墨水的物理属性创造沉浸式体验。它注重色彩、排版、图标和布局的一致性,确保跨设备的统一视觉风格。Android Studio提供了丰富的Material Design组件库,如按钮、卡片等,易于使用且美观。
171 1