有一个姑凉 发表于 2013-8-28 16:19

第十三讲:用户界面 View(八)

679本讲内容:Gallery,GridView十五、Gallery 画廊Gallery是一个内部元素可以水平滚动,并且可以把当前选择的子元素定位在它中心的布局组件。我们还是直接看看例子的运行效果。http://www.apkbus.com/data/attachment/forum/201104/23/140654c9ecoebsjayeb4e9.png下面上代码,相关解释都放在代码里了。1、建立一个新项目 HelloGallery2、拷贝wallpaper_0.jpg…wallpaper_9.jpg 10个图片文件到res/drawable目录3、res/layout/main.xml文件的内容如下:    <?xml version="1.0" encoding="utf-8"?>   
<framelayout android:layout_height="fill_parent" android:layout_width="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/FrameLayout01">   
<imageview android:layout_height="fill_parent" android:layout_width="fill_parent" android:id="@+id/ImageView01" android:src="@drawable/wallpaper_0">   
</imageview>   
   
<gallery android:layout_height="wrap_content" android:layout_width="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/Gallery01" android:spacing="5dp">   
</gallery>   
</framelayout>其中我们使用FrameLayout来实现叠加效果,使用ImageView来显示大图,Gallery来展示画廊,android:spacing="5dp" 属性则是用来设置元素之间的间隔。4、在res/values/目录中新建一个attrs.xml内容如下:    <?xml version="1.0" encoding="UTF-8"?>   
<resources>   
      <declare -styleable="" name="HelloGallery">   
                <attr name="android:galleryItemBackground">   
      </attr></declare>   
</resources>5、在MainHelloGallery.java中的内容如下:    package android.basic.lesson13;   
   
import android.app.Activity;   
import android.content.Context;   
import android.content.res.TypedArray;   
import android.os.Bundle;   
import android.view.View;   
import android.view.ViewGroup;   
   
import android.widget.AdapterView;   
import android.widget.AdapterView.OnItemClickListener;   
import android.widget.BaseAdapter;   
import android.widget.Gallery;   
import android.widget.ImageView;   
import android.widget.Toast;   
   
public class MainHelloGallery extends Activity {   
   
      /** Called when the activity is first created. */   
      @Override   
      public void onCreate(Bundle savedInstanceState) {   
                super.onCreate(savedInstanceState);   
                setContentView(R.layout.main);   
   
                //定义UI组件   
                final ImageView iv= (ImageView)findViewById(R.id.ImageView01);   
                Gallery g = (Gallery) findViewById(R.id.Gallery01);   
   
                //设置图片匹配器   
                g.setAdapter(new ImageAdapter(this));   
   
                //设置AdapterView点击监听器,Gallery是AdapterView的子类   
                g.setOnItemClickListener(new OnItemClickListener() {   
   
                        @Override   
                        public void onItemClick(AdapterView<?> parent, View view,   
                                        int position, long id) {   
                              //显示点击的是第几张图片   
                              Toast.makeText(MainHelloGallery.this, "" + position,   
                                                Toast.LENGTH_LONG).show();   
                              //设置背景部分的ImageView显示当前Item的图片   
                              iv.setImageResource(((ImageView)view).getId());   
                        }   
                });   
      }   
   
      //定义继承BaseAdapter的匹配器   
      public class ImageAdapter extends BaseAdapter {   
   
                //Item的修饰背景   
                int mGalleryItemBackground;   
   
                //上下文对象   
                private Context mContext;   
   
                //图片数组   
                private Integer[] mImageIds = { R.drawable.wallpaper_0,   
                              R.drawable.wallpaper_1, R.drawable.wallpaper_2,   
                              R.drawable.wallpaper_3, R.drawable.wallpaper_4,   
                              R.drawable.wallpaper_5, R.drawable.wallpaper_6,   
                              R.drawable.wallpaper_7, R.drawable.wallpaper_8,   
                              R.drawable.wallpaper_9 };   
   
                //构造方法   
                public ImageAdapter(Context c){   
                        mContext = c;   
                        //读取styleable资源   
                TypedArray a = obtainStyledAttributes(R.styleable.HelloGallery);   
                mGalleryItemBackground = a.getResourceId(   
                        R.styleable.HelloGallery_android_galleryItemBackground, 0);   
                a.recycle();   
   
                }   
   
                //返回项目数量   
                @Override   
                public int getCount() {   
                        return mImageIds.length;   
                }   
   
                //返回项目   
                @Override   
                public Object getItem(int position) {   
                        return position;   
                }   
   
                //返回项目Id   
                @Override   
                public long getItemId(int position) {   
                        return position;   
                }   
   
                //返回视图   
                @Override   
                public View getView(int position, View convertView, ViewGroup parent) {   
   
                        ImageView iv = new ImageView(mContext);   
                        iv.setImageResource(mImageIds);   
                        //给生成的ImageView设置Id,不设置的话Id都是-1   
                        iv.setId(mImageIds);   
                        iv.setLayoutParams(new Gallery.LayoutParams(120, 160));   
                        iv.setScaleType(ImageView.ScaleType.FIT_XY);   
                        iv.setBackgroundResource(mGalleryItemBackground);   
                        return iv;   
                }   
   
      }   
}   
   我们点击某一张图片,会把该子元素的图片显示在放在后面一层的ImageView组件中。有兴趣的同学可以了解一下AdapterView的继承关系:http://www.apkbus.com/data/attachment/forum/201104/23/1406426x116qqpqtzv62pb.jpg十六、GridView 网格组件(待续)   
页: [1]
查看完整版本: 第十三讲:用户界面 View(八)