AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

系出名门Android(8) - 控件(View)之TextSwitcher, Gallery, ImageSwitcher, GridView, ListView

2017-11-07 1112
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介：
[索引页]
[源码下载]
系出名门Android(8) - 控件(View)之TextSwitcher, Gallery, ImageSwitcher, GridView, ListView, ExpandableList


作者： webabcd


介绍
在 Android 中使用各种控件(View)
  • TextSwitcher - 文字转换器控件（改变文字时增加一些动画效果）
  • Gallery - 缩略图浏览器控件
  • ImageSwitcher - 图片转换器控件（改变图片时增加一些动画效果）
  • GridView - 网格控件
  • ListView - 列表控件
  • ExpandableList - 支持展开/收缩功能的列表控件


1、TextSwitcher 的 Demo
textswitcher.xml 
<? 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" >  

         < Button   android:id ="@+id/btnChange"   android:layout_width ="wrap_content"  
                 android:layout_height ="wrap_content"   android:text ="改变文字"   />  

        <!--  
                TextSwitcher - 文字转换器控件（改变文字时增加一些动画效果） 
        -->  
         < TextSwitcher   android:id ="@+id/textSwitcher"  
                 android:layout_width ="fill_parent"   android:layout_height ="wrap_content"   />  

</ LinearLayout >
 
_TextSwitcher.java
package  com.webabcd.view;  

import  java.util.Random;  

import  android.app.Activity;  
import  android.os.Bundle;  
import  android.view.View;  
import  android.view.animation.Animation;  
import  android.view.animation.AnimationUtils;  
import  android.widget.Button;  
import  android.widget.TextSwitcher;  
import  android.widget.TextView;  
import  android.widget.ViewSwitcher;  

public   class  _TextSwitcher   extends  Activity   implements  ViewSwitcher.ViewFactory {  

        @Override  
         protected   void  onCreate(Bundle savedInstanceState) {  
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState);  
                 this.setContentView(R.layout.textswithcer);  

                setTitle( "TextSwithcer");  

                 final  TextSwitcher switcher = (TextSwitcher) findViewById(R.id.textSwitcher);  
                 // 指定转换器的 ViewSwitcher.ViewFactory 
                switcher.setFactory( this);  
                  
                 // 设置淡入和淡出的动画效果 
                Animation in = AnimationUtils.loadAnimation( this, android.R.anim.fade_in);  
                Animation out = AnimationUtils.loadAnimation( this, android.R.anim.fade_out);  
                switcher.setInAnimation(in);  
                switcher.setOutAnimation(out);  

                 // 单击一次按钮改变一次文字 
                Button btnChange = (Button)   this.findViewById(R.id.btnChange);  
                btnChange.setOnClickListener( new  View.OnClickListener() {  
                        @Override  
                         public   void  onClick(View v) {  
                                switcher.setText(String.valueOf( new  Random().nextInt()));  
                        }  
                });  
        }  

         // 重写 ViewSwitcher.ViewFactory 的 makeView()，返回一个 View 
        @Override  
         public  View makeView() {  
                TextView textView =   new  TextView( this);  
                textView.setTextSize(36);  
                 return  textView;  
        }  
}
 
 
2、Gallery 的 Demo
gallery.xml
<? 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" >  

        <!--  
                Gallery - 缩略图浏览器控件 
                        spacing - 缩略图列表中各个缩略图之间的间距 
        -->  
         < Gallery   android:id ="@+id/gallery"   android:layout_width ="fill_parent"  
                 android:layout_height ="wrap_content"   android:spacing ="20px"   />  

</ LinearLayout >
 
_Gallery.java
package  com.webabcd.view;  

import  android.app.Activity;  
import  android.content.Context;  
import  android.os.Bundle;  
import  android.view.View;  
import  android.view.ViewGroup;  
import  android.widget.AdapterView;  
import  android.widget.BaseAdapter;  
import  android.widget.Gallery;  
import  android.widget.ImageView;  
import  android.widget.Toast;  
import  android.widget.Gallery.LayoutParams;  

public   class  _Gallery   extends  Activity {  

        @Override  
         protected   void  onCreate(Bundle savedInstanceState) {  
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState);  
                 this.setContentView(R.layout.gallery);  

                setTitle( "Gallery");  

