Kotlin Navigation开发
前言
其实小编之前一直都是用的Java来开发Android,但是工作需求,开始了Kotlin的编程,接触到了JetPack,发现其中的Navigation特别有意思,今天来给大家分享一下,我们做一个四个页面吧,从APP的 欢迎页面——>新手引导页面——>注册登录页面——>APP主页面 ,我来带大家入门,希望大家不要嫌弃
Navigation的优势
站在Fragment角度:不用把Fragment添加到集合里面去操作了,也不用去操作SupportFragmentManager了
站在Activity角度:可以减少大量的Activity,增加Fragment的使用,毕竟Fragment有更加详细的生命周期,更好的传递信息
站在开发者角度:Navigation的可视化导航图非常优美,导航路径清晰可见,让开发人员更方便的开发
Navigation开发流程
一.注入依赖
// Kotlin Navigationimplementation("androidx.navigation:navigation-fragment-ktx:2.5.1")implementation("androidx.navigation:navigation-ui-ktx:2.5.1")
二.创建Fragment和XML视图
在app/java/com.example.项目名目录下 先创建一个Fragment文件夹,在文件夹中创建4个Fragment,分别为 WelcomeFragment(欢迎页面),NoviceGuidePageFragment(新手引导页面),RegistrationLandingPageFragment(注册登录页面),MainFragment(APP主页面),具体如下图所示:
在app/res/layout文件夹下创建4个XML,分别为fragment_welcome.xml,fragment_novice_guide_page.xml,fragment_registration_landing_page.xml,fragment_main.xml,具体如下图所示:
WelcomeFragment.kt:
package com.example.siyi2.fragmentimport android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.fragment.app.Fragment
import com.example.siyi2.Rclass WelcomeFragment : Fragment() {override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {val view = inflater.inflate(R.layout.fragment_welcome, container, false)return view}}
fragment_welcome.xml:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"><TextViewandroid:id="@+id/to_fragment_novice_guide"android:layout_width="match_parent"android:layout_height="match_parent"android:text="欢迎页面"android:textSize="30dp"android:textColor="@color/black"android:gravity="center"/></androidx.constraintlayout.widget.ConstraintLayout>
NoviceGuidePageFragment.kt:
package com.example.siyi2.fragmentimport android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.TextView
import androidx.fragment.app.Fragment
import androidx.navigation.Navigation
import com.example.siyi2.Rclass NoviceGuidePageFragment : Fragment() {override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {val view = inflater.inflate(R.layout.fragment_novice_guide_page, container, false)return view}
}
fragment_novice_guide_page.xml:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"><TextViewandroid:id="@+id/to_fragment_registration_landing_page"android:layout_width="match_parent"android:layout_height="match_parent"android:text="新手引导页面"android:textSize="30dp"android:textColor="#F18C8C"android:gravity="center"/></androidx.constraintlayout.widget.ConstraintLayout>
RegistrationLandingPageFragment.kt:
package com.example.siyi2.fragmentimport android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.TextView
import androidx.fragment.app.Fragment
import androidx.navigation.Navigation
import com.example.siyi2.Rclass RegistrationLandingPageFragment :Fragment(){override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {val view = inflater.inflate(R.layout.fragment_registration_landing_page,container,false)return view}
}
fragment_registration_landing_page.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"><TextViewandroid:id="@+id/to_fragment_main"android:layout_width="match_parent"android:layout_height="match_parent"android:text="登录注册页面"android:textSize="30dp"android:textColor="#DC0404"android:gravity="center"/></androidx.constraintlayout.widget.ConstraintLayout>
MainFragment.kt:
package com.example.siyi2.fragmentimport android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.TextView
import androidx.fragment.app.Fragment
import androidx.navigation.Navigation
import com.example.siyi2.Rclass MainFragment :Fragment(){override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {val view = inflater.inflate(R.layout.fragment_main,container,false)return view}
}
fragment_main.xml:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"><TextViewandroid:id="@+id/main_fragment"android:layout_width="match_parent"android:layout_height="match_parent"android:text="APP主页面"android:textSize="30dp"android:textColor="@color/teal_200"android:gravity="center"/></androidx.constraintlayout.widget.ConstraintLayout>
三. 建立Navigation导航图并关联
1.建立导航图
在app/res目录下新建一个文件夹取名navigation,在navigation文件夹下新建nav_graph.xml,如下图所示
提醒大家一下,我们开发过程中,大家的这个文件夹的名字和XML的名字大家尽量去一些见名知义的名字,方便开发人员和后续维护
nav_graph.xml:
<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"android:id="@+id/nav_graph"app:startDestination="@id/fragment_welcome"><fragmentandroid:id="@+id/fragment_welcome"android:name="com.example.siyi2.fragment.WelcomeFragment"android:label="WelcomeFragment" ><actionandroid:id="@+id/action_fragment_welcome_to_fragment_noviceGuide"app:destination="@id/fragment_noviceGuide"/></fragment><fragmentandroid:id="@+id/fragment_noviceGuide"android:name="com.example.siyi2.fragment.NoviceGuidePageFragment"android:label="NoviceGuideFragment" ><actionandroid:id="@+id/fragment_noviceGuide_to_fragment_registarationLandingpage"app:destination="@+id/fragment_registrationLandingPage" /></fragment><fragmentandroid:id="@+id/fragment_registrationLandingPage"android:name="com.example.siyi2.fragment.RegistrationLandingPageFragment"android:label="RegistrationLandingPageFragment" ><actionandroid:id="@+id/fragment_registrationLandingPage_to_fragment_main"app:destination="@+id/fragment_main" /></fragment><fragmentandroid:id="@+id/fragment_main"android:name="com.example.siyi2.fragment.MainFragment"android:label="MainFragment" ></fragment></navigation>
navigation是根标签,通过startDestinationlai配置默认启动时的第一个页面,小编这里配置的第一个fragment_welcome,我们也可以在代码中动态修改启动时的第一个Fragment,也可以在可视化面板中去修改
fragment标签就代表着这是一个Fragment
name指的是Fragment在项目中的路径
action标签定义了页面跳转的行为,也就是Navigation导航图的每一条线
destination定义跳转的Fragment目标,还可以加入跳转时的动画
Navigation首先要有起始页面,叫startDestination,处于栈底,是启动时的第一个页面,也是返回可见的最后一个页面。多个destination连接起来就构成了一个Navigation导航图,类似于一种栈结构,页面先进后出。destination之间的连接叫做action。
Navigation导航图如下图所示:
大家可以看到,这样的可视化页面流程导航图非常好看,对吧,这也是Google官方推荐大家使用的,便于开发和维护
2. 为Navigation导航绑定在Activity上
我们的navigation导航图也必须依赖于一个Activity上
MainActivity.kt:
package com.example.siyi2import androidx.appcompat.app.AppCompatActivity
import android.os.Bundleclass MainActivity : AppCompatActivity() {override fun onCreate(savedInstanceState: Bundle?) {super.onCreate(savedInstanceState)setContentView(R.layout.activity_main)}
}
activity_main.xml:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"><fragmentandroid:id="@+id/nav_host_fragment"app:defaultNavHost="true"app:navGraph="@navigation/nav_graph"android:name="androidx.navigation.fragment.NavHostFragment"android:layout_width="match_parent"android:layout_height="match_parent" /></androidx.constraintlayout.widget.ConstraintLayout>
3. 为Navigation导航页面添加跳转事件
WelcomeFragment.kt:
package com.example.siyi2.fragmentimport android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.TextView
import androidx.fragment.app.Fragment
import androidx.navigation.Navigationimport com.example.siyi2.Rclass WelcomeFragment : Fragment() {override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {val view = inflater.inflate(R.layout.fragment_welcome, container, false)view.findViewById<TextView>(R.id.to_fragment_novice_guide).setOnClickListener {Navigation.findNavController(view).navigate(R.id.action_fragment_welcome_to_fragment_noviceGuide)}return view}}
NoviceGuidePageFragment.kt:
package com.example.siyi2.fragmentimport android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.TextView
import androidx.fragment.app.Fragment
import androidx.navigation.Navigation
import com.example.siyi2.Rclass NoviceGuidePageFragment : Fragment() {override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {val view = inflater.inflate(R.layout.fragment_novice_guide_page, container, false)view.findViewById<TextView>(R.id.to_fragment_registration_landing_page).setOnClickListener {Navigation.findNavController(view).navigate(R.id.fragment_noviceGuide_to_fragment_registarationLandingpage)}return view}
}
RegistrationLandingPageFragment.kt:
package com.example.siyi2.fragmentimport android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.TextView
import androidx.fragment.app.Fragment
import androidx.navigation.Navigation
import com.example.siyi2.Rclass RegistrationLandingPageFragment :Fragment(){override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {val view = inflater.inflate(R.layout.fragment_registration_landing_page,container,false)view.findViewById<TextView>(R.id.to_fragment_main).setOnClickListener {Navigation.findNavController(view).navigate(R.id.fragment_registrationLandingPage_to_fragment_main)}return view}
}
MainFragment.kt:
package com.example.siyi2.fragmentimport android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.TextView
import androidx.fragment.app.Fragment
import androidx.navigation.Navigation
import com.example.siyi2.Rclass MainFragment :Fragment(){override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {val view = inflater.inflate(R.layout.fragment_main,container,false)return view}
}
到此为止,我们就万事俱备,只欠东风了,直接运行,上效果图
四. Navigation效果演示
Navigation开发
不知道大家是否对JetPack中的Navigation感兴趣了呢?请在评论区留言哦!
Kotlin Navigation开发相关推荐
- Kotlin应用开发初体验
本文 摘自<Kotlin编程权威指南> 本章,你将学习使用IntelliJ IDEA开发首个Kotlin应用.借此,你将熟悉开发环境,创建Kotlin新项目,编写并运行Kotlin代码,以 ...
- Java 近期新闻:Grail 5.0、Spring、Hibernate、WildFly 及 Kotlin Multik 开发库更新
2021 年 10 月 11 日起始周 Java 新闻更新:OpenJDK.JDK 18.Spring Framework.Grails 5.0.Micronaut 3.1.Helidon 2.3.4 ...
- 如何使用 Eclipse + Kotlin + tomcat 开发 Dynamic Web Server
如何使用 Eclipse + Kotlin + tomcat 开发 Dynamic Web Server ? Eclipse 安装 Kotlin 插件后是无法开发 Dynamic Web Server ...
- kotlin写android,Kotlin安卓开发
1.配置Android Studio a.在Project对应的build.gradle文件中添加如下代码: buildscript { ext.kotlin_version ='1.2.30' // ...
- 来自一枚敢敢的Kotlin——Android开发日志之初识RecyclerView
写在前面 因为本科课程的原因,我在2022年开始了我的android开发,我以为我跳离了前端,其实没有,我只是从web端换到了移动端,如此美妙的开局!学校里面的内容还在用Java上着android ...
- 用Kotlin语言开发玩安卓,基于基于Material Design+AndroidX + MVP + RxJava + Retrofit等优秀的开源框架开发,注释超详细,方便大家练手
WanAndroid 一位练习时长两年半的安卓练习生根据鸿神提供的WanAndroid开放Api来制作的产品级App,基本实现了所有的功能,使用Kotlin语言,基于Material Design+A ...
- 干货 | 实现一个属于你的“语言”-携程Kotlin DSL开发与实践
作者简介 刘媛,携程金融高级开发工程师,主要负责中文版.国际版支付Android端的开发及维护工作. 每一个DSL,都是一定意义上专有的语言,这篇文章希望能够用浅显易懂的方式,将Kotlin DSL的 ...
- Android开发之Java和Kotlin混合开发互相跳转报错的问题
老套路报错如下: 关于这个错误我检查了不知道多少遍了,包路径啥的XML配置也都是没问题.我思来想去最后发现是Kotlin环境的问题: 我的项目是个Java版本的项目,然后再Java项目里面新建的Kot ...
- kotlin项目开发基础之gradle初识
在Android Studio推出之后默认的打包编译工具就变为gradle了,我想对于一名Android程序员而言没人不对它知晓,但是对于它里面的一些概念可能并不是每个人都了解,只知道这样配置就ok了 ...
最新文章
- 挑战 Linux 之父认为的“不可能”:向 M1 Mac 移植 Linux
- 特征选择方法之信息增益
- [原创]微软拼音输入法2007(含64位版)
- FreeRTOS操作系统,在按键中断函数中恢复被挂起的任务,程序卡死的原因和解决办法...
- [Linux]CRC校验
- Sitemesh3的使用及配置
- ubuntu workbench
- 【内推】AI独角兽-数美科技-NLP/CV/ASR等开放百余岗位,薪资诱人
- 【补充】Python爬虫:为什么要使用IP代理
- 基于深度学习的图像修复—心中无码
- 运动会加油稿计算机学院150字,学校运动会加油稿150字
- 水波纹 android,Android特效之水波纹的实现
- Eclipse执行junit测试时出现Errors occurred during the build. Errors running builder 'Integrated External Too
- win10 常用命令
- UI框架(UGUI)
- C语言修饰词之violate
- [BBS 水木清华站]给Linux新手
- tidymodels搞定二分类资料多个模型评价和比较
- STK加载地图与高清影像图
- 对称排序 nyoj 283