首先是布局,主页面的布局:
实现的是底部四个按钮,点击按钮切换frament
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <FrameLayout android:id="@+id/frament" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="18" ></FrameLayout> <RadioGroup android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:gravity="center" > <RadioButton android:id="@+id/manhua" android:layout_width="50dp" android:layout_weight="1" android:layout_height="match_parent" android:button="@null" android:gravity="center" android:drawableTop="@drawable/selector1" android:checked="true" android:textColor="@color/huang" android:text="漫画" android:textSize="13sp" android:onClick="Mh" /> <RadioButton android:id="@+id/faxian" android:layout_width="50dp" android:layout_weight="1" android:layout_height="match_parent" android:button="@null" android:gravity="center" android:drawableTop="@drawable/selector2" android:text="发现" android:textSize="13sp" android:textColor="@color/hei" android:onClick="Fx" /> <RadioButton android:id="@+id/shequ" android:layout_width="50dp" android:layout_weight="1" android:layout_height="match_parent" android:button="@null" android:gravity="center" android:drawableTop="@drawable/selector3" android:text="V社区" android:textColor="@color/hei" android:textSize="13sp" android:onClick="Sq" /> <RadioButton android:id="@+id/wode" android:layout_weight="1" android:layout_width="50dp" android:layout_height="match_parent" android:button="@null" android:textColor="@color/hei" android:gravity="center" android:drawableTop="@drawable/selector4" android:text="我的" android:textSize="13sp" android:onClick="Wd" /> </RadioGroup> </LinearLayout> 布局中有点击切换图片与字体颜色的功能 图片的转换,在drawble下建立xml文件,例如:<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android" > <!--点击后展示的图片--> <item android:state_checked="true" android:drawable="@drawable/ic_tabbar_home_pressed"></item> <!--未点击展示图--> <item android:state_checked="false" android:drawable="@drawable/ic_tabbar_home_normal"></item> </selector>字体颜色就是在color下添加自己要用的颜色,然后调用
下面要建立四个Fragment页,因为代码一样,下面只列举一个,只要复制过去改一下名字跟布局就OK了public class WodeActivity extends Fragment{ @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.wode_xml,container,false); return view; } }
mainActivity中的核心代码public class MyActivity extends FragmentActivity{ //fragment private ManhuaActivity manhua; private FaxianActivity faxian; private ShequActivity shequ; private WodeActivity wode; // RadioButton private RadioButton b1,b2,b3,b4; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.layout); //获取按钮id b1 = (RadioButton)findViewById(R.id.manhua); b2 = (RadioButton)findViewById(R.id.faxian); b3 = (RadioButton)findViewById(R.id.shequ); b4 = (RadioButton)findViewById(R.id.wode); //创建fragment对象 manhua = new ManhuaActivity(); faxian = new FaxianActivity(); shequ = new ShequActivity(); wode = new WodeActivity(); //设置默认页 getSupportFragmentManager() .beginTransaction() .replace(R.id.frament,manhua) .commit(); } //下面就是四个按钮的点击事件 public void Mh(View v){ //展示fragment页 getSupportFragmentManager() .beginTransaction() .replace(R.id.frament,manhua) .commit(); //切换字体颜色 b1.setTextColor(getResources().getColor(R.color.huang)); b2.setTextColor(getResources().getColor(R.color.hei)); b3.setTextColor(getResources().getColor(R.color.hei)); b4.setTextColor(getResources().getColor(R.color.hei)); } public void Fx(View v){ getSupportFragmentManager() .beginTransaction() .replace(R.id.frament,faxian) .commit(); b1.setTextColor(getResources().getColor(R.color.hei)); b2.setTextColor(getResources().getColor(R.color.huang)); b3.setTextColor(getResources().getColor(R.color.hei)); b4.setTextColor(getResources().getColor(R.color.hei)); } public void Sq(View v){ getSupportFragmentManager() .beginTransaction() .replace(R.id.frament,shequ) .commit(); b1.setTextColor(getResources().getColor(R.color.hei)); b2.setTextColor(getResources().getColor(R.color.hei)); b3.setTextColor(getResources().getColor(R.color.huang)); b4.setTextColor(getResources().getColor(R.color.hei)); } public void Wd(View v){ getSupportFragmentManager() .beginTransaction() .replace(R.id.frament,wode) .commit(); b3.setTextColor(getResources().getColor(R.color.hei)); b2.setTextColor(getResources().getColor(R.color.hei)); b1.setTextColor(getResources().getColor(R.color.hei)); b4.setTextColor(getResources().getColor(R.color.huang)); } }效果图: