仿微信主页fragment

整理自己写过的代码，这个是一个最常见的fragment应用。现在大部分app的主页都zhem设计。那下面就贴上代码新手写的代码可能不规范的地方有点多，凑合看吧。

这个是我写的简易的样式demo的截图，

下面是代码

主页的布局这个是我后面改过文字的布局，文字和上面截图有点差别

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:paddingBottom="@dimen/activity_vertical_margin"    android:paddingLeft="@dimen/activity_horizontal_margin"    android:paddingRight="@dimen/activity_horizontal_margin"    android:paddingTop="@dimen/activity_vertical_margin"    tools:context="com.example.fragmentdemo.MainActivity" >    <com.example.fragmentdemo.NoScrollViewPager        android:id="@+id/vp_container"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_above="@+id/rg_tab_menu"        android:layout_alignParentTop="true" />    <View        android:layout_width="match_parent"        android:layout_height="1dip"        android:layout_above="@+id/rg_tab_menu"        android:background="#cdcdcd" />    <RadioGroup        android:id="@+id/rg_tab_menu"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_alignParentBottom="true"        android:background="#fff"        android:orientation="horizontal" >        <RadioButton            android:id="@+id/rb_tab_item_main"            android:layout_width="0dp"            android:layout_height="match_parent"            android:layout_weight="1"            android:button="@null"            android:checked="true"            android:drawablePadding="2dp"            android:gravity="center"            android:paddingBottom="3dp"            android:paddingTop="8dp"            android:text="主页"            android:textSize="12sp"            tools:text="主页" />        <RadioButton            android:id="@+id/rb_tab_item_maid2"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawablePadding="2dp"            android:gravity="center"            android:paddingBottom="3dp"            android:paddingTop="8dp"            android:text="主页2"            android:textSize="12sp" />        <RadioButton            android:id="@+id/rb_tab_item_maid3"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawablePadding="2dp"            android:gravity="center"            android:paddingBottom="3dp"            android:paddingTop="8dp"            android:text="主页3"            android:textSize="12sp" />        <RadioButton            android:id="@+id/rb_tab_item_maid4"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawablePadding="2dp"            android:gravity="center"            android:paddingBottom="3dp"            android:paddingTop="8dp"            android:text="主页4"            android:textSize="12sp" />        <RadioButton            android:id="@+id/rb_tab_item_maid5"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawablePadding="2dp"            android:gravity="center"            android:paddingBottom="3dp"            android:paddingTop="8dp"            android:text="主页5"            android:textSize="12sp" />    </RadioGroup></RelativeLayout>

这是主要的代码

