📌  相关文章
📜  如何在Android的底部导航栏中添加浮动操作按钮?

📅  最后修改于: 2021-05-08 20:24:15             🧑  作者: Mango

浮动操作按钮是从普通的按钮有点不同的按钮。浮动操作按钮是在应用程序的用户界面中实现的,用于用户的主要操作(升级操作),而浮动操作按钮下的操作则由开发人员确定优先级。例如,将项目添加现有列表之类的操作。底部导航栏允许在应用程序的主要目的地之间移动。一些受欢迎的示例包括Instagram,WhatsApp等在本文中,我们将学习如何在android底部导航栏的中间添加浮动操作按钮(FAB)。下面给出了一个示例图像,以使您对本文中要做的事情有一个了解。请注意,我们将使用Kotlin语言实施此项目。

如何在Android的底部导航栏中添加浮动操作按钮?

分步实施

步骤1:创建一个新项目

要在Android Studio中创建新项目,请参阅如何在Android Studio中创建/启动新项目。请注意,选择Kotlin作为编程语言。

步骤2:将依赖项添加到build.gradle文件

在build.gradle(app)内添加Material Design Dependency。

添加材料设计依赖项后,单击立即同步

步骤3:将应用程序的主题更改为“材质组件”

以下是样式.xml文件的代码。

XML

      
    
    
  


XML


  
    
  
    
  
    
  
    
  
    
      


XML


  
    
          
        
            
                
  
                
            
        
    
  


XML


  
    
  
        
  
    
  
    
  


Kotlin
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import kotlinx.android.synthetic.main.activity_main.*
  
class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
  
        bottomNavigationView.background = null
        bottomNavigationView.menu.getItem(2).isEnabled = false
    }
}


步骤4:从Vector资产导入图标

转到res> drawable(右键单击)> new-> vector资产,然后从此处导入五个图标,分别是Home,Search,Person,Add,Settings。完成此步骤后,您的项目结构应如下所示。

步骤5:创建必须在底部导航视图中显示的菜单项

转到res(右键单击)> New(新建)> Android资源文件,然后在弹出菜单中选择要菜单的资源类型,然后将文件命名为bottom_nav_menu 。它应该看起来像这样。

bottom_nav_menu.xml内,添加要显示在底部应用程序栏中的项目。下面是bottom_nav_menu.xml文件的代码。

XML格式



  
    
  
    
  
    
  
    
  
    
      

步骤6:使用AndroidManifest.xml文件

更改AndroidManifest.xml文件中的主题。以下是AndroidManifest.xml文件的代码。

XML格式



  
    
          
        
            
                
  
                
            
        
    
  

步骤7:使用activity_main.xml文件

  • 将根布局更改为协调器布局
  • 添加底部应用程序栏。
  • 在“底部”应用程序内,该栏添加了底部的“导航视图”,并添加了我们在上一步中创建的菜单项。
  • 添加浮动动作按钮。

以下是activity_main.xml文件的代码。

XML格式



  
    
  
        
  
    
  
    
  

步骤8:使用MainActivity.kt文件

转到MainActivity.kt文件,并参考以下代码。下面是MainActivity.kt文件的代码。

科特林

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import kotlinx.android.synthetic.main.activity_main.*
  
class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
  
        bottomNavigationView.background = null
        bottomNavigationView.menu.getItem(2).isEnabled = false
    }
}

输出

浮动操作按钮到底部导航栏

想要一个节奏更快,更具竞争性的环境来学习Android的基础知识吗?
单击此处前往由我们的专家精心策划的指南,以使您立即做好行业准备!