Android项目 一

用viewpager+fragment做我们的主界面是很好的选择

 <LinearLayout            android:layout_width="match_parent"            android:layout_height="match_parent"            android:background="#FFFFFF"            android:orientation="vertical" >            <LinearLayout                android:layout_width="fill_parent"                android:layout_height="wrap_content"                android:background="#63B8FF"                android:orientation="vertical" >                <FrameLayout                    android:layout_width="match_parent"                    android:layout_height="wrap_content" >                    <com.red.view.CircleImageView                        android:id="@+id/cv1"                        android:layout_width="40dp"                        android:layout_height="40dp"                        android:layout_marginBottom="3dp"                        android:layout_marginLeft="5dp"                        android:layout_marginTop="4dp" />                    <TextView                        android:id="@+id/textView5"                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:layout_gravity="center_vertical"                        android:layout_marginLeft="48dp"                        android:text="登录"                        android:textColor="#FFFFFF" />                    <ImageView                        android:id="@+id/imageView1"                        android:layout_width="45dp"                        android:layout_height="45dp"                        android:layout_gravity="right"                        android:layout_marginRight="5dp"                        android:src="@drawable/abc_ic_menu_moreoverflow_mtrl_alpha" />                </FrameLayout>            </LinearLayout>            <com.red.smilepeople.Indicator                android:id="@+id/indicator1"                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:paddingBottom="10dp"                android:paddingTop="10dp"                android:weightSum="4"                indicator:colors="#FF0000" >                <TextView                    android:id="@+id/textView1"                    android:layout_width="0dip"                    android:layout_height="wrap_content"                    android:layout_marginLeft="0dp"                    android:layout_marginRight="0dp"                    android:layout_weight="1"                    android:gravity="center_horizontal"                    android:text="冷笑话"                    />                <TextView                    android:id="@+id/textView2"                    android:layout_width="0dip"                    android:layout_height="wrap_content"                    android:layout_marginLeft="0dp"                    android:layout_marginRight="0dp"                    android:layout_weight="1"                    android:gravity="center_horizontal"                    android:text="正能量" />                <TextView                    android:id="@+id/textView3"                    android:layout_width="0dip"                    android:layout_height="wrap_content"                    android:layout_marginLeft="0dp"                    android:layout_marginRight="0dp"                    android:layout_weight="1"                    android:gravity="center_horizontal"                    android:text="精华" />                <TextView                    android:id="@+id/textView4"                    android:layout_width="0dip"                    android:layout_height="wrap_content"                    android:layout_marginLeft="0dp"                    android:layout_marginRight="0dp"                    android:layout_weight="1"                    android:gravity="center_horizontal"                    android:text="许愿" />            </com.red.smilepeople.Indicator>            <android.support.v4.view.ViewPager                android:id="@+id/container"                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:background="#eeeeeb" />        </LinearLayout>

在这里，我们完成了首页的布局，Indicator是我们重写的一种样式，我们可以直接导入使用，它的效果是会在滑动的时候，在我们的Tab下绘制一个长方形。
Indicator 类

public class Indicator extends LinearLayout{   private Paint mPaint;   private int mLeft;   private int mTop;   private int mWidth;   private int mHeight=5;   private int mColor;   private int mChildCount;    public Indicator(Context context, AttributeSet attrs) {        super(context, attrs);        setBackgroundColor(Color.TRANSPARENT);        TypedArray ta=context.obtainStyledAttributes( attrs, R.styleable.Indicator, 0,0);        mColor = ta.getColor(R.styleable.Indicator_colors, 0X0000FF);          ta.recycle();          // 初始化paint          mPaint = new Paint();          mPaint.setColor(mColor);          mPaint.setAntiAlias(true);      }     protected void onFinishInflate() {              super.onFinishInflate();              mChildCount = getChildCount();  // 获取子item的个数          }          @Override          protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {              super.onMeasure(widthMeasureSpec, heightMeasureSpec);              mTop = getMeasuredHeight(); // 测量的高度即指示符的顶部位置              int width = getMeasuredWidth(); // 获取测量的总宽度              int height = mTop + mHeight; // 重新定义一下测量的高度              mWidth = width / mChildCount; // 指示符的宽度为总宽度/item的个数              setMeasuredDimension(width, height);          }          /**          * 指示符滚动          * @param position 现在的位置          * @param offset  偏移量 0 ~ 1          */          public void scroll(int position, float offset) {              mLeft = (int) ((position + offset) * mWidth);              invalidate();          }          @Override          protected void onDraw(Canvas canvas) {              // 圈出一个矩形              Rect rect = new Rect(mLeft, mTop, mLeft + mWidth, mTop + mHeight);              canvas.drawRect(rect, mPaint); // 绘制该矩形              super.onDraw(canvas);          }      }  

然后我们可以在我们的主界面MainActivity类中注册我们的viewpager监听事件，监听滑动

mContainer.setAdapter( new MyViewPagerAdapter(getSupportFragmentManager()));          mContainer.setOnPageChangeListener(new OnPageChangeListener() {              public void onPageSelected(int position) {              }              public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {                  mIndicator.scroll(position, positionOffset);              }              public void onPageScrollStateChanged(int position) {              }          });      }      public class MyViewPagerAdapter extends FragmentPagerAdapter{        public MyViewPagerAdapter(FragmentManager fm) {            super(fm);            // TODO Auto-generated constructor stub        }        public Fragment getItem(int arg0) {            return fragmentlist.get(arg0);        }        @Override        public int getCount() {            return fragmentlist.size();        }        @Override        public CharSequence getPageTitle(int position) {            // TODO Auto-generated method stub            return  (CharSequence) mViews.get(position);        }    }

完成到这里我们就完成了主界面的四个页面的滑动。
。。是我的过错，现在补上效果图，黑色框包含的就是我们实现的效果，可以滑动四个页面