您好!欢迎来到源码码网

Android图片切换器控件ImageSwitcher和图库控件Gallery使用

  • 源码教程
  • 来源:源码码网
  • 编辑:admin
  • 时间:2021-01-12 20:19
  • 阅读:512

在使用 Android 手机设置壁纸的时候,会看到屏幕底部有很多可以滚动的图片,当单击某一图片时,在其上面的空间会显示当前选中的图片,此时我们用到的就是 Gallery(图库)和 ImageSwitcher(图片切换器)。

Gallery 组件用于横向显示图像列表,并且自动将当前图像放置到中间位置。

ImageSwitcher 则像是图片浏览器,可以切换图片,通过它可以制作简单的幻灯片等。通常将这两个类结合在一起使用,可以制作有一定效果的相册。

下面通过一个实例来了解一下这两个组件的使用方法。

在工程 WidgetDemo 的布局文件 main.xml 中添加一个名为 GalleryDemo 的 Button,用以启动 GalleryActivity。在 main.xml 中添加代码如下:

  1. <Button

  2. android:id="@+id/button11"

  3. android:layout_width="wrap_content"

  4. android:layout_height="wrap_content"

  5. android:text="GalleryDemo"/>

单击 Button 并启动 GalleryActivity 的代码如下:


  1. Button gallerybtn = (Button)this.findViewById(R.id.button11);

  2. gallerybtn.setOnClickListener(new View.OnClickListener(){

  3. @Override

  4. public void onClick(View v){

  5. Intent intent;

  6. intent = new Intent(MainActivity.this, GalleryActivity.class);

  7. startActivity(intent);

  8. }

  9. });

同时在 AndroidManifest.xml 文件中声明该 Activity:

<activity android:name=".GalleryActivity"/>

GalleryActivity 的运行效果如图 1 所示。

GalleryActivity的运行效果

图 1  GalleryActivity 的运行效果

GalleryActivity 使用的布局文件为 gallery.xml,内容如下:


  1. <?xml version="1.0" encoding="utf-8"?>

  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

  3. android:layout_width="match_parent"

  4. android:layout_height="match_parent"

  5. android:orientation="vertical">


  6. <ImageSwitcher

  7. android:id="@+id/switcher"

  8. android:layout_width="match_parent"

  9. android:layout_height="match_parent"

  10. android:layout_alignParentLeft="true"

  11. android:layout_alignParentTop="true" />


  12. <Gallery

  13. android:id="@+id/gallery"

  14. android:layout_width="fill_parent"

  15. android:layout_height="60dp"

  16. android:layout_alignParentBottom="true"

  17. android:layout_alignParentLeft="true"

  18. android:background="#333333"

  19. android:gravity="center_vertical"

  20. android:spacing="16dp" />


  21. </RelativeLayout>

该布局文件使用的是相对布局。
1)通过 android:layout_alignParentTop="true" 属性将 ImageSwitcher 放置于视图的顶端,其顶部与其父组件的顶部对齐。
2)通过 android: layout_alignParentLeft="true" 属性使 ImageSwitcher 的左边缘与其父组件的左边缘对齐。

在设置 Gallery 组件时,将其与屏幕的左下角对其,android:layout_alignParentBottom="true" 是将该组件的底部与其父组件的底部对齐,并且使用 android:spacing="16dp" 属性设置图片之间的间距。

