安卓开发，底部导航栏

XJSFDX_Ali2025-02-11 17:27

|----------------------------------------------------------------------------|----------------------------------------------------------------------------|----------------------------------------------------------------------------|
| | | |

1、创建导航栏图标

使用系统自带的矢量图库文件，鼠标右键点击res->New->Vector Asset

修改 Name , Clip art 和 Color

再创建一个

同样的方法再创建四个按钮

2、添加百分比布局依赖

app\build.gradle.kts 中添加百分比布局依赖，并点击Sync Now

XML 复制代码 
implementation("androidx.percentlayout:percentlayout:1.0.0")

3、创建三个Layout Resource File

1)home.xml

XML 复制代码 
<?xml version="1.0" encoding="utf-8"?>
<androidx.percentlayout.widget.PercentRelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_heightPercent="7%"
        android:layout_alignParentTop="true"
        android:text="主页"
        android:textSize="15pt"
        android:gravity="center"
        android:textColor="@color/black"
        android:background="#F0E7D8"/>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_heightPercent="7%"
        android:layout_alignParentBottom="true"
        android:background="#F0E7D8">
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
            <ImageButton
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#F0E7D8"
                android:src="@drawable/home_click"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="主页"
                android:gravity="center"/>
        </LinearLayout>
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
            <ImageButton
                android:id="@+id/learn"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#F0E7D8"
                android:src="@drawable/learn"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="学习"
                android:gravity="center"/>
        </LinearLayout>
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
            <ImageButton
                android:id="@+id/me"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#F0E7D8"
                android:src="@drawable/me"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="我"
                android:gravity="center"/>
        </LinearLayout>
    </LinearLayout>
</androidx.percentlayout.widget.PercentRelativeLayout>

2)learn.xml

XML 复制代码 
<?xml version="1.0" encoding="utf-8"?>
<androidx.percentlayout.widget.PercentRelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_heightPercent="7%"
        android:layout_alignParentTop="true"
        android:text="学习"
        android:textSize="15pt"
        android:gravity="center"
        android:textColor="@color/black"
        android:background="#F0E7D8"/>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_heightPercent="7%"
        android:layout_alignParentBottom="true"
        android:background="#F0E7D8">
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
            <ImageButton
                android:id="@+id/home"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#F0E7D8"
                android:src="@drawable/home"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="主页"
                android:gravity="center"/>
        </LinearLayout>
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
            <ImageButton
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#F0E7D8"
                android:src="@drawable/learn_click"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="学习"
                android:gravity="center"/>
        </LinearLayout>
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
            <ImageButton
                android:id="@+id/me"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#F0E7D8"
                android:src="@drawable/me"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="我"
                android:gravity="center"/>
        </LinearLayout>
    </LinearLayout>
</androidx.percentlayout.widget.PercentRelativeLayout>

3)me.xml

XML 复制代码 
<?xml version="1.0" encoding="utf-8"?>
<androidx.percentlayout.widget.PercentRelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_heightPercent="7%"
        android:layout_alignParentTop="true"
        android:text="我"
        android:textSize="15pt"
        android:gravity="center"
        android:textColor="@color/black"
        android:background="#F0E7D8"/>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_heightPercent="7%"
        android:layout_alignParentBottom="true"
        android:background="#F0E7D8">
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
            <ImageButton
                android:id="@+id/home"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#F0E7D8"
                android:src="@drawable/home"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="主页"
                android:gravity="center"/>
        </LinearLayout>
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
            <ImageButton
                android:id="@+id/learn"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#F0E7D8"
                android:src="@drawable/learn"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="学习"
                android:gravity="center"/>
        </LinearLayout>
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
            <ImageButton
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#F0E7D8"
                android:src="@drawable/me_click"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="我"
                android:gravity="center"/>
        </LinearLayout>
    </LinearLayout>
</androidx.percentlayout.widget.PercentRelativeLayout>

4、创建三个Java Class

1)Home.java

