Android的GridView和Gallery结合Demo
Demo介绍:首页是一个GridView加载图片,竖屏时显示3列图片,横屏时显示4列图片;并且对图片进行大小限制和加灰色边框处理。
点击某一张图片,会链接到Gallery页面,由于Android自带的Gallery控件滑动效果很不好(滑动一次会加载好多张图片),这里对Gallery进行了扩展,滑动一次只加载一张图片。
Demo效果如下:
1、首页Activity页面,GridViewActivity.java介绍:
public class GridViewActivity extends Activity {
private DisplayMetrics dm;
private GridImageAdapter ia;
private GridView g;
private int imageCol = ; @Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
// requestWindowFeature(Window.FEATURE_NO_TITLE);
ia = new GridImageAdapter(this);
setContentView(R.layout.mygridview);
g = (GridView) findViewById(R.id.myGrid);
g.setAdapter(ia);
g.setOnItemClickListener(new OnItemClick(this));
// 得到屏幕的大小
dm = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm); } /**
* 屏幕切换时进行处理 如果屏幕是竖屏,则显示3列,如果是横屏,则显示4列
*/
@Override
public void onConfigurationChanged(Configuration newConfig) {
try { super.onConfigurationChanged(newConfig);
// 如果屏幕是竖屏,则显示3列,如果是横屏,则显示4列
if (this.getResources().getConfiguration().orientation == Configuration.ORIENTATION_LANDSCAPE) {
imageCol = ;
} else if (this.getResources().getConfiguration().orientation == Configuration.ORIENTATION_PORTRAIT) {
imageCol = ;
}
g.setNumColumns(imageCol);
g.setAdapter(new ImageAdapter(this));
// ia.notifyDataSetChanged();
} catch (Exception ex) {
ex.printStackTrace();
}
} /**
*
* @author 空山不空 点击具体的小图片时,会链接到GridViewActivity页面,进行加载和展示
*/
public class OnItemClick implements OnItemClickListener {
public OnItemClick(Context c) {
mContext = c;
} @Override
public void onItemClick(AdapterView aview, View view, int position,
long arg3) {
Intent intent = new Intent();
intent.setClass(GridViewActivity.this, GalleryActivity.class);
intent.putExtra("position", position);
GridViewActivity.this.startActivity(intent);
} private Context mContext;
} /**
*
* @author 空山不空 设置GridView的图片适配器
*/
public class GridImageAdapter extends BaseAdapter { Drawable btnDrawable; public GridImageAdapter(Context c) {
mContext = c;
Resources resources = c.getResources();
btnDrawable = resources.getDrawable(R.drawable.bg);
} public int getCount() {
return ImageSource.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) {
ImageViewExt imageView; if (convertView == null) {
imageView = new ImageViewExt(mContext);
// 如果是横屏,GridView会展示4列图片,需要设置图片的大小
if (imageCol == ) {
imageView.setLayoutParams(new GridView.LayoutParams(
dm.heightPixels / imageCol - , dm.heightPixels
/ imageCol - ));
} else {// 如果是竖屏,GridView会展示3列图片,需要设置图片的大小
imageView.setLayoutParams(new GridView.LayoutParams(
dm.widthPixels / imageCol - , dm.widthPixels
/ imageCol - ));
}
imageView.setAdjustViewBounds(true);
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
} else {
imageView = (ImageViewExt) convertView;
}
imageView.setImageResource(ImageSource.mThumbIds[position]); return imageView;
} private Context mContext;
}
}
加载GridView页面,如果屏幕是竖屏,则显示3列,如果是横屏,则显示4列;并且显示的图片加上灰色边框,这里在适配器GridImageAdapter的getView方法里引用了ImageViewExt类来对图片进行处理,这个类扩展自ImageView;点击其中的某一张图片,会跳转到GalleryActivity页面。
2、ImageViewExt.java文件
/**
*
* @author 空山不空
* 扩展ImageView类,将图片加上边框,并且设置边框为灰色
*/
public class ImageViewExt extends ImageView {
//将图片加灰色的边框
private int color; public ImageViewExt(Context context) {
super(context);
// TODO Auto-generated constructor stub
color=Color.GRAY;
} public ImageViewExt(Context context, AttributeSet attrs) {
super(context, attrs);
// TODO Auto-generated constructor stub
color=Color.GRAY;
} @Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub super.onDraw(canvas);
//画边框
Rect rec=canvas.getClipBounds();
rec.bottom--;
rec.right--;
Paint paint=new Paint();
paint.setColor(color);
paint.setStrokeWidth();
paint.setStyle(Paint.Style.STROKE);
canvas.drawRect(rec, paint);
}
}
通过重载onDraw方法来画边框和设置边框颜色
3、相册GalleryActivity.java
/**
*
* @author 空山不空
* Gallery图片页面,通过Intent得到GridView传过来的图片位置,加载图片,再设置适配器
*/
public class GalleryActivity extends Activity {
public int i_position = ;
private DisplayMetrics dm; @Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.mygallery);
dm = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);
// 获得Gallery对象
GalleryExt g = (GalleryExt) findViewById(R.id.ga);
//通过Intent得到GridView传过来的图片位置
Intent intent = getIntent();
i_position = intent.getIntExtra("position", );
// 添加ImageAdapter给Gallery对象
ImageAdapter ia=new ImageAdapter(this);
g.setAdapter(ia);
g.setSelection(i_position); //加载动画
Animation an= AnimationUtils.loadAnimation(this,R.anim.scale );
g.setAnimation(an); }
}
这里有三点:
(1)、扩展Gallery组件,即GalleryExt控件,设置滑动一次只加载一张图片,并且, 如果是第一张图片时,向左滑动会提示“已到第一页”,如果是最后一张图片时,向右滑动会提示“已到第后页”
(2)、接收GridViewActivity页面传过来的参数position,通过这个参数找到具体的图片,通过ImageAdapter适配器加载
(3)、ImageAdapter图片适配器,用来加载图片
4、GalleryExt.java文件
/**
*
* @author 空山不空
* 扩展Gallery组件,设置滑动一次只加载一张图片,并且,
* 如果是第一张图片时,向左滑动会提示“已到第一页”
* 如果是最后一张图片时,向右滑动会提示“已到第后页”
*/
public class GalleryExt extends Gallery {
boolean is_first=false;
boolean is_last=false;
public GalleryExt(Context context) {
super(context);
// TODO Auto-generated constructor stub
} public GalleryExt(Context context,AttributeSet paramAttributeSet)
{
super(context,paramAttributeSet); } private boolean isScrollingLeft(MotionEvent e1, MotionEvent e2)
{
return e2.getX() > e1.getX();
} @Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float distanceX,
float distanceY) {
//通过重构onFling方法,使Gallery控件滑动一次只加载一张图片
//获取适配器
ImageAdapter ia=(ImageAdapter)this.getAdapter();
//得到当前图片在图片资源中的位置
int p=ia.getOwnposition();
//图片的总数量
int count=ia.getCount();
int kEvent;
if(isScrollingLeft(e1, e2)){
//Check if scrolling left
if(p==&&is_first){
//在第一页并且再往左移动的时候,提示
Toast.makeText(this.getContext(), "已到第一页", Toast.LENGTH_SHORT).show();
}else if(p==){
//到达第一页时,把is_first设置为true
is_first=true;
}else{
is_last=false;
} kEvent = KeyEvent.KEYCODE_DPAD_LEFT;
} else{
//Otherwise scrolling right
if(p==count-&&is_last){
Toast.makeText(this.getContext(), "已到最后一页", Toast.LENGTH_SHORT).show();
}else if( p==count-){
is_last=true;
}else{
is_first=false;
} kEvent = KeyEvent.KEYCODE_DPAD_RIGHT;
}
onKeyDown(kEvent, null);
return true;
}
5、ImageAdapter.java文件
/**
*
* @author 空山不空
* 图片适配器,用来加载图片
*/
public class ImageAdapter extends BaseAdapter {
//图片适配器
// 定义Context
private int ownposition; public int getOwnposition() {
return ownposition;
} public void setOwnposition(int ownposition) {
this.ownposition = ownposition;
} private Context mContext; // 定义整型数组 即图片源 // 声明 ImageAdapter
public ImageAdapter(Context c) {
mContext = c;
} // 获取图片的个数
public int getCount() {
return ImageSource.mThumbIds.length;
} // 获取图片在库中的位置
public Object getItem(int position) {
ownposition=position;
return position;
} // 获取图片ID
public long getItemId(int position) {
ownposition=position;
return position;
} public View getView(int position, View convertView, ViewGroup parent) { ownposition=position;
ImageView imageview = new ImageView(mContext);
imageview.setBackgroundColor(0xFF000000);
imageview.setScaleType(ImageView.ScaleType.FIT_CENTER);
imageview.setLayoutParams(new GalleryExt.LayoutParams(
LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT)); imageview.setImageResource(ImageSource.mThumbIds[position]);
// imageview.setAdjustViewBounds(true);
// imageview.setLayoutParams(new GridView.LayoutParams(320, 480));
// imageview.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
return imageview;
}
}
6、配置文件
(1)AndroidManifest.xml :
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.ajie"
android:versionCode="1"
android:versionName="1.0">
<application android:icon="@drawable/icon" android:label="@string/app_name">
<activity android:name=".GalleryActivity" android:label="@string/title" />
<activity android:name=".GridViewActivity" android:label="@string/app_name" android:configChanges="orientation|keyboardHidden" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
(2)mygridview.xml,即GridView页面
<?xml version="1.0" encoding="utf-8"?> <GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/myGrid"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:verticalSpacing="6dp"
android:numColumns=""
android:paddingTop="5dp"
android:stretchMode="columnWidth"
android:gravity="fill_vertical|fill_horizontal"
/>
(3)mygallery.xml,加载图片页面
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="match_parent" android:gravity="center"
android:padding="10dip">
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="wrap_content" android:padding="2dip"
android:background="#000000"> <com.ajie.GalleryExt android:id="@+id/ga"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:spacing="16dp" />
</RelativeLayout>
</LinearLayout>
Demo下载地址:<a href="http://files.cnblogs.com/fbsk/gridGalleryDemo.zip"> gridGalleryDemo.zip下载</a>
转自:http://www.cnblogs.com/fbsk/archive/2011/10/10/2205776.html