Fragment与Viewpager其实都可以实现主界面的布局,但是推荐使用Fragment,因为Fragment对于后期的维护和管理比较有利;
Fragment其实和Viewpager实现的步骤是差不多的,首先看下Fragment的结构图
4个Fragment分开管理各个对应的布局文件
布局文件用FrameLayout引入Fragment布局
接下来就是activity文件了,代码中有备注也就不多说什么了,这个和Viewpager实现其实大同小异
package com.yongninggo.wechat;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import com.yongninggo.wechat.Fragment.Home_fragment;
import com.yongninggo.wechat.Fragment.Message_fragment;
import com.yongninggo.wechat.Fragment.Person_fragment;
import com.yongninggo.wechat.Fragment.Pond_fragment;
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
//定义所有的控件
private LinearLayout home_layout_view;
private LinearLayout message_layout_view;
private LinearLayout pond_layout_view;
private LinearLayout person_layout_view;
private ImageView home_image_view;
private ImageView message_image_view;
private ImageView pond_image_view;
private ImageView person_image_view;
//定义4个Fragment布局
private Fragment home;
private Fragment message;
private Fragment pond;
private Fragment person;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
inisview();
inisEvent();
setSelect(0); //设置首次启动应用显示的Fragment界面
}
//给4个LinearLayout添加点击事件
private void inisEvent() {
home_layout_view.setOnClickListener(this);
message_layout_view.setOnClickListener(this);
pond_layout_view.setOnClickListener(this);
person_layout_view.setOnClickListener(this);
}
//初始化所有控件
private void inisview() {
home_layout_view = (LinearLayout) findViewById(R.id.home_layout_view);
message_layout_view = (LinearLayout) findViewById(R.id.message_layout_view);
pond_layout_view = (LinearLayout) findViewById(R.id.pond_layout_view);
person_layout_view = (LinearLayout) findViewById(R.id.person_layout_view);
home_image_view = (ImageView) findViewById(R.id.home_image_view);
message_image_view = (ImageView) findViewById(R.id.message_image_view);
pond_image_view = (ImageView) findViewById(R.id.pond_image_view);
person_image_view = (ImageView) findViewById(R.id.person_image_view);
}
//设置点击后的图片颜色为亮色, 设置Fragment内容区域的
private void setSelect (int a){
FragmentManager fm = getSupportFragmentManager();
FragmentTransaction transaction = fm.beginTransaction();
HideFragment(transaction);
switch (a){
case 0 :
if (home == null){
home = new Home_fragment();
transaction.add(R.id.content,home);
} else {
transaction.show(home);
}
home_image_view.setImageResource(R.drawable.comui_tab_home_selected);
break;
case 1 :
if (message == null){
message = new Message_fragment();
transaction.add(R.id.content,message);
} else {
transaction.show(message);
}
message_image_view.setImageResource(R.drawable.comui_tab_message_selected);
break;
case 2 :
if (pond == null){
pond = new Pond_fragment();
transaction.add(R.id.content,pond);
} else {
transaction.show(pond);
}
pond_image_view.setImageResource(R.drawable.comui_tab_pond_selected);
break;
case 3 :
if (person == null){
person = new Person_fragment();
transaction.add(R.id.content,person);
} else {
transaction.show(person);
}
person_image_view.setImageResource(R.drawable.comui_tab_person_selected);
break;
default:
break;
}
transaction.commit();
}
private void HideFragment(FragmentTransaction transaction) {
if (home != null){
transaction.hide(home);
}
if (message != null){
transaction.hide(message);
}
if (pond != null){
transaction.hide(pond);
}
if (person != null){
transaction.hide(person);
}
}
//实现点击判断
@Override
public void onClick(View v) {
Resetimg();
switch (v.getId()){
case R.id.home_layout_view :
setSelect(0);
break;
case R.id.message_layout_view :
setSelect(1);
break;
case R.id.pond_layout_view :
setSelect(2);
break;
case R.id.person_layout_view :
setSelect(3);
break;
default:
break;
}
}
//将所有的图片初始化成灰色
private void Resetimg() {
home_image_view.setImageResource(R.drawable.comui_tab_home);
message_image_view.setImageResource(R.drawable.comui_tab_message);
pond_image_view.setImageResource(R.drawable.comui_tab_pond);
person_image_view.setImageResource(R.drawable.comui_tab_person);
}
}