GalleryActivity.java 的代码如下:


  1. package introduction.android.widgetdemo;


  2. import android.app.Activity;

  3. import android.content.Context;

  4. import android.os.Bundle;

  5. import android.view.View;

  6. import android.view.ViewGroup;

  7. import android.view.ViewGroup.LayoutParams;

  8. import android.view.animation.AnimationUtils;

  9. import android.widget.AdapterView;

  10. import android.widget.AdapterView.OnItemSelectedListener;

  11. import android.widget.BaseAdapter;

  12. import android.widget.Gallery;

  13. import android.widget.ImageSwitcher;

  14. import android.widget.ImageView;

  15. import android.widget.ViewSwitcher.ViewFactory;


  16. public class GalleryActivity extends Activity {

  17. private Gallery gallery;

  18. private ImageSwitcher imageSwitcher;

  19. private int[] resids = new int[]{

  20. R.drawable.img_1, R.drawable.bbb,

  21. R.drawable.img_2, R.drawable.img_5,

  22. R.drawable.img_3, R.drawable.img_6,

  23. R.drawable.img_4, R.drawable.img_7};


  24. @Override

  25. public void onCreate(Bundle savedInstanceState) {

  26. super.onCreate(savedInstanceState);

  27. setContentView(R.layout.gallery);

  28. /* 加载Gallery和ImageSwitcher */

  29. gallery = (Gallery) findViewById(R.id.gallery);


  30. imageSwitcher = (ImageSwitcher) findViewById(R.id.switcher);

  31. /*创建用于描述图像数据的ImageAdapter对象*/

  32. ImageAdapter imageAdapter = new ImageAdapter(this);

  33. /*设置Gallery组件的Adapter对象*/

  34. gallery.setAdapter(imageAdapter);

  35. /*添加Gallery监听器*/

  36. gallery.setOnItemSelectedListener(new OnItemSelectedListener() {

  37. @Override

  38. public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {

  39. // TODO Auto-generated method stub

  40. //当选取Grallery上的图片时,在ImageSwitcher组件中显示该图像

  41. imageSwitcher.setImageResource(resids[position]);

  42. }


  43. @Override

  44. public void onNothingSelected(AdapterView<?> argO) {

  45. // TODO Auto-generated method stub

  46. }

  47. });


  48. /* 设置ImageSwitcher组件的工厂对象*/

  49. imageSwitcher.setFactory(new ViewFactory() {

  50. /* ImageSwitcher用这个方法来创建一个View对象去显示图片*/

  51. @Override

  52. public View makeView() {

  53. // TODO Auto-generated method stub

  54. ImageView imageView = new ImageView(GalleryActivity.this);

  55. /* setScaleType 可以设置当图片大小和容器大小不匹配时的剪辑模式*/

  56. imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);

  57. imageView.setLayoutParams(new ImageSwitcher.LayoutParams(

  58. LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));

  59. return imageView;

  60. }


  61. });


  62. /* 设置ImageSwitcher组件显示图像的动画效果 */

  63. imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_in));

  64. imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_out));


  65. }


  66. public class ImageAdapter extends BaseAdapter {

  67. /* 定义Context */

  68. private Context mContext;


  69. /*声明ImageAdapter */

  70. public ImageAdapter(Context context) {

  71. mContext = context;

  72. }


  73. @Override

  74. /*获取图片的个数*/

  75. public int getCount() {

  76. // TODO Auto-generated method stub

  77. return resids.length;

  78. }


  79. /*获取图片在库中的位置 */

  80. @Override

  81. public Object getItem(int position) {

  82. // TODO Auto-generated method stub

  83. return position;

  84. }


  85. /*获取图片ID */

  86. @Override

  87. public long getItemId(int position) {

  88. // TODO Auto-generated method stub

  89. return position;

  90. }


  91. /* 返回具体位置的ImageView对象 */

  92. @Override

  93. public View getView(int position, View convertView, ViewGroup parent) {

  94. ImageView imageview = new ImageView(mContext);

  95. /*给ImageView设置资源*/

  96. imageview.setImageResource(resids[position]);

  97. /*设置图片布局大小为100*100 */

  98. imageview.setLayoutParams(new Gallery.LayoutParams(100, 100));

  99. /* 设置显示比例类型*/

  100. imageview.setScaleType(ImageView.ScaleType.FIT_XY);

  101. return imageview;

  102. }

  103. }

  104. }


Gallery 要显示的图片来自资源文件。把需要显示的图片放在 /res/drawable 目录下后,将这些图片的 ID 保存在一个 int 数组中以备使用。相关代码如下:

  1. private int[] resids = new int[]{

  2. R.drawable.img_1, R.drawable.bbb,

  3. R.drawable.img_2, R.drawable.img_5,

  4. R.drawable.img_3, R.drawable.img_6,

  5. R.drawable.img_4, R.drawable.img_7};

Gallery 通过 setAdapter(imageAdapter)方法将组件和要显示的图片关联起来。

本实例中为 Gallery 设定的适配器为 ImageAdapter,主要用于描述图像信息,其为 android.widget.BaseAdapter 的子类。

在 ImageAdapter 类中有两个方法值得我们注意:
1)getCount() 方法:用于返回图片的总数,通常使用获取存放图片数组长度的方法获取图片总数,也可以规定具体的返回数,但不能超过实际图片数量。
2)getView() 方法:是当 Gallery 需要显示某一个图像时,将当前图片的索引,也就是 position 的值传入,从 resids 数组中获得相应的图片的 ID。


