项目中我们会经常用到底部导航栏,那么底部导航栏是怎么实现的呢?其实很简单:
我这里面抽取了一个商城类的项目demo,供大家参考:
activity代码如下:
public class MainActivity extends AppCompatActivity {
private LinearLayout mHomeLl;
private LinearLayout mCartLl;
private LinearLayout mMyLl;
private int selectId = -1;
private FragmentTransaction mFragmentTransaction;
private Fragment homeFragment,cartFragment,myFragment,currentFragment;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
private void initView() {
mHomeLl = (LinearLayout) findViewById(R.id.home_ll);
mCartLl = (LinearLayout) findViewById(R.id.cart_ll);
mMyLl = (LinearLayout) findViewById(R.id.my_ll);
changeFragment(0);
mHomeLl.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
changeFragment(0);
}
});
mCartLl.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
changeFragment(1);
}
});
mMyLl.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
changeFragment(2);
}
});
}
private void changeFragment(int i){
if(selectId != -1 && selectId == i){
return;
}
selectId = i;
if (mFragmentTransaction == null) {
mFragmentTransaction = getSupportFragmentManager().beginTransaction();
}
switch (i){
case 0:
if(homeFragment == null){
homeFragment = new HomeFragment();
}
switchFragment(homeFragment);
break;
case 1:
if(cartFragment == null){
cartFragment = new CartFragment();
}
switchFragment(cartFragment);
break;
case 2:
if(myFragment == null){
myFragment = new MyFragment();
}
switchFragment(myFragment);
break;
}
}
public void switchFragment(Fragment to) {
if (mFragmentTransaction == null) {
mFragmentTransaction = getSupportFragmentManager().beginTransaction();
}
if (currentFragment != to) {
if (currentFragment == null) {
mFragmentTransaction.add(R.id.fl_content, to).commit();
currentFragment = to;
mFragmentTransaction = null;
return;
}
if (!to.isAdded()) {
mFragmentTransaction.hide(currentFragment).add(R.id.fl_content, to).commit();
} else {
mFragmentTransaction.hide(currentFragment).show(to).commitAllowingStateLoss();
}
}
currentFragment = to;
mFragmentTransaction = null;
}
}
布局代码如下:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<FrameLayout
android:id="@+id/fl_content"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#dddddd"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal"
android:background="#ffffff"
>
<LinearLayout
android:id="@+id/home_ll"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:orientation="vertical"
>
<ImageView
android:layout_marginTop="12dp"
android:id="@+id/home_iv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/home"
android:layout_gravity="center"
/>
</LinearLayout>
<View
android:layout_width="1dp"
android:layout_height="35dp"
android:layout_gravity="center_vertical"
android:background="#cccccc"
>
</View>
<LinearLayout
android:id="@+id/cart_ll"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:orientation="vertical"
>
<ImageView
android:layout_marginTop="12dp"
android:id="@+id/cart_iv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/cart"
android:layout_gravity="center"
/>
</LinearLayout>
<View
android:layout_width="1dp"
android:layout_height="35dp"
android:layout_gravity="center_vertical"
android:background="#cccccc"
>
</View>
<LinearLayout
android:id="@+id/my_ll"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:orientation="vertical"
>
<ImageView
android:layout_marginTop="12dp"
android:id="@+id/my_iv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/my"
android:layout_gravity="center"
/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
上一张最终效果图:
里面的3张切片图请美工帮忙一下就好了,是不是so easy?^_^