                Gallery gallery = (Gallery) findViewById(R.id.gallery);  
                 // 为缩略图浏览器指定一个适配器 
                gallery.setAdapter( new  ImageAdapter( this));  
                 // 响应 在缩略图列表上选中某个缩略图后的 事件 
                gallery.setOnItemSelectedListener( new  AdapterView.OnItemSelectedListener() {  
                        @Override  
                         public   void  onItemSelected(AdapterView<?> parent, View v,  
                                         int  position,   long  id) {  
                                Toast.makeText(_Gallery. this, String.valueOf(position), Toast.LENGTH_SHORT).show();  
                        }  

                        @Override  
                         public   void  onNothingSelected(AdapterView<?> arg0) {  

                        }  
                });  
        }  

         // 继承 BaseAdapter 用以实现自定义的图片适配器 
         public   class  ImageAdapter   extends  BaseAdapter {  

                 private  Context mContext;  

                 public  ImageAdapter(Context context) {  
                        mContext = context;  
                }  

                 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 image =   new  ImageView(mContext);  

                        image.setImageResource(mThumbIds[position]);  
                        image.setAdjustViewBounds( true);  
                        image.setLayoutParams( new  Gallery.LayoutParams(  
                                        LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));  

                         return  image;  
                }  
        }  

         // 需要显示的图片集合 
         private  Integer[] mThumbIds = { R.drawable.icon01, R.drawable.icon02,  
                        R.drawable.icon03, R.drawable.icon04, R.drawable.icon05 };  
}
 
 
3、ImageSwitcher 的 Demo
imageswitcher.xml
<? 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" >  

         < Gallery   android:id ="@+id/gallery"   android:layout_width ="fill_parent"  
                 android:layout_height ="wrap_content"   android:spacing ="20px"   />  

        <!--  
                ImageSwitcher - 图片转换器控件（改变图片时增加一些动画效果） 
        -->  
         < ImageSwitcher   android:id ="@+id/imageSwitcher"  
                 android:layout_width ="fill_parent"   android:layout_height ="wrap_content"   />  

</ LinearLayout >
 
_ImageSwitcher.java
package  com.webabcd.view;  

import  android.app.Activity;  
import  android.content.Context;  
import  android.os.Bundle;  
import  android.view.View;  
import  android.view.ViewGroup;  
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.ViewSwitcher;  
import  android.widget.Gallery.LayoutParams;  

// 图片转换器的使用基本同文字转换器 
// 以下是一个用 ImageSwitcher + Gallery 实现的经典的图片浏览器的 Demo 
public   class  _ImageSwitcher   extends  Activity   implements  
                ViewSwitcher.ViewFactory {  

         private  ImageSwitcher mSwitcher;  

        @Override  
         protected   void  onCreate(Bundle savedInstanceState) {  
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState);  
                 this.setContentView(R.layout.imageswithcer);  

                setTitle( "ImageSwithcer");  

                mSwitcher = (ImageSwitcher) findViewById(R.id.imageSwitcher);  
                mSwitcher.setFactory( this);  
                mSwitcher.setInAnimation(AnimationUtils.loadAnimation( this,  
                                android.R.anim.fade_in));  
                mSwitcher.setOutAnimation(AnimationUtils.loadAnimation( this,  
                                android.R.anim.fade_out));  

                Gallery gallery = (Gallery) findViewById(R.id.gallery);  
                gallery.setAdapter( new  ImageAdapter( this));  
                gallery.setOnItemSelectedListener( new  AdapterView.OnItemSelectedListener() {  
                        @Override  
                         public   void  onItemSelected(AdapterView<?> parent, View v,  
                                         int  position,   long  id) {  
                                mSwitcher.setImageResource(mImageIds[position]);  
                        }  

                        @Override  
                         public   void  onNothingSelected(AdapterView<?> arg0) {  

                        }  
                });  
        }  

         public   class  ImageAdapter   extends  BaseAdapter {  

                 private  Context mContext;  

                 public  ImageAdapter(Context context) {  
                        mContext = context;  
                }  

                 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 image =   new  ImageView(mContext);  

                        image.setImageResource(mThumbIds[position]);  
                        image.setAdjustViewBounds( true);  
                        image.setLayoutParams( new  Gallery.LayoutParams(  
                                        LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));  

                         return  image;  
                }  
        }  

         private  Integer[] mThumbIds = { R.drawable.icon01, R.drawable.icon02,  
                        R.drawable.icon03, R.drawable.icon04, R.drawable.icon05 };  

         private  Integer[] mImageIds = { R.drawable.icon01, R.drawable.icon02,  
                        R.drawable.icon03, R.drawable.icon04, R.drawable.icon05 };  

        @Override  
         public  View makeView() {  
                ImageView image =   new  ImageView( this);  
                image.setMinimumHeight(200);  
                image.setMinimumWidth(200);  
                image.setScaleType(ImageView.ScaleType.FIT_CENTER);  
                image.setLayoutParams( new  ImageSwitcher.LayoutParams(  
                                LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));  
                 return  image;  
        }  
}
 
 
4、GridView 的 Demo
gridview.xml
<? xml   version ="1.0"   encoding ="utf-8" ?>  

