Android App应用底部导航栏实现的一种方式

效果图:

dd

















代码实现:LinearLayout + TextView

package com.anyanyan.vmoive.activity;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentTransaction;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.FrameLayout;
import android.widget.TextView;

import com.anyanyan.vmoive.R;
import com.anyanyan.vmoive.fragment.Fragment1;
import com.anyanyan.vmoive.fragment.Fragment2;
import com.anyanyan.vmoive.fragment.Fragment3;
import com.anyanyan.vmoive.fragment.Fragment4;

import butterknife.BindView;
import butterknife.ButterKnife;

public class Main2Activity extends AppCompatActivity implements View.OnClickListener {

    @BindView(R.id.tv_tab1)
    TextView mTvTab1;
    @BindView(R.id.tv_tab2)
    TextView mTvTab2;
    @BindView(R.id.tv_tab3)
    TextView mTvTab3;
    @BindView(R.id.tv_tab4)
    TextView mTvTab4;
    @BindView(R.id.frameLayout)
    FrameLayout mFrameLayout;

    private Fragment fragment1, fragment2, fragment3, fragment4;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);
        ButterKnife.bind(this);
        initFirst();
        bindTabs();
    }

    private void initFirst() {
        mTvTab1.setSelected(true);
        if (fragment1 == null) {
            fragment1 = new Fragment1();
        }
        getSupportFragmentManager().beginTransaction().add(R.id.frameLayout, fragment1)
                .commitAllowingStateLoss();
    }

    private void setAllTabNormal() {
        mTvTab1.setSelected(false);
        mTvTab2.setSelected(false);
        mTvTab3.setSelected(false);
        mTvTab4.setSelected(false);
    }

    private void setAllFragmentHide(FragmentTransaction fragmentTransaction) {
        if (fragment1 != null) {
            fragmentTransaction.hide(fragment1);
        }
        if (fragment2 != null) {
            fragmentTransaction.hide(fragment2);
        }
        if (fragment3 != null) {
            fragmentTransaction.hide(fragment3);
        }
        if (fragment4 != null) {
            fragmentTransaction.hide(fragment4);
        }
    }

    private void bindTabs() {
        mTvTab1.setOnClickListener(this);
        mTvTab2.setOnClickListener(this);
        mTvTab3.setOnClickListener(this);
        mTvTab4.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.tv_tab1:
                setCurrentTab(1);
                break;
            case R.id.tv_tab2:
                setCurrentTab(2);
                break;
            case R.id.tv_tab3:
                setCurrentTab(3);
                break;
            case R.id.tv_tab4:
                setCurrentTab(4);
                break;
        }
    }

    public void setCurrentTab(int tabNo) {
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
        setAllTabNormal();
        setAllFragmentHide(transaction);
        switch (tabNo) {
            case 1:
                mTvTab1.setSelected(true);
                if (fragment1 == null) {
                    fragment1 = new Fragment1();
                    transaction.add(R.id.frameLayout, fragment1);
                } else {
                    transaction.show(fragment1);
                }
                break;
            case 2:
                mTvTab2.setSelected(true);
                if (fragment2 == null) {
                    fragment2 = new Fragment2();
                    transaction.add(R.id.frameLayout, fragment2);
                } else {
                    transaction.show(fragment2);
                }
                break;
            case 3:
                mTvTab3.setSelected(true);
                if (fragment3 == null) {
                    fragment3 = new Fragment3();
                    transaction.add(R.id.frameLayout, fragment3);
                } else {
                    transaction.show(fragment3);
                }
                break;
            case 4:
                mTvTab4.setSelected(true);
                if (fragment4 == null) {
                    fragment4 = new Fragment4();
                    transaction.add(R.id.frameLayout, fragment4);
                } else {
                    transaction.show(fragment4);
                }
                break;
        }
        transaction.commitAllowingStateLoss();
    }
}
布局文件:activity_main2.xml

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context="com.anyanyan.vmoive.activity.Main2Activity">

    <LinearLayout
        android:id="@+id/ll_tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_alignParentBottom="true">

        <TextView
            android:id="@+id/tv_tab1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:drawableTop="@drawable/tab1_menu"
            android:text="首页"
            android:gravity="center"
            android:drawablePadding="6dp"
            android:textColor="@drawable/tab1_text_color"/>

        <TextView
            android:id="@+id/tv_tab2"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:drawableTop="@drawable/tab2_menu"
            android:text="课程"
            android:gravity="center"
            android:drawablePadding="6dp"
            android:textColor="@drawable/tab1_text_color"/>

        <TextView
            android:id="@+id/tv_tab3"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:drawableTop="@drawable/tab3_menu"
            android:text="动态"
            android:gravity="center"
            android:drawablePadding="6dp"
            android:textColor="@drawable/tab1_text_color"/>

        <TextView
            android:id="@+id/tv_tab4"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:drawableTop="@drawable/tab4_menu"
            android:text="我的"
            android:gravity="center"
            android:drawablePadding="6dp"
            android:textColor="@drawable/tab1_text_color"/>

    </LinearLayout>
    <View
        android:id="@+id/divider"
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:background="@color/tab_normal"
        android:layout_above="@id/ll_tabs"/>
    <FrameLayout
        android:id="@+id/frameLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@id/divider"/>
