文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

Kotlin Navigation开发

2023-09-09 10:52

关注

其实小编之前一直都是用的Java来开发Android,但是工作需求,开始了Kotlin的编程,接触到了JetPack,发现其中的Navigation特别有意思,今天来给大家分享一下,我们做一个四个页面吧,从APP的 欢迎页面——>新手引导页面——>注册登录页面——>APP主页面 ,我来带大家入门,希望大家不要嫌弃

站在Fragment角度:不用把Fragment添加到集合里面去操作了,也不用去操作SupportFragmentManager了

站在Activity角度:可以减少大量的Activity,增加Fragment的使用,毕竟Fragment有更加详细的生命周期,更好的传递信息

站在开发者角度:Navigation的可视化导航图非常优美,导航路径清晰可见,让开发人员更方便的开发

一.注入依赖

    // Kotlin Navigation    implementation("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.Bundleimport android.view.LayoutInflaterimport android.view.Viewimport android.view.ViewGroupimport androidx.fragment.app.Fragmentimport 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:

    

NoviceGuidePageFragment.kt:

package com.example.siyi2.fragmentimport android.os.Bundleimport android.view.LayoutInflaterimport android.view.Viewimport android.view.ViewGroupimport android.widget.TextViewimport androidx.fragment.app.Fragmentimport androidx.navigation.Navigationimport 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:

    

RegistrationLandingPageFragment.kt:

package com.example.siyi2.fragmentimport android.os.Bundleimport android.view.LayoutInflaterimport android.view.Viewimport android.view.ViewGroupimport android.widget.TextViewimport androidx.fragment.app.Fragmentimport androidx.navigation.Navigationimport 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

    

MainFragment.kt:

package com.example.siyi2.fragmentimport android.os.Bundleimport android.view.LayoutInflaterimport android.view.Viewimport android.view.ViewGroupimport android.widget.TextViewimport androidx.fragment.app.Fragmentimport androidx.navigation.Navigationimport 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:

    

三. 建立Navigation导航图并关联

1.建立导航图

在app/res目录下新建一个文件夹取名navigation,在navigation文件夹下新建nav_graph.xml,如下图所示

 提醒大家一下,我们开发过程中,大家的这个文件夹的名字和XML的名字大家尽量去一些见名知义的名字,方便开发人员和后续维护

nav_graph.xml:

                                                        

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.AppCompatActivityimport android.os.Bundleclass MainActivity : AppCompatActivity() {    override fun onCreate(savedInstanceState: Bundle?) {        super.onCreate(savedInstanceState)        setContentView(R.layout.activity_main)    }}

activity_main.xml:

    

3. 为Navigation导航页面添加跳转事件

WelcomeFragment.kt:

package com.example.siyi2.fragmentimport android.os.Bundleimport android.view.LayoutInflaterimport android.view.Viewimport android.view.ViewGroupimport android.widget.TextViewimport androidx.fragment.app.Fragmentimport androidx.navigation.Navigationimport com.example.siyi2.R    class WelcomeFragment : Fragment() {    override fun onCreateView(        inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?    ): View? {        val view = inflater.inflate(R.layout.fragment_welcome, container, false)        view.findViewById(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.Bundleimport android.view.LayoutInflaterimport android.view.Viewimport android.view.ViewGroupimport android.widget.TextViewimport androidx.fragment.app.Fragmentimport androidx.navigation.Navigationimport 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(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.Bundleimport android.view.LayoutInflaterimport android.view.Viewimport android.view.ViewGroupimport android.widget.TextViewimport androidx.fragment.app.Fragmentimport androidx.navigation.Navigationimport 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(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.Bundleimport android.view.LayoutInflaterimport android.view.Viewimport android.view.ViewGroupimport android.widget.TextViewimport androidx.fragment.app.Fragmentimport androidx.navigation.Navigationimport 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感兴趣了呢?请在评论区留言哦!

要是有疑问大家可以加我微信详聊 yf1553653788

来源地址:https://blog.csdn.net/Ai1114/article/details/128418617

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-移动开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