package com.example.fragmentdemo;import android.support.v4.app.FragmentPagerAdapter;import android.support.v7.app.ActionBarActivity;import android.annotation.SuppressLint;import android.os.Bundle;import android.widget.RadioGroup;@SuppressLint("NewApi")public class MainActivity extends ActionBarActivity {private RadioGroup radiogroup;private NoScrollViewPager viewpager;private FragmentPagerAdapter adapter;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);radiogroup = (RadioGroup) findViewById(R.id.rg_tab_menu);viewpager = (NoScrollViewPager) findViewById(R.id.vp_container);adapter = new InnerFragmentPagerAdapter(getSupportFragmentManager());viewpager.setAdapter(adapter);InnerOnCheckedChangeListener listener = new InnerOnCheckedChangeListener();radiogroup.setOnCheckedChangeListener(listener);viewpager.setOffscreenPageLimit(5);}public void onPageScrollStateChanged(int arg0) {// TODO Auto-generated method stub}public void onPageScrolled(int arg0, float arg1, int arg2) {// TODO Auto-generated method stub}public void onPageSelected(int position) {switch (position) {case 0:radiogroup.check(R.id.rb_tab_item_main);break;case 1:radiogroup.check(R.id.rb_tab_item_maid2);break;case 2:radiogroup.check(R.id.rb_tab_item_maid3);break;case 3:radiogroup.check(R.id.rb_tab_item_maid4);break;case 4:radiogroup.check(R.id.rb_tab_item_maid5);break;}}private class InnerOnCheckedChangeListener implements RadioGroup.OnCheckedChangeListener {@Overridepublic void onCheckedChanged(RadioGroup group, int checkedId) {switch (checkedId) {case R.id.rb_tab_item_main:viewpager.setCurrentItem(0);break;case R.id.rb_tab_item_maid2:viewpager.setCurrentItem(1);break;case R.id.rb_tab_item_maid3:viewpager.setCurrentItem(2);break;case R.id.rb_tab_item_maid4:viewpager.setCurrentItem(3);break;case R.id.rb_tab_item_maid5:viewpager.setCurrentItem(4);break;}}}}

fragment的我都没怎么添加就是一个空白的创建在那里

package com.example.fragmentdemo;import android.support.v4.app.Fragment;import android.support.v7.app.ActionBarActivity;import android.os.Bundle;import android.view.LayoutInflater;import android.view.Menu;import android.view.MenuItem;import android.view.View;import android.view.ViewGroup;public class Fragment2 extends Fragment implements View.OnClickListener{  public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {        View view=inflater.inflate(R.layout.activity_fragment2,null);return view;}@Overridepublic void onClick(View v) {// TODO Auto-generated method stub}}

下面是ViewPager的代码

package com.example.fragmentdemo;import android.content.Context;import android.support.v4.view.ViewPager;import android.util.AttributeSet;import android.view.MotionEvent;public class NoScrollViewPager extends ViewPager {    private boolean noScroll = false;    public NoScrollViewPager(Context context, AttributeSet attrs) {        super(context, attrs);    }    public NoScrollViewPager(Context context) {        super(context);    }    public void setNoScroll(boolean noScroll) {        this.noScroll = noScroll;    }    @Override    public void scrollTo(int x, int y) {        super.scrollTo(x, y);    }    @Override    public boolean onTouchEvent(MotionEvent arg0) {        if (noScroll)            return false;        else            return super.onTouchEvent(arg0);    }    @Override    public boolean onInterceptTouchEvent(MotionEvent arg0) {        if (noScroll)            return false;        else            return super.onInterceptTouchEvent(arg0);    }    @Override    public void setCurrentItem(int item, boolean smoothScroll) {        super.setCurrentItem(item, smoothScroll);    }    @Override    public void setCurrentItem(int item) {        super.setCurrentItem(item);    }}

还有adapter

package com.example.fragmentdemo;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentPagerAdapter;public class InnerFragmentPagerAdapter extends FragmentPagerAdapter {public InnerFragmentPagerAdapter(FragmentManager fm) {super(fm);}@Overridepublic Fragment getItem(int position) {Fragment fragment = null;switch (position) {case 0:fragment = new Fragment1();break;case 1:fragment = new Fragment2();break;case 2:fragment = new Fragment3();break;case 3:fragment = new Fragment4();break;case 4:fragment = new Fragment5();break;}return fragment;}@Overridepublic int getCount() {return 5;}}

这样就差不多完成了，出来的效果就是上面我截图里面的样式。

还有设置图标和底部文字的代码我也都贴上

选中图片切换

<?xml version="1.0" encoding="utf-8"?><selector    xmlns:android="http://schemas.android.com/apk/res/android">    <item android:state_checked="false" android:drawable="@mipmap/main"/>    <item android:state_checked="true"  android:drawable="@mipmap/fangzi"/>    <item android:state_selected="true"  android:drawable="@mipmap/fangzi"/>    <item android:state_pressed="true"  android:drawable="@mipmap/fangzi"/></selector>

选中文字变色

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android"><item android:state_checked="true" android:color="@color/colorAccent"/><!-- not selected --><item android:state_checked="false" android:color="@color/grey1"/></selector>

关闭滑动切换加一句就好了

viewpager.setNoScroll(true);

还有就是点击按钮图片的大小，由于对radiobutton不是熟悉不懂怎么在布局里面自己改大小在网上找了个代码里面改的

//设航按钮的图片大小RadioGroup rg_tab_menu = (RadioGroup) findViewById(R.id.rg_tab_menu);RadioButton rb_tab_item_main = (RadioButton) findViewById(R.id.rb_tab_item_main);RadioButton rb_tab_item_service = (RadioButton) findViewById(R.id.rb_tab_item_main1);RadioButton rb_tab_item_maid = (RadioButton) findViewById(R.id.rb_tab_item_main3);RadioButton rb_tab_item_enjoy = (RadioButton) findViewById(R.id.rb_tab_item_main4);RadioButton rb_tab_item_myself = (RadioButton) findViewById(R.id.rb_tab_item_main5);Drawable drawableWeiHui = getResources().getDrawable(R.drawable.fragmant_main);//第一0是距左右边距离，第二0是距上下边距离，第三69长度,第四宽度drawableWeiHui.setBounds(0, 0, 60, 60);rb_tab_item_main.setCompoundDrawables(null, drawableWeiHui, null, null);Drawable drawableWeiHui2 = getResources().getDrawable(R.drawable.fragmant_serve);drawableWeiHui2.setBounds(0, 0, 60, 60);rb_tab_item_service.setCompoundDrawables(null, drawableWeiHui2, null, null);Drawable drawableWeiHui3 = getResources().getDrawable(R.drawable.fragmant_steward);drawableWeiHui3.setBounds(0, 0, 60, 60);rb_tab_item_maid.setCompoundDrawables(null, drawableWeiHui3, null, null);Drawable drawableWeiHui4 = getResources().getDrawable(R.drawable.fragmant_news);drawableWeiHui4.setBounds(0, 0, 60, 60);rb_tab_item_enjoy.setCompoundDrawables(null, drawableWeiHui4, null, null);Drawable drawableWeiHui5 = getResources().getDrawable(R.drawable.fragmant_amend);drawableWeiHui5.setBounds(0, 0, 60, 60);rb_tab_item_myself.setCompoundDrawables(null, drawableWeiHui5, null, null);

到这里代码就都贴完了附一张完成的效果图