Android UI控件系列:Gallery(画廊视图)

2024-09-01 20:58

本文主要是介绍Android UI控件系列:Gallery(画廊视图),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

Gallery能够水平显示其内容,一般用来浏览图片,被选中的选项位于中间,并且可以相应事件显示信息。下面结合ImageSwitcher组件来实现一个通过缩略图来浏览图片的程序,具体步骤如下

第一步:

创建一个Andorid工程”GalleryTest”,该工程的入口是Activity类GalleryTest继承Activity并实现OnItemSelectedListener和ViewFactory接口,来实现图片和视图的创建

package org.hualang.Gallery;import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.ViewSwitcher.ViewFactory;
//继承Activity,实现onItemSelectedListener和ViewFactory接口
public class GalleryTest extends Activity implements OnItemSelectedListener,ViewFactory{/** Called when the activity is first created. */@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.main);}@Overridepublic View makeView() {// TODO Auto-generated method stubreturn null;}@Overridepublic void onItemSelected(AdapterView<?> arg0, View arg1, int arg2,long arg3) {// TODO Auto-generated method stub}@Overridepublic void onNothingSelected(AdapterView<?> arg0) {// TODO Auto-generated method stub}
}

第二步:

在工程的res\drawable\目录下添加7张图片和对应的缩略图

第三步:

在工程res\layout\目录下创建一个布局文件main.xml,在其中那个添加一个Gallery组件和一个ImageSwitcher组件,并设置相应的属性

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:orientation="vertical"android:layout_width="fill_parent"android:layout_height="fill_parent">
<ImageSwitcher android:id="@+id/switcher"android:layout_width="fill_parent"android:layout_height="fill_parent"android:layout_alignParentTop="true"android:layout_alignParentLeft="true"/><Gallery android:id="@+id/gallery"android:background="#55000000"android:layout_width="fill_parent"android:layout_height="60dp"android:layout_alignParentBottom="true"android:layout_alignParentLeft="true"android:gravity="center_vertical"android:spacing="16dp"/>
</LinearLayout>

第四步:在GalleryTest顶部声明使用到的ImageSwitcher实例图片资源Integer数组

public class GalleryTest extends Activity implements OnItemSelectedListener,ViewFactory{/** Called when the activity is first created. *///声明ImageSwitcherprivate ImageSwitcher switcher;//缩略图片id数组private Integer[] thumbids={R.drawable.thumb0,R.drawable.thumb1,R.drawable.thumb2,R.drawable.thumb3,R.drawable.thumb4,R.drawable.thumb5,R.drawable.thumb6,R.drawable.thumb7};//图片id数组private Integer[] imgids={R.drawable.img0,R.drawable.img1,R.drawable.img2,R.drawable.img3,R.drawable.img4,R.drawable.img5,R.drawable.img6,R.drawable.img7};

第五步:

在GalleryTest的onCreate()方法中,将窗口样式设置为无标题,设置当前布局视图,获得ImageSwitcher实例,并设置渐进渐出动画,获得Gallery实例

public void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);//设置窗口特征无标题requestWindowFeature(Window.FEATURE_NO_TITLE);setContentView(R.layout.main);//通过findViewById方法获得ImageSwitcher对象switcher=(ImageSwitcher)findViewById(R.id.switcher);//为ImageSwitcher设置工厂switcher.setFactory(this);//设置动画渐入效果switcher.setInAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_in));//设置动画渐出效果switcher.setOutAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_out));//通过findViewById方法获得Gallery对象Gallery g=(Gallery)findViewById(R.id.gallery);}

第六步:

创建内部类ImageAdapter,该类继承BaseAdapter,为Gallery设置Adapter实例