</RelativeLayout>
TextView的文字颜色设置资源:drawable/tab1_text_color

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:color="@color/tab_selected"/>
    <item android:color = "@color/gray"/>
</selector>
在values文件夹中的colors文件中添加:

<color name="tab_selected">#FFEA5651</color>
<color name="tab_normal">@color/gray</color>
TextView的drawableTop资源:drawable/tab1_menu.xml(其他3个依次类推)

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="@mipmap/sgk_tab_course_selected"/>
    <item android:drawable="@mipmap/sgk_tab_course_normal"/>
</selector>
完成。






  • 3
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
Android实现底部导航栏方式有很多种,其中比较常用的方式是使用BottomNavigationView和Fragment组合实现。具体实现步骤如下: 1.在布局文件中添加BottomNavigationView组件,设置菜单项和样式。 2.在Activity中获取BottomNavigationView组件,并设置OnNavigationItemSelectedListener监听器,处理菜单项的点击事件。 3.创建多个Fragment用于显示不同的页面内容。 4.在Activity中使用FragmentManager和FragmentTransaction管理Fragment的切换,根据菜单项的点击事件切换到对应的Fragment。 以下是一个简单的示例代码: ```xml <!-- activity_main.xml --> <android.support.design.widget.CoordinatorLayout android:layout_width="match_parent" android:layout_height="match_parent"> <FrameLayout android:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent" /> <android.support.design.widget.BottomNavigationView android:id="@+id/navigation" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="bottom" app:menu="@menu/navigation" /> </android.support.design.widget.CoordinatorLayout> ``` ```java // MainActivity.java public class MainActivity extends AppCompatActivity { private BottomNavigationView mNavigationView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mNavigationView = findViewById(R.id.navigation); mNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() { @Override public boolean onNavigationItemSelected(@NonNull MenuItem item) { switch (item.getItemId()) { case R.id.navigation_home: switchFragment(new HomeFragment()); return true; case R.id.navigation_dashboard: switchFragment(new DashboardFragment()); return true; case R.id.navigation_notifications: switchFragment(new NotificationsFragment()); return true; } return false; } }); switchFragment(new HomeFragment()); } private void switchFragment(Fragment fragment) { FragmentManager fragmentManager = getSupportFragmentManager(); FragmentTransaction transaction = fragmentManager.beginTransaction(); transaction.replace(R.id.container, fragment); transaction.commit(); } } ``` ```java // HomeFragment.java public class HomeFragment extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.fragment_home, container, false); // TODO: 初始化页面内容 return view; } } ```

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值