GalleryActivity 为添加 Gallery 监听器,处理了用户单击 Gallery 中图片的事件,并设置了 ImageSwitcher 相关属性。其代码如下:

  1. imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_in));

  2. imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_out));

设置了 ImageSwitcher 组件图片切换时的渐入和渐出效果。

特别声明:
1、如无特殊说明,内容均为本站原创发布,转载请注明出处;
2、部分转载文章已注明出处,转载目的为学习和交流,如有侵犯,请联系客服删除;
3、编辑非《源码码网》的文章均由用户编辑发布,不代表本站立场,如涉及侵犯,请联系删除;
全部评论(0)
推荐阅读
  • 常用测试压力工具使用介绍
  • 常用测试压力工具使用介绍
  • ab 是 ApacheBench 工具的缩写,它是一个HTTP压力测试工具。让我详细说明如何测试:1. 安装ApacheBenchWindows系统:方法一:安装XAMPP或WAMP(自带ab)下载地址:https://www.apachefriends.org/zh_cn/index.html安装后,ab工具在:C:xamppapacheinab.exe方法二:使
  • 开发工具
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2026-01-13 20:27
  • 阅读:56
  • 工程项目一体化自动管理软件解决方案
  • 工程项目一体化自动管理软件解决方案
  • 1.项目概述1.1项目背景在工程建设行业数字化转型浪潮下,传统项目管理面临信息孤岛、协同困难、进度不可控、成本超支等痛点。本方案旨在构建一个覆盖工程项目全生命周期、全参与方、全业务流程的一体化智能管理平台。1.2解决方案愿景打造数据驱动、智能协同、风险预警、自动执行的工程大脑,实现:管理流程自动化率≥80%项目协同效率提升40%成本偏差率降低至±3%以内安全事故发生率降低60%1.3目标用户矩阵┌───────────────┬
  • 行业资讯
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2026-01-09 11:26
  • 阅读:169
  • 车辆管理系统需求文档与技术架构PC端+小程序
  • 车辆管理系统需求文档与技术架构PC端+小程序
  • 第一部分:需求文档1.项目概述1.1项目背景为企事业单位、车队运营商、租赁公司等提供一套完整的车辆全生命周期管理解决方案,实现车辆管理数字化、智能化。1.2项目目标建立车辆从购置到报废的全流程管理体系实现用车申请、调度、监控、结算的闭环管理通过数据分析优化车辆使用效率降低车辆运维成本20%以上1.3用户角色矩阵┌──────────────┬─────────────────────────────┬──────────────
  • 行业资讯
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2026-01-09 11:11
  • 阅读:157
  • 智慧农业/渔业物联网系统需求文档
  • 智慧农业/渔业物联网系统需求文档
  • 智慧农业/渔业物联网系统需求文档文档版本: V1.0项目目标: 构建一个集环境智能监测、设备自动化控制、生长模型分析、溯源管理与远程指挥于一体的综合物联网管理平台,实现降本增效、提质增产、风险预警与品牌增值。1.系统总体概述1.1核心价值: 数据驱动决策,解放人力,实现农业/渔业生产的精准化、自动化与智能化。1.2用户角色:生产员/养殖员: 现场巡视、接收告警、执行设备手动控制、查看实时环境
  • 行业资讯
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2026-01-09 11:04
  • 阅读:68
  • 程序员AI编程工具推荐
  • 程序员AI编程工具推荐
  • AI编程工具是当前开发者的“副驾驶”,能够极大提升开发效率。以下我将从通用型、代码专用型、垂直领域型以及开源/自部署型几个维度为您分类推荐,并附上它们的核心特点和适用场景,帮助您选择。一、通用型AI对话助手(编程是核心能力之一)这类工具本质是“更懂代码的ChatGPT”,适合处理广泛的编程问题、解释代码、生成文档等。ChatGPT(GPT-4/4o)简介:行业标杆,尤其在GPT-4版本下,代码理解和生成能力极强。优点:上下文能力强,
  • 源码教程
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2026-01-09 10:56
  • 阅读:96
联系客服
源码代售 源码咨询 技术开发 联系客服
029-84538663
手机版

扫一扫进手机版
返回顶部