public class ImageAdapter extends BaseAdapter {//构造方法public ImageAdapter(Context c) {mContext = c;}//获得数量public int getCount() {return thumbids.length;}//获得当前选项public Object getItem(int position) {return position;}//获得当前选项IDpublic long getItemId(int position) {return position;}//获得View对象public View getView(int position, View convertView, ViewGroup parent) {//实例化ImageView对象ImageView i = new ImageView(mContext);//设置缩略图片资源i.setImageResource(thumbids[position]);//设置边界对齐i.setAdjustViewBounds(true);//设置布局参数i.setLayoutParams(new Gallery.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));//设置背景资源i.setBackgroundResource(R.drawable.picturefrom);return i;}private Context mContext;}

第七步:

实现onItemSelected()方法,更换图片

@Overridepublic void onItemSelected(AdapterView<?> adapter, View v, int position,long id) {switcher.setImageResource(imgids[position]);}

第八步:

实现makeView()方法,为ImageView设置布局格式

@Overridepublic View makeView() {// TODO Auto-generated method stub//创建ImageViewImageView i=new ImageView(this);//设置背景颜色i.setBackgroundColor(0xFF000000);//设置精度类型i.setScaleType(ImageView.ScaleType.FIT_CENTER);//设置布局参数i.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT));return i;}

第九步:

为Gallery添加Adapter并添加OnItemSelectedListener监听器

g.setAdapter(new ImageAdapter(this));g.setOnItemSelectedListener(this);

至此,全部,结束,运行结果如下

完整源代码:

package org.hualang.Gallery;import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.view.animation.AnimationUtils;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.Gallery.LayoutParams;
import android.widget.ViewSwitcher.ViewFactory;public class GalleryTest extends Activity implements OnItemSelectedListener,ViewFactory {private ImageSwitcher mSwitcher;private Integer[] mThumbIds = { R.drawable.thumb0,R.drawable.thumb1, R.drawable.thumb2,R.drawable.thumb3, R.drawable.thumb4,R.drawable.thumb5, R.drawable.thumb6,R.drawable.thumb7 };private Integer[] mImageIds = { R.drawable.img0, R.drawable.img1,R.drawable.img2, R.drawable.img3, R.drawable.img4,R.drawable.img5, R.drawable.img6, R.drawable.img7 };@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);requestWindowFeature(Window.FEATURE_NO_TITLE);setContentView(R.layout.main);mSwitcher = (ImageSwitcher) findViewById(R.id.switcher);mSwitcher.setFactory(this);mSwitcher.setInAnimation(AnimationUtils.loadAnimation(this,android.R.anim.fade_in));mSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this,android.R.anim.fade_out));Gallery g = (Gallery) findViewById(R.id.gallery);g.setAdapter(new ImageAdapter(this));g.setOnItemSelectedListener(this);}public class ImageAdapter extends BaseAdapter {public ImageAdapter(Context c) {mContext = c;}public int getCount() {return mThumbIds.length;}public Object getItem(int position) {return position;}public long getItemId(int position) {return position;}public View getView(int position, View convertView, ViewGroup parent) {ImageView i = new ImageView(mContext);i.setImageResource(mThumbIds[position]);i.setAdjustViewBounds(true);i.setLayoutParams(new Gallery.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));i.setBackgroundResource(R.drawable.picturefrom);return i;}private Context mContext;}@Overridepublic void onItemSelected(AdapterView<?> adapter, View v, int position,long id) {mSwitcher.setImageResource(mImageIds[position]);}@Overridepublic void onNothingSelected(AdapterView<?> arg0) {}@Overridepublic View makeView() {ImageView i = new ImageView(this);i.setBackgroundColor(0xFF000000);i.setScaleType(ImageView.ScaleType.FIT_CENTER);i.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));return i;}
}
<?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="fill_parent">
<ImageSwitcher android:id="@+id/switcher"android:layout_width="fill_parent"android:layout_height="fill_parent"android:layout_alignParentTop="true"android:layout_alignParentLeft="true"/>
<Gallery android:id="@+id/gallery"android:background="#55000000"android:layout_width="fill_parent"android:layout_height="60dp"android:layout_alignParentBottom="true"android:layout_alignParentLeft="true"android:gravity="center_vertical"android:spacing="16dp"/>
</RelativeLayout>

这篇关于Android UI控件系列:Gallery(画廊视图)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1128024

相关文章

HarmonyOS学习(七)——UI(五)常用布局总结