XML 复制代码 
package com.example.bottomnavigationbar;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageButton;
import androidx.appcompat.app.AppCompatActivity;
public class Home extends AppCompatActivity {
    private ImageButton learn,me;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.home);
        learn = findViewById(R.id.learn);
        me = findViewById(R.id.me);
        learn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intentToLearn = new Intent(Home.this,Learn.class);
                startActivity(intentToLearn);
                overridePendingTransition(0, 0); // 取消转场动画
            }
        });
        me.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intentToMe = new Intent(Home.this,Me.class);
                startActivity(intentToMe);
                overridePendingTransition(0, 0); // 取消转场动画
            }
        });
    }
}

2)Learn.java

XML 复制代码 
package com.example.bottomnavigationbar;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageButton;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
public class Learn extends AppCompatActivity {
    private ImageButton home,me;
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.learn);
        home = findViewById(R.id.home);
        me = findViewById(R.id.me);
        home.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intentToLearn = new Intent(Learn.this,Home.class);
                startActivity(intentToLearn);
                overridePendingTransition(0, 0); // 取消转场动画
            }
        });
        me.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intentToMe = new Intent(Learn.this,Me.class);
                startActivity(intentToMe);
                overridePendingTransition(0, 0); // 取消转场动画
            }
        });
    }
}

3)Me.java

XML 复制代码 
package com.example.bottomnavigationbar;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageButton;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
public class Me extends AppCompatActivity {
    private ImageButton home,learn;
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.me);
        home = findViewById(R.id.home);
        learn = findViewById(R.id.learn);
        learn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intentToLearn = new Intent(Me.this,Learn.class);
                startActivity(intentToLearn);
                overridePendingTransition(0, 0); // 取消转场动画
            }
        });
        home.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intentToMe = new Intent(Me.this,Home.class);
                startActivity(intentToMe);
                overridePendingTransition(0, 0); // 取消转场动画
            }
        });
    }
}

5、AndroidManifest.xml

XML 复制代码 
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">
    <application
        android:allowBackup="true"
        android:dataExtractionRules="@xml/data_extraction_rules"
        android:fullBackupContent="@xml/backup_rules"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.BottomNavigationBar"
        tools:targetApi="31">
        <activity
            android:name=".Home"
            android:exported="true">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name=".Learn"/>
        <activity android:name=".Me"/>
    </application>
</manifest>
相关推荐
superlls3 分钟前
（Spring）Spring Boot 中 @Valid 与全局异常处理器的联系详解
java·spring boot·后端
一念&10 分钟前
每日一个C语言知识：C 字符串
c语言·开发语言
0110_102427 分钟前
tauri + rust的环境搭建---初始化以及构建
开发语言·后端·rust
会开花的二叉树29 分钟前
C++微服务 UserServer 设计与实现
开发语言·c++·微服务
像风一样自由202032 分钟前
Rust Tokio vs Go net/http：云原生与嵌入式生态选型指南
开发语言·golang·rust
DuHz34 分钟前
C程序中的数组与指针共生关系
linux·c语言·开发语言·嵌入式硬件·算法
我星期八休息38 分钟前
C++智能指针全面解析：原理、使用场景与最佳实践
java·大数据·开发语言·jvm·c++·人工智能·python
摇滚侠38 分钟前
Spring Boot 3零基础教程，WEB 开发 整合 Thymeleaf 笔记36
java·spring boot·笔记
大猫会长42 分钟前
docker安装php+apache
java·开发语言
野生技术架构师1 小时前
JAVA 架构师面试题含答案：JVM+spring+ 分布式 + 并发编程
java·jvm·spring
热门推荐
01GitHub 镜像站点02BongoCat - 跨平台键盘猫动画工具03UV安装并设置国内源04Linux下V2Ray安装配置指南05GitLab 零基础入门指南：从安装到项目管理全流程06两千字总结：Codex 国内如何安装和使用的教程，以及如何设置中文回答07KGG转MP3工具|非KGM文件|解密音频082025软件测试面试八股文（含答案+文档）09荣耀手机2025年10月发布的新品Magic8比起Magic7，在硬件、性能、价格等上有什么区别，有什么优势10NVIDIA显卡驱动、CUDA、cuDNN 和 TensorRT 版本匹配指南