<!--  
        GridView - 网格控件 
                numColumns="auto_fit" - 列数自适应 
                stretchMode - 缩放模式（stretchMode="columnWidth" - 缩放与列宽大小同步） 
-->  
< GridView   xmlns:android ="http://schemas.android.com/apk/res/android"  
         android:id ="@+id/gridView"   android:layout_width ="fill_parent"  
         android:layout_height ="fill_parent"   android:padding ="10px"  
         android:verticalSpacing ="10px"   android:horizontalSpacing ="10px"  
         android:numColumns ="auto_fit"   android:columnWidth ="60px"  
         android:stretchMode ="columnWidth"   android:gravity ="center" >  
</ GridView >
 
_GridView.java
package  com.webabcd.view;  

import  android.app.Activity;  
import  android.content.Context;  
import  android.os.Bundle;  
import  android.view.View;  
import  android.view.ViewGroup;  
import  android.widget.BaseAdapter;  
import  android.widget.GridView;  
import  android.widget.ImageView;  

public   class  _GridView   extends  Activity {  

        @Override  
         protected   void  onCreate(Bundle savedInstanceState) {  
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState);  
                 this.setContentView(R.layout.gridview);  

                setTitle( "GridView");  

                GridView gridView = (GridView) findViewById(R.id.gridView);  
                 // 指定网格控件的适配器为自定义的图片适配器 
                gridView.setAdapter( new  ImageAdapter( this));  
        }  

         // 自定义的图片适配器 
         public   class  ImageAdapter   extends  BaseAdapter {  

                 private  Context mContext;  

                 public  ImageAdapter(Context context) {  
                        mContext = context;  
                }  

                 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 imageView;  
                         if  (convertView ==   null) {  
                                imageView =   new  ImageView(mContext);  
                                imageView.setLayoutParams( new  GridView.LayoutParams(48, 48));  
                                imageView.setAdjustViewBounds( false);  
                                imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);  
                                imageView.setPadding(5, 5, 5, 5);  
                        }   else  {  
                                imageView = (ImageView) convertView;  
                        }  

                        imageView.setImageResource(mThumbIds[position]);  

                         return  imageView;  
                }  

                 // 网格控件所需图片数据的数据源 
                 private  Integer[] mThumbIds = { R.drawable.icon01, R.drawable.icon02,  
                                R.drawable.icon03, R.drawable.icon04, R.drawable.icon05 };  
        }  
}
 
 


     本文转自webabcd 51CTO博客，原文链接：http://blog.51cto.com/webabcd/342090 ，如需转载请自行联系原作者
