【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