分析京东“搜索京东商品/店铺”布局(三)

时间:2021-12-08 08:15:40

这次来实现上面两篇说的内容,首先布局文件:

<?xml version="1.0" encoding="utf-8"?>
<tu.CustomScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none" >

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:descendantFocusability="blocksDescendants"
android:orientation="vertical" >

<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scrollbars="none" >

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="50dp"
android:orientation="horizontal" >

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:paddingLeft="20dp"
android:paddingRight="10dp"
android:text="戴尔电脑"
android:textSize="18sp" >
</TextView>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:paddingLeft="20dp"
android:paddingRight="10dp"
android:text="雷电转hdmi"
android:textSize="18sp" >
</TextView>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:paddingLeft="20dp"
android:paddingRight="10dp"
android:text="隔尿垫"
android:textSize="18sp" >
</TextView>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:paddingLeft="20dp"
android:paddingRight="10dp"
android:text="圣诞帽子"
android:textSize="18sp" >
</TextView>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:paddingLeft="20dp"
android:paddingRight="10dp"
android:text="鬼吹灯"
android:textSize="18sp" >
</TextView>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:paddingLeft="20dp"
android:paddingRight="10dp"
android:text="加厚袜子"
android:textSize="18sp" >
</TextView>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:paddingLeft="20dp"
android:paddingRight="10dp"
android:text="衣物整理箱"
android:textSize="18sp" >
</TextView>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:text="剃须刀"
android:textSize="18sp" >
</TextView>
</LinearLayout>
</HorizontalScrollView>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >

<tu.ScrollListView
android:id="@+id/listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none" >
</tu.ScrollListView>
</LinearLayout>
</LinearLayout>

</tu.CustomScrollView>

public class CustomScrollView extends ScrollView {  
private GestureDetector mGestureDetector;

public CustomScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
mGestureDetector = new GestureDetector(context, new YScrollDetector());
setFadingEdgeLength(0);
}

@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
return super.onInterceptTouchEvent(ev) && mGestureDetector.onTouchEvent(ev);
}

// Return false if we're scrolling in the x direction
class YScrollDetector extends SimpleOnGestureListener {
@Override
public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
return Math.abs(distanceY) > Math.abs(distanceX);
}
}
}

public class ScrollListView extends ListView {
public ScrollListView(Context context) {
this(context, null);
}

public ScrollListView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}

public ScrollListView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}

@Override
public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int expandSpec = View.MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2, MeasureSpec.AT_MOST);
super.onMeasure(widthMeasureSpec, expandSpec);
}
}

主Activity文件:

public class HorizontalScrollViewActivity extends Activity implements
OnClickListener {
private ScrollListView listview;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.horizontal_scrollview);
listview = (ScrollListView) findViewById(R.id.listview);

List<String> data = new ArrayList<String>();
for (int i = 0; i < 20; i++) {
if (i < 6) {
data.add("小米新款" + i);
} else if (i < 11) {
data.add("联想新款" + i);
} else if (i < 16) {
data.add("爱国者新款" + i);
} else {
data.add("Nike新款" + i);
}
}
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, data);
listview.setAdapter(adapter);
}

@Override
public void onClick(View arg0) {

}
}

总结:

(1)注意几点android:descendantFocusability="blocksDescendants"的属性记得加上,为了防止ListView有数据的时候,跳到ListView的某条,而不显示HorizontalScrollView。

(2)这里的写法也要注意,如果不这么写,滑动久了,将会导致滑动不了。

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >

<tu.ScrollListView
android:id="@+id/listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none" >
</tu.ScrollListView>
</LinearLayout>