实现点击Item可让Item跳到屏幕中间的HorizontalScrollView

项目中经常会遇到这么个产品需求，就是横向的一个列表，可以滑动。

大家自然就想到了用Android 的HorizontalScrollView来实现。但是如果再加一个产品需求，就是点击一个item这个item就可以滑到屏幕的中间来显示。

那么怎么实现呢？

刚开始我想了好几个方案，都略微复杂，要做好多计算。而我奉行的原则是：任何觉得复杂的问题都必然有最简单的解决方案。

于是又想了想，确实让我想到了一个最简单的解决方案。代码如下：

/**
* weichenglin create in 15/9/15
*/
public class CenterShowHorizontalScrollView extends HorizontalScrollView {
private LinearLayout mShowLinear;

public CenterShowHorizontalScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
mShowLinear = new LinearLayout(context);
mShowLinear.setOrientation(LinearLayout.HORIZONTAL);
HorizontalScrollView.LayoutParams params = new HorizontalScrollView.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT);
mShowLinear.setGravity(Gravity.CENTER_VERTICAL);
this.addView(mShowLinear, params);
}

public void onClicked(View v) {
if (v.getTag(R.id.item_position) != null) {
int position = (Integer) v.getTag(R.id.item_position);
View itemView = mShowLinear.getChildAt(position);
int itemWidth = itemView.getWidth();
int screenWidth = Utils.getScreenWidth();

smoothScrollTo(itemView.getLeft() - (screenWidth / 2 - itemWidth / 2), 0);
}
}

public LinearLayout getLinear() {
return mShowLinear;
}

public void addItemView(View itemView, int position) {
itemView.setTag(R.id.item_position, position);
mShowLinear.addView(itemView);
}

}

注意上面的两点：第一个是View 的setTag方法本身是支持key、value的，但是key必须是R文件中的ID，所以这里我用的是R.id.item_position。这个是在ids.xml文件中定义的，比如这么写：

<item name="item_position" type="id" />

第二个是onClicked不是点击事件，而是被激发的一个事件，具体可见下面的代码。

===============================

那么在用上面的类时怎么用呢：

1、先在布局文件中引用：

<com.meilishuo.meimiao.views.CenterShowHorizontalScrollView
android:id="@+id/scroll_view"
android:layout_width="match_parent"
android:layout_height="@dimen/single_item_height"
android:scrollbars="none">

</com.meilishuo.meimiao.views.CenterShowHorizontalScrollView>

2、在Activity中findViewById：

CenterShowHorizontalScrollView mHScrollView = (CenterShowHorizontalScrollView) mShowLayout.findViewById(R.id.scroll_view);

3、去addView进入ScrollView中，点击事件在addView的时候加进去的，当然，你也可以在CenterShowHorizontalScrollView的时候传入一个onItemClickListener来外部接收这个点击事件，以使用情况而定：

for (int i = 0; i < mTimeList.size(); i++) {
final TextView titleItem = (TextView) View.inflate(getContext(), R.layout.work_time_title_item, null);
mHScrollView.addItemView(titleItem, i);
titleItem.setOnClickListener(this);
titleItem.setText(mTimeList.get(i).workDateText);

LinearLayout.LayoutParams titleParams = (LayoutParams) titleItem.getLayoutParams();
titleParams.leftMargin = middlePadding / 2;
titleParams.rightMargin = middlePadding / 2;
}

就这么简单。有问题联系我新浪微博：@弹棉花的孩子