文章标签：
Android开发
索引
关键词：
Android View
Android控件
Android ListView
Android gridview
Android控件listview
技术小胖子
目录
相关文章
Codelinghu
|
1月前
|
XML 存储 Java
浅谈Android的TextView控件
浅谈Android的TextView控件
Codelinghu
31 0
mrq4nk6ni2neg
|
2月前
|
XML 编解码 Android开发
安卓开发中的自定义视图控件
【9月更文挑战第14天】在安卓开发中，自定义视图控件是一种高级技巧，它可以让开发者根据项目需求创建出独特的用户界面元素。本文将通过一个简单示例，引导你了解如何在安卓项目中实现自定义视图控件，包括创建自定义控件类、处理绘制逻辑以及响应用户交互。无论你是初学者还是有经验的开发者，这篇文章都会为你提供有价值的见解和技巧。
mrq4nk6ni2neg
46 3
请看我回答~
|
3月前
|
前端开发 Android开发 开发者
安卓开发中的自定义视图：构建你的第一个控件
【8月更文挑战第26天】在安卓开发的浩瀚海洋中，自定义视图是一块充满魔力的乐土。它不仅是开发者展示创造力的舞台，更是实现独特用户体验的关键。本文将带你步入自定义视图的世界，从基础概念到实战应用，一步步教你如何打造自己的第一个控件。无论你是初学者还是有经验的开发者，这篇文章都将为你的开发之旅增添新的风景。
请看我回答~
58 0
众所周知
|
5月前
|
API Android开发 开发者
`RecyclerView`是Android API 21引入的UI组件，用于替代ListView和GridView
【6月更文挑战第26天】`RecyclerView`是Android API 21引入的UI组件，用于替代ListView和GridView。它提供高效的数据视图复用，优化的布局管理，支持多种布局（如线性、网格），并解耦数据、适配器和视图。RecyclerView的灵活性、性能（如局部刷新和动画支持）和扩展性使其成为现代Android开发的首选，特别是在处理大规模数据集时。
众所周知
65 2
一笑轮回~
|
4月前
|
XML 数据格式
Android-自定义三角形评分控件
Android-自定义三角形评分控件
一笑轮回~
41 0
好奇的菜鸟
|
5月前
|
XML Android开发 数据格式
Android基础控件介绍
Android基础控件介绍
好奇的菜鸟
44 0
一叶飘舟
|
5月前
|
Android开发
Android 自定义View 测量控件宽高、自定义viewgroup测量
Android 自定义View 测量控件宽高、自定义viewgroup测量
一叶飘舟
93 0
请看我回答~
|
3天前
|
开发框架 前端开发 Android开发
安卓与iOS开发中的跨平台策略
在移动应用开发的战场上，安卓和iOS两大阵营各据一方。随着技术的演进，跨平台开发框架成为开发者的新宠，旨在实现一次编码、多平台部署的梦想。本文将探讨跨平台开发的优势与挑战，并分享实用的开发技巧，帮助开发者在安卓和iOS的世界中游刃有余。
请看我回答~
16 1
游客qf4jmczx4xu2y
|
8天前
|
搜索推荐 Android开发 开发者
探索安卓开发中的自定义视图：打造个性化UI组件
【10月更文挑战第39天】在安卓开发的世界中，自定义视图是实现独特界面设计的关键。本文将引导你理解自定义视图的概念、创建流程，以及如何通过它们增强应用的用户体验。我们将从基础出发，逐步深入，最终让你能够自信地设计和实现专属的UI组件。
游客qf4jmczx4xu2y
25 4
请看我回答~
|
10天前
|
Android开发 Swift iOS开发
探索安卓与iOS开发的差异和挑战
【10月更文挑战第37天】在移动应用开发的广阔舞台上，安卓和iOS这两大操作系统扮演着主角。它们各自拥有独特的特性、优势以及面临的开发挑战。本文将深入探讨这两个平台在开发过程中的主要差异，从编程语言到用户界面设计，再到市场分布的不同影响，旨在为开发者提供一个全面的视角，帮助他们更好地理解并应对在不同平台上进行应用开发时可能遇到的难题和机遇。
请看我回答~
27 4

热门文章

最新文章

  • 1
    离线安装Eclipse的Android ADT开发插件
  • 2
    Android——Fragment介绍
  • 3
    android使用Activity
  • 4
    Android开发1——查找所需要出示权限的内容
  • 5
    0xA02 Android 10 源码分析：APK 的安装流程
  • 6
    大叔也说Xamarin~Android篇~Activity之间传递数组
  • 7
    传谷歌收紧 Android 厂商控制：力推自家应用
  • 8
    android-async-http框架的学习和使用
  • 9
    Android响应式编程RxAndroid（1）：简单例程
  • 10
    Android学习之四大组件（四）——BroadcastReceiver
  • 1
    kotlin开发安卓app，如何让布局自适应系统传统导航和全面屏导航
    130
  • 2
    kotlin开发安卓app，使用webivew 触发 onShowFileChooser， 但只能触发一次，第二次无法触发，是怎么回事。 如何解决
    365
  • 3
    Android面试题之View的invalidate方法和postInvalidate方法有什么区别
    59
  • 4
    Android深入Binder拦截问题分析
    63
  • 5
    安卓与iOS开发环境对比：选择适合你的平台
    48
  • 6
    安卓与iOS开发环境对比：选择合适的平台
    48
  • 7
    使用kotlin Jetpack Compose框架开发安卓app， webview中h5如何访问手机存储上传文件
    159
  • 8
    探索安卓应用开发的未来趋势
    47
  • 9
    安卓与iOS开发环境对比分析
    51
  • 10
    Android studio 安装以及第一个程序
    134

    • 相关课程

    更多
  • 开源Android容器化框架Atlas开发者指南

    • 相关电子书

    更多
  • 58同城Android客户端Walle框架演进与实践之路
  • Android组件化实现
  • 蚂蚁聚宝Android秒级编译——Freeline

    • 推荐镜像

    更多
  • android.googlesource.com
    • 下一篇
    无影云桌面