Android 應用開發筆記 – 拖動效果(Gallery)

新建一View,清單如下:

view_gallery.xml

[html]
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:orientation="vertical" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" > 
     
</LinearLayout> 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >
   
</LinearLayout>

 

 

    在面板拖拽圖標,然後更改相關屬性(Properties),如下:

[html]
<Gallery 
        android:id="@+id/gallery02" 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content"  
        android:layout_marginTop="30dp"/> 

<Gallery
        android:id="@+id/gallery02"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"/>

 

 

添加一按鈕,如下:

[html] v
<Button 
        android:id="@+id/btnReturn" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="166dp" 
        android:text="@string/btn1Caption" /> 

<Button
        android:id="@+id/btnReturn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="166dp"
        android:text="@string/btn1Caption" />

 

 

    整體佈局效果如下:

 

 

   把“Push me”按鈕,更改為切換按鈕。即實現切換功能。相關代碼請參考多個View切換!

 

    實現Gallery需要繼承BaseAdapter,我們命名為ImgAdapter。

    代碼清單如下:

[java]
package com.example.prjandroid; 
 
import android.content.Context; 
import android.content.res.TypedArray; 
import android.view.View; 
import android.view.ViewGroup; 
import android.widget.BaseAdapter; 
import android.widget.Gallery; 
import android.widget.ImageView; 
 
public class ImgAdapter extends BaseAdapter { 
             
    @Override 
    public int getCount() { 
        // TODO Auto-generated method stub  
        return null; 
    } 
 
    @Override 
    public Object getItem(int position) { 
        // TODO Auto-generated method stub  
        return position; 
    } 
 
    @Override 
    public long getItemId(int position) { 
        // TODO Auto-generated method stub  
        return position; 
    } 
 
    @Override 
    public View getView(int position, View convertView, ViewGroup parent) { 
        // TODO Auto-generated method stub  
         
        return null; 
    } 
 

package com.example.prjandroid;

import android.content.Context;
import android.content.res.TypedArray;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.ImageView;

public class ImgAdapter extends BaseAdapter {
   
 @Override
 public int getCount() {
  // TODO Auto-generated method stub
  return null;
 }

 @Override
 public Object getItem(int position) {
  // TODO Auto-generated method stub
  return position;
 }

 @Override
 public long getItemId(int position) {
  // TODO Auto-generated method stub
  return position;
 }

 @Override
 public View getView(int position, View convertView, ViewGroup parent) {
  // TODO Auto-generated method stub
  
  return null;
 }

}

 

 

如果想要放圖片,必須使用ImageView!

這時,我們把圖片放到res/drawable下(建議使用png格式文件)。

然後,再新建一xml文件,提供Gallery的背景。如下:

res/attrs.xml

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

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

 

 

聲明一圖片ID的數組:

[java]
// resource draw  
    private int[] resPics = new int[] { 
        R.drawable.emacs1, 
        R.drawable.emacs2, 
        R.drawable.emacs3, 
        R.drawable.emacs4, 
        R.drawable.emacs5, 
        R.drawable.emacs6, 
        R.drawable.emacs7, 
        R.drawable.emacs8, 
        R.drawable.emacs9, 
        R.drawable.emacs10 
    }; 

// resource draw
 private int[] resPics = new int[] {
  R.drawable.emacs1,
  R.drawable.emacs2,
  R.drawable.emacs3,
  R.drawable.emacs4,
  R.drawable.emacs5,
  R.drawable.emacs6,
  R.drawable.emacs7,
  R.drawable.emacs8,
  R.drawable.emacs9,
  R.drawable.emacs10
 };

 

 

在getView()方法中使用ImageView:

   

[java]
ImageView imgView = new ImageView(m_context); 
        imgView.setImageResource(resPics[position]); 
        imgView.setScaleType(ImageView.ScaleType.FIT_XY); 
        imgView.setLayoutParams(new Gallery.LayoutParams(163, 106)); 
         
        imgView.setBackgroundResource(m_galleryItemBackGround); 
         
        return imgView; 

ImageView imgView = new ImageView(m_context);
  imgView.setImageResource(resPics[position]);
  imgView.setScaleType(ImageView.ScaleType.FIT_XY);
  imgView.setLayoutParams(new Gallery.LayoutParams(163, 106));
  
  imgView.setBackgroundResource(m_galleryItemBackGround);
  
  return imgView;

 

其中,ImageView.ScaleType共八種:

1·ImageView.ScaleType.center:圖片位於視圖中間,但不執行縮放。

2·ImageView.ScaleType.CENTER_CROP 按統一比例縮放圖片(保持圖片的尺寸比例)便於圖片的兩維(寬度和高度)等於或者大於相應的視圖的維度

3·ImageView.ScaleType.CENTER_INSIDE按統一比例縮放圖片(保持圖片的尺寸比例)便於圖片的兩維(寬度和高度)等於或者小於相應的視圖的維度

4·ImageView.ScaleType.FIT_CENTER縮放圖片使用center

5·ImageView.ScaleType.FIT_END縮放圖片使用END

6·ImageView.ScaleType.FIT_START縮放圖片使用START

7·ImageView.ScaleType.FIT_XY縮放圖片使用XY

8·ImageView.ScaleType.MATRIX當繪制時使用圖片矩陣縮放

 

還有就是Context相當於windows中的Handle。

 

我們在構造這個類時,需要Context和初始化Gallery的屬性,其相關代碼如下:

[java] 
public ImgAdapter(Context context) { 
        // TODO Auto-generated constructor stub  
        m_context = context; 
        TypedArray typeArray =  
                m_context.obtainStyledAttributes(R.styleable.galleryThem); 
        m_galleryItemBackGround = typeArray.getResourceId( 
                R.styleable.galleryThem_android_galleryItemBackground, 0); 
    } 

public ImgAdapter(Context context) {
  // TODO Auto-generated constructor stub
  m_context = context;
  TypedArray typeArray =
    m_context.obtainStyledAttributes(R.styleable.galleryThem);
  m_galleryItemBackGround = typeArray.getResourceId(
    R.styleable.galleryThem_android_galleryItemBackground, 0);
 }

 

基本上這個適配類就是這個樣子瞭。

 

 

調用代碼和之前講的Spinner比較像!區別在於Spinner直接就傳的this,但是在必須傳主類.this(例如MainActivity.this)。

 

運行效果如下:

 

 

 

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *