推荐阅读http://chenzheng8975.iteye.com/blog/2061805
product_list_index.xml:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:umadsdk="http://schemas.android.com/apk/res/com.LoveBus" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="@color/white" android:orientation="vertical" > <LinearLayout android:id="@+id/linearLayout1" android:layout_width="fill_parent" android:layout_height="40dp" android:background="#FFFFFF" > <TextView android:id="@+id/text1" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1.0" android:gravity="center" android:text="销售" android:textColor="#000000" android:textSize="22.0dip" /> <View android:layout_width="2dip" android:layout_height="30dip" android:layout_gravity="center_vertical" android:background="#D7D7D7" /> <TextView android:id="@+id/text2" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1.0" android:gravity="center" android:text="价格" android:textColor="#000000" android:textSize="22.0dip" /> <View android:layout_width="2dip" android:layout_height="30dip" android:layout_gravity="center_vertical" android:background="#D7D7D7" /> <TextView android:id="@+id/text3" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1.0" android:gravity="center" android:text="新品" android:textColor="#000000" android:textSize="22.0dip" /> <View android:layout_width="2dip" android:layout_height="30dip" android:layout_gravity="center_vertical" android:background="#D7D7D7" /> <TextView android:id="@+id/text4" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1.0" android:gravity="center" android:text="促销" android:textColor="#000000" android:textSize="22.0dip" /> </LinearLayout> <ImageView android:id="@+id/cursor" android:layout_width="fill_parent" android:layout_height="wrap_content" android:scaleType="matrix" android:src="@drawable/line" /> <View android:layout_width="fill_parent" android:layout_height="1dip" android:layout_gravity="center_vertical" android:background="#aaaaaa" /> <!-- 搜索信息 --> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:gravity="center_vertical" android:orientation="horizontal" > <!-- 搜索按钮 --> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_marginLeft="22dp" android:src="@drawable/product_search" /> <EditText android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="8dp" android:layout_marginRight="22dp" android:text="关键字" android:textColor="#ACACAC" /> </LinearLayout> <android.support.v4.view.ViewPager android:id="@+id/vPager" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_weight="1.0" android:background="@color/white" android:flipInterval="30" android:persistentDrawingCache="animation" /> </LinearLayout>
product_list_detail.xml:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="@color/white" > <ImageView android:id="@+id/test_flower" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="8dp" /> <LinearLayout android:orientation="vertical" android:layout_width="wrap_content" android:layout_height="wrap_content"> <TextView android:id="@+id/product_title" android:layout_width="fill_parent" android:layout_height="wrap_content" android:textColor="@color/black" android:textSize="18dp" /> <LinearLayout android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content"> <TextView android:id="@+id/now_price" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textColor="#fd6600" android:textSize="25dp" /> <TextView android:id="@+id/old_price" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textColor="#989898" android:textSize="18dp" /> </LinearLayout> <LinearLayout android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content"> <TextView android:id="@+id/deliery" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical|left" android:textColor="#989898" android:textSize="15dp" /> <TextView android:id="@+id/pay_info" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center_horizontal" android:textColor="#989898" android:textSize="15dp" /> <TextView android:id="@+id/location_info" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical|right" android:textColor="#989898" android:textSize="15dp" /> </LinearLayout> </LinearLayout> <Button android:id="@+id/view_btn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="确认" android:layout_gravity="bottom|right" /> </LinearLayout>
product_list_view.xml:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="@color/white"> <ListView android:id="@+id/list_view" android:layout_width="fill_parent" android:layout_height="fill_parent" android:divider="#ffc9c9c9" android:dividerHeight="1px" android:layout_marginRight="15dp"/> </LinearLayout>
ProductList.java:
package com.weijie.app_user.activity.product; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import android.app.Activity; import android.content.Context; import android.graphics.BitmapFactory; import android.graphics.Color; import android.graphics.Matrix; import android.os.Bundle; import android.os.Parcelable; import android.support.v4.view.PagerAdapter; import android.support.v4.view.ViewPager; import android.support.v4.view.ViewPager.OnPageChangeListener; import android.util.DisplayMetrics; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.view.animation.Animation; import android.view.animation.TranslateAnimation; import android.widget.BaseAdapter; import android.widget.Button; import android.widget.ImageView; import android.widget.ListView; import android.widget.TextView; import com.weijie.app_user.R; public class ProductList extends Activity { private List<Map<String, Object>> mData; private ViewPager mPager;//页卡内容 private List<View> listViews; // Tab页面列表 private ImageView cursor;// 动画图片 private TextView t1, t2, t3,t4;// 页卡头标 private int offset = 0;// 动画图片偏移量 private int currIndex = 0;// 当前页卡编号 private int bmpW;// 动画图片宽度 @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); super.setContentView(R.layout.product_list_index); // 默认布局管理器 mData = getData(); InitImageView(); InitTextView(); InitViewPager(); } private List<Map<String, Object>> getData() { List<Map<String, Object>> list = new ArrayList<Map<String, Object>>(); Map<String, Object> map = new HashMap<String, Object>(); map.put("test_flower", R.drawable.test_flower); map.put("product_title", "红玫瑰花束鲜花预定合肥鲜花速递生日鲜花"); map.put("now_price", "¥98.00"); map.put("old_price", "¥188.00"); map.put("deliery", "顺丰"); map.put("pay_info", "2418人已付款"); map.put("location_info", "合肥包河"); list.add(map); map = new HashMap<String, Object>(); map.put("test_flower", R.drawable.test_flower); map.put("product_title", "红玫瑰花束鲜花预定合肥鲜花速递生日鲜花"); map.put("now_price", "¥98.00"); map.put("old_price", "¥188.00"); map.put("deliery", "顺丰"); map.put("pay_info", "2418人已付款"); map.put("location_info", "合肥包河"); list.add(map); map = new HashMap<String, Object>(); map.put("test_flower", R.drawable.test_flower); map.put("product_title", "红玫瑰花束鲜花预定合肥鲜花速递生日鲜花"); map.put("now_price", "¥98.00"); map.put("old_price", "¥188.00"); map.put("deliery", "顺丰"); map.put("pay_info", "2418人已付款"); map.put("location_info", "合肥包河"); list.add(map); return list; } /** * 初始化头标 */ private void InitTextView() { t1 = (TextView) findViewById(R.id.text1); t2 = (TextView) findViewById(R.id.text2); t3 = (TextView) findViewById(R.id.text3); t4 = (TextView) findViewById(R.id.text4); t1.setOnClickListener(new MyOnClickListener(0)); t2.setOnClickListener(new MyOnClickListener(1)); t3.setOnClickListener(new MyOnClickListener(2)); t4.setOnClickListener(new MyOnClickListener(3)); } /** * 初始化动画 */ private void InitImageView() { cursor = (ImageView) findViewById(R.id.cursor); bmpW = BitmapFactory.decodeResource(getResources(), R.drawable.line) .getWidth();// 获取图片宽度 DisplayMetrics dm = new DisplayMetrics(); getWindowManager().getDefaultDisplay().getMetrics(dm); int screenW = dm.widthPixels;// 获取分辨率宽度 offset = (screenW / 4 - bmpW) / 2;// 计算偏移量 Matrix matrix = new Matrix(); matrix.postTranslate(offset, 0); cursor.setImageMatrix(matrix);// 设置动画初始位置 } /** * 初始化ViewPager */ private void InitViewPager() { mPager = (ViewPager) findViewById(R.id.vPager); listViews = new ArrayList<View>(); LayoutInflater inflater = getLayoutInflater(); View view1 = inflater.inflate(R.layout.product_list_view, null); ListView mListView1 =(ListView) view1.findViewById(R.id.list_view); mListView1.setAdapter(new MyAdapter(this)); View view2 = inflater.inflate(R.layout.product_list_view, null); ListView mListView2 =(ListView) view2.findViewById(R.id.list_view); mListView2.setAdapter(new MyAdapter(this)); View view3 = inflater.inflate(R.layout.product_list_view, null); ListView mListView3 =(ListView) view3.findViewById(R.id.list_view); mListView3.setAdapter(new MyAdapter(this)); View view4 = inflater.inflate(R.layout.product_list_view, null); ListView mListView4 =(ListView) view4.findViewById(R.id.list_view); mListView4.setAdapter(new MyAdapter(this)); listViews.add(mListView1); listViews.add(mListView2); listViews.add(mListView3); listViews.add(mListView4); mPager.setAdapter(new MyPagerAdapter(listViews)); mPager.setOffscreenPageLimit(5); mPager.setCurrentItem(0); mPager.setOnPageChangeListener(new MyOnPageChangeListener()); } /** * ViewPager适配器 */ public class MyPagerAdapter extends PagerAdapter { public List<View> mListViews; public MyPagerAdapter(List<View> mListViews) { this.mListViews = mListViews; } @Override public void destroyItem(View arg0, int arg1, Object arg2) { ((ViewPager) arg0).removeView(mListViews.get(arg1)); } @Override public void finishUpdate(View arg0) { } @Override public int getCount() { return mListViews.size(); } @Override public Object instantiateItem(View arg0, int arg1) { ((ViewPager) arg0).addView(mListViews.get(arg1), 0); return mListViews.get(arg1); } @Override public boolean isViewFromObject(View arg0, Object arg1) { return arg0 == (arg1); } @Override public void restoreState(Parcelable arg0, ClassLoader arg1) { } @Override public Parcelable saveState() { return null; } @Override public void startUpdate(View arg0) { } } /** * 头标点击监听 */ public class MyOnClickListener implements View.OnClickListener { private int index = 0; public MyOnClickListener(int i) { index = i; } @Override public void onClick(View v) { mPager.setCurrentItem(index); } }; /** * 页卡切换监听 */ public class MyOnPageChangeListener implements OnPageChangeListener { int one = offset * 2 + bmpW;// 页卡1 -> 页卡2 偏移量 int two = one * 2;// 页卡1 -> 页卡3 偏移量 int three = one * 3; @Override public void onPageSelected(int arg0) { Animation animation = null; switch (arg0) { case 0: if (currIndex == 1) { animation = new TranslateAnimation(one, 0, 0, 0); } else if (currIndex == 2) { animation = new TranslateAnimation(two, 0, 0, 0); }else if (currIndex == 3) { animation = new TranslateAnimation(three, 0, 0, 0); } break; case 1: if (currIndex == 0) { animation = new TranslateAnimation(offset, one, 0, 0); } else if (currIndex == 2) { animation = new TranslateAnimation(two, one, 0, 0); }else if (currIndex == 3) { animation = new TranslateAnimation(three, one, 0, 0); } break; case 2: if (currIndex == 0) { animation = new TranslateAnimation(offset, two, 0, 0); } else if (currIndex == 1) { animation = new TranslateAnimation(one, two, 0, 0); } else if (currIndex == 3) { animation = new TranslateAnimation(three, two, 0, 0); } break; case 3: if (currIndex == 0) { animation = new TranslateAnimation(offset, three, 0, 0); } else if (currIndex == 1) { animation = new TranslateAnimation(one, three, 0, 0); } else if (currIndex == 2) { animation = new TranslateAnimation(two, three, 0, 0); } break; } currIndex = arg0; animation.setFillAfter(true);// True:图片停在动画结束位置 animation.setDuration(300); cursor.startAnimation(animation); } @Override public void onPageScrolled(int arg0, float arg1, int arg2) { } @Override public void onPageScrollStateChanged(int arg0) { } } public final class ViewHolder{ public ImageView test_flower; public TextView product_title; public TextView now_price; public TextView old_price; public TextView deliery; public TextView pay_info; public TextView location_info; } public class MyAdapter extends BaseAdapter{ private LayoutInflater mInflater; public MyAdapter(Context context){ this.mInflater = LayoutInflater.from(context); } @Override public int getCount() { // TODO Auto-generated method stub return mData.size(); } @Override public Object getItem(int arg0) { // TODO Auto-generated method stub return null; } @Override public long getItemId(int arg0) { // TODO Auto-generated method stub return 0; } @Override public View getView(int position, View convertView, ViewGroup parent) { ViewHolder holder = null; if (convertView == null) { holder=new ViewHolder(); convertView = mInflater.inflate(R.layout.product_list_detail, null); holder.product_title = (TextView)convertView.findViewById(R.id.product_title); holder.test_flower = (ImageView)convertView.findViewById(R.id.test_flower); holder.now_price = (TextView)convertView.findViewById(R.id.now_price); holder.old_price = (TextView)convertView.findViewById(R.id.old_price); holder.deliery = (TextView)convertView.findViewById(R.id.deliery); holder.pay_info = (TextView)convertView.findViewById(R.id.pay_info); holder.location_info = (TextView)convertView.findViewById(R.id.location_info); convertView.setTag(holder); }else { holder = (ViewHolder)convertView.getTag(); } holder.test_flower.setBackgroundResource((Integer)mData.get(position).get("test_flower")); holder.product_title.setText((String)mData.get(position).get("product_title")); holder.now_price.setText((String)mData.get(position).get("now_price")); holder.old_price.setText((String)mData.get(position).get("old_price")); holder.deliery.setText((String)mData.get(position).get("deliery")); holder.pay_info.setText((String)mData.get(position).get("pay_info")); holder.location_info.setText((String)mData.get(position).get("location_info")); return convertView; } } }