自适应布局 1.1、线性布局(LinearLayout) 通过线性容器Row和Column实现线性布局。Column容器内的子组件按照垂直方向排列,Row组件中的子组件按照水平方向排列。 属性说明space通过space参数设置主轴上子组件的间距,达到各子组件在排列上的等间距效果alignItems设置子组件在交叉轴上的对齐方式,且在各类尺寸屏幕上表现一致,其中交叉轴为垂直时,取值为Vert

Spring Security 从入门到进阶系列教程

Spring Security 入门系列 《保护 Web 应用的安全》 《Spring-Security-入门(一):登录与退出》 《Spring-Security-入门(二):基于数据库验证》 《Spring-Security-入门(三):密码加密》 《Spring-Security-入门(四):自定义-Filter》 《Spring-Security-入门(五):在 Sprin

Android实现任意版本设置默认的锁屏壁纸和桌面壁纸(两张壁纸可不一致)

客户有些需求需要设置默认壁纸和锁屏壁纸  在默认情况下 这两个壁纸是相同的  如果需要默认的锁屏壁纸和桌面壁纸不一样 需要额外修改 Android13实现 替换默认桌面壁纸: 将图片文件替换frameworks/base/core/res/res/drawable-nodpi/default_wallpaper.*  (注意不能是bmp格式) 替换默认锁屏壁纸: 将图片资源放入vendo

Android平台播放RTSP流的几种方案探究(VLC VS ExoPlayer VS SmartPlayer)

技术背景 好多开发者需要遴选Android平台RTSP直播播放器的时候,不知道如何选的好,本文针对常用的方案,做个大概的说明: 1. 使用VLC for Android VLC Media Player(VLC多媒体播放器),最初命名为VideoLAN客户端,是VideoLAN品牌产品,是VideoLAN计划的多媒体播放器。它支持众多音频与视频解码器及文件格式,并支持DVD影音光盘,VCD影

科研绘图系列:R语言扩展物种堆积图(Extended Stacked Barplot)

介绍 R语言的扩展物种堆积图是一种数据可视化工具,它不仅展示了物种的堆积结果,还整合了不同样本分组之间的差异性分析结果。这种图形表示方法能够直观地比较不同物种在各个分组中的显著性差异,为研究者提供了一种有效的数据解读方式。 加载R包 knitr::opts_chunk$set(warning = F, message = F)library(tidyverse)library(phyl

【生成模型系列(初级)】嵌入(Embedding)方程——自然语言处理的数学灵魂【通俗理解】

【通俗理解】嵌入(Embedding)方程——自然语言处理的数学灵魂 关键词提炼 #嵌入方程 #自然语言处理 #词向量 #机器学习 #神经网络 #向量空间模型 #Siri #Google翻译 #AlexNet 第一节:嵌入方程的类比与核心概念【尽可能通俗】 嵌入方程可以被看作是自然语言处理中的“翻译机”,它将文本中的单词或短语转换成计算机能够理解的数学形式,即向量。 正如翻译机将一种语言

android-opencv-jni

//------------------start opencv--------------------@Override public void onResume(){ super.onResume(); //通过OpenCV引擎服务加载并初始化OpenCV类库,所谓OpenCV引擎服务即是 //OpenCV_2.4.3.2_Manager_2.4_*.apk程序包,存

flume系列之:查看flume系统日志、查看统计flume日志类型、查看flume日志

遍历指定目录下多个文件查找指定内容 服务器系统日志会记录flume相关日志 cat /var/log/messages |grep -i oom 查找系统日志中关于flume的指定日志 import osdef search_string_in_files(directory, search_string):count = 0

从状态管理到性能优化:全面解析 Android Compose

文章目录 引言一、Android Compose基本概念1.1 什么是Android Compose?1.2 Compose的优势1.3 如何在项目中使用Compose 二、Compose中的状态管理2.1 状态管理的重要性2.2 Compose中的状态和数据流2.3 使用State和MutableState处理状态2.4 通过ViewModel进行状态管理 三、Compose中的列表和滚动

数据视图(AngularJS)

<!DOCTYPE html><html ng-app="home.controller"><head><meta charset="utf-8"><title>数据视图</title><link href="page/common/css/bootstrap.min.css" rel="stylesheet"><script src="page/common/js/angular.js"></