Show sản phẩm với Gallery Widget



Xem thêm nhiều bài nữa tại Lập trình Android


Giới thiệu:


Gallery là một layout widget được sử dụng để hiển thị các mục dữ liệu trong một danh sách cuộn ngang và vị trí lựa chọn hiện tại nằm giữa khung hình.


Mục tiêu:


Tạo một Gallery show điện thoại, trượt gallery thì chi tiết điện thoại sẽ được hiển thị ở hình lớn.







Chuẩn bị:


Giải nén gói down về. Chép các file hình trong source download vào thư mục res/drawable-ldpi.

Bước 1:


Thiết kế giao diện gồm 1 ImageView và 1 Gallery


Kéo các widget vào giao diện thiết bị





Tạo file atts.xml trong thư mục res/values có nội dung như sau:


[PHP]<?xml version="1.0" encoding="utf-8"?><resources> <declare-styleable name="Gallerynhatnghe"> <attr name="android:galleryItemBackground" /> </declare-styleable></resources>[/PHP]


Bước 2:


Tạo ra 2 mảng chứa hình nhỏ và hình lớn


[PHP]int ds_hinh[]={R.drawable.htc,R.drawable.iphone,R.drawable.noki alumia,R.drawable.samsunggalaxy,R.drawable.sonyacr o,R.drawable.sonyericsson};int ds_hinhchitiet[]={R.drawable.htc_anh2,R.drawable.iphone_anh2,R.dra wable.lumina_anh2,R.drawable.samsung_anh2,R.drawab le.xperia_anh2,R.drawable.sony_anh2};[/PHP]


Bước 3:



  • Tạo class myadapter kế thừa từ BaseAdapter.
  • Xây dựng tiếp các hàm implement là getCount, get_Item,getItemId.
  • Xây dựng tiếp hàm getView để trả về một ImageView




[PHP]class myadapter extends BaseAdapter { Context context; int mGalleryItemBackground; public myadapter(Context c) { this.context=c;TypedArray a = obtainStyledAttributes(R.styleable.Gallerynhatnghe ); mGalleryItemBackground = a.getResourceId( R.styleable.Gallerynhatnghe_android_galleryItemBac kground, 0); } @Override public int getCount() { // TODO Auto-generated method stub return ds_hinh.length; }
@Override public Object getItem(int arg0) { // TODO Auto-generated method stub return ds_hinh[arg0]; }
@Override public long getItemId(int arg0) { // TODO Auto-generated method stub return arg0; }
@Override public View getView(int arg0, View arg1, ViewGroup arg2) { // TODO Auto-generated method stub ImageView imageview = new ImageView(this.context); imageview.setImageResource(ds_hinh[arg0]); imageview.setScaleType(ImageView.ScaleType.FIT_XY) ; imageview.setLayoutParams(new Gallery.LayoutParams(100,89)); imageview.setBackgroundResource(mGalleryItemBackgr ound); return imageview; } }[/PHP]


Bước 4:


Gán Adapter cho gallery


[PHP]gallery.setAdapter(new myadapter(this));[/PHP]


Bước 5:


Bắt sự kiện cho gallery


[PHP]gallery.setOnItemSelectedListener(new OnItemSelectedListener(){
@Override public void onItemSelected(AdapterView<?> arg0, View arg1, int arg2, long arg3) { // TODO Auto-generated method stub imgview.setImageResource(ds_hinhchitiet[arg2]); }
@Override public void onNothingSelected(AdapterView<?> arg0) { // TODO Auto-generated method stub } });[/PHP]


Hoàn tất.

Chủ đề tương tự: