android-進階(1)- 圖片的橫向滑動,點擊查看圖片

Gallery 主要用於橫向顯示圖像列表,但是在android API 1.6以後就被廢棄了,取而代之的是HorizontalScrollView

HorizontalScrollView,顧名思義就是橫向滾動。它是一個框架佈局,可以放置一個完整內容的子佈局,一般使用橫向的LinearLayout作爲子視圖,使用戶可以滾動顯示其中的條目。

我在本文中實現的是滾動查看圖片:

佈局界面:用的是HorizontalScrollView,來顯示所有的圖片,查看圖片用的是ImageSwitcher控件

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
    
    <ImageSwitcher 
        android:id="@+id/imgSwit"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="#000000"/>

    <HorizontalScrollView
        android:id="@+id/HorizontalScrollView01"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="#5B5B5B"
        android:fadingEdgeLength="0.0dip"
        android:scrollbars="none" >

        <LinearLayout
            android:id="@+id/toolbar_items"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >
        </LinearLayout>
    </HorizontalScrollView>   
</FrameLayout>


代碼部分:

public class MainActivity extends Activity {

private LinearLayout toolbarItems;
private ImageSwitcher imgSwit;
private int current;//當前圖片的下標

int[] imagesID=new int[]{R.drawable.pic1,R.drawable.pic2,
 R.drawable.pic3,R.drawable.pic4,R.drawable.pic5,
 R.drawable.pic6,R.drawable.pic7,R.drawable.pic8,
 R.drawable.pic9,R.drawable.pic10};

ImageView[] imags;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        imgSwit=(ImageSwitcher) this.findViewById(R.id.imgSwit);
        toolbarItems=(LinearLayout) this.findViewById(R.id.toolbar_items);
        Animation animation = AnimationUtils.loadAnimation(this, R.anim.remove);
        animation.setInterpolator(new OvershootInterpolator());
        toolbarItems.startAnimation(animation);
        init();
    }


private void init() {
// ImageSwitcher必須設置一個viewfactory後纔可以查看圖片
imgSwit.setFactory(new ViewFactory() {
public View makeView() {
ImageView img=new ImageView(MainActivity.this);
img.setLayoutParams(new FrameLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));
img.setImageResource(imagesID[0]);
return img;
}
});

//設置ImageView[] 中的ImageView的屬性
imags=new ImageView[imagesID.length];
for(int i=0;i<imags.length;i++){
imags[i]=new ImageView(MainActivity.this);
imags[i].setImageResource(imagesID[i]);
imags[i].setId(imagesID[i]);//標記,在ImageClick()中用到
imags[i].setLayoutParams(new ViewGroup.LayoutParams(200, 200));
imags[i].setPadding(0, 2, 2, 2);
imags[i].setImageAlpha(100);//數值越小透明度越高,imags[i].setImageAlpha(255)是在api16的時候新出的
toolbarItems.addView(imags[i]);
imags[i].setOnClickListener(new ImageClick());
imags[0].setImageAlpha(255);
}

imgSwit.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
//顯示下一個圖片
imgSwit.setImageResource(imagesID[(++current)%imagesID.length]);
setAlpha(imags);
if(current==imags.length){
current=0;
}
imags[current].setImageAlpha(255);
}
});

}


/**
* 點擊HorizontalScrollView中的圖片
*/
    public class ImageClick implements OnClickListener{
public void onClick(View v) {
ImageView img=(ImageView) v;
for(int i=0;i<imags.length;i++){
if(img==imags[i]){
current=i;
break;
}
}
setAlpha(imags);
img.setImageAlpha(255);
imgSwit.setImageResource(v.getId());
}
   
    }
    
    /**
     * 把其他圖片設置上遮罩,只留當前圖片爲高亮
     * @param imags 存放ImageView的數組
     */
    private void setAlpha(ImageView[] imags) {
for(int i=0;i<imags.length;i++){
imags[i].setImageAlpha(100);
}

}
}



下載地址爲:http://download.csdn.net/detail/u010074054/8743149

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章