【android】簡易實現橫向的ListView

眾所周知，android里面的ListView是豎着的。

如果想要橫向的話需要自定義一下ListView。

 

CSDN上面有個人描述了一下一個國外大神的自定義橫向ListVIew  請點擊 --> 這里

自己也試了試這個HorizontalListView，發現bug還是不少 ，比如UI更新的時候排版總是不很正常，有時候item間距很大，有時候item間距很小。這讓人很煩，所以就想着自己去實現以下簡單的橫向ListView

 

廢話不多說：

布局  layout

<LinearLayout
        android:id="@+id/imgContent"
        android:layout_width="fill_parent"
        android:layout_height="0dip"
        android:layout_weight="10"
        android:gravity="center_vertical"
        android:orientation="vertical" >

        <HorizontalScrollView
            android:layout_width="fill_parent"
            android:layout_weight="1"
            android:layout_height="0dip"
            android:background="#eee" >
            
            <LinearLayout
                android:id="@+id/thumbnailLinearLayout"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center_vertical"
                android:orientation="horizontal" >
            </LinearLayout>
        </HorizontalScrollView>
    </LinearLayout>

對，你沒有看錯。布局文件就這么簡單。還有個 horizontal_list_item 布局下面要用，但是里面就只有一個ImageView所以就沒貼出來。

橫向的ListView只需要一個 HorizontalScrollView和LinearLayout 就足夠了 。

 

但是你會有疑問了，僅僅這樣不能獲取到LinearLayout里面的item啊，不能獲取到item就不能給每個子View添加監聽。別着急，向下看。

 

activity代碼

//已經定義好的全局變量
listCount = 0;
                for(String imgUrl : imgUrlList){
                    
                    listCount++;
                    //加載布局
                    View view = mInflater.inflate(R.layout.horizontal_list_item,null);
                    //找到ImageView
                    ImageView thumImg = (ImageView)view.findViewById(R.id.img_list_item);
                    //設定圖片寬高（80*80） int w = getResources().getDimensionPixelOffset(R.dimen.thumnail_default_width);
                    int h = getResources().getDimensionPixelSize(R.dimen.thumnail_default_height);
                    
                    //圖片綁定設置
                    
                    ImageOptions imageOptions = new ImageOptions.Builder()
                    .setRadius(DensityUtil.dip2px(10))//ImageView圓角半徑
                    .setSize(w,h)
                    .setCrop(true)
                    .setImageScaleType(ScaleType.FIT_CENTER)
                    .setLoadingDrawableId(R.drawable.img_loading)//加載中默認顯示圖片
                    .setFailureDrawableId(R.drawable.img_fail)
                    .build();
                    //異步加載圖片
                    x.image().bind(thumImg, imgUrl, imageOptions);
                    
                    //添加到布局中
                    thumbnailLinearLayout.addView(view);
                }
                
                
                thumbnailLinearLayout.setOnTouchListener(new OnTouchListener() {
                    
                    @Override
                    public boolean onTouch(View v, MotionEvent event) {
                         //獲取到LinearLayout的寬度  注：在onCreat方法里面直接獲取是0 所以要動態的獲取 int width = thumbnailLinearLayout.getWidth();
                        //得到LinearLayout int itemCount = thumbnailLinearLayout.getChildCount();
                        //計算出每一個child的平均寬度 float itemWidth = width/itemCount*1.0f;
　　　　　　　　　　　　　　//得到點擊的X坐標 float touchX = event.getX(0);
                        
　　　　　　　　　　　　　　//用這個式子算出點擊坐標所在那個child上 （點擊的坐標除以每個child的寬度 就可以得出所在child的索引） 需要 +1 嗎？ int coverCount = (int) (touchX/itemWidth);
                        
　　　　　　　　　　　　　　//有了索引就能干一些事情了 
　　　　　　　　　　　　　　doSomething(coverCount);

                        
                        for(int i=0;i<itemCount;i++){
                            thumbnailLinearLayout.getChildAt(i).setBackgroundColor(Color.TRANSPARENT);
                        }
　　　　　　　　　　　　　　//添加背景顏色，方便區別 所點擊的那個child
                        thumbnailLinearLayout.getChildAt(coverCount).setBackgroundColor(Color.rgb(120, 120, 120));
                        return false;
                    }
                });

 

這段java代碼寫在activity的初始化控件里面。

重點在 thumbnailLinearLayout 設定setOnTouchListener 的方法里面 本來LinearLayout不能獲取到自己的item 。但是可以用child來代替。獲取到child和總長度以及touch的坐標（只需要X軸坐標）就能判定點下去的那個點相對於LinearLayout子View的索引了。

這只是一個簡單的橫向ListVIew ，能實現基本的 相冊預覽 功能。如果需要高級功能就自己自定義吧。

邏輯都在代碼注釋里面了。什么？看不懂？ QQ462195349