实践案例：使用Jetpack Navigation创建一个新闻应用

在这里插入图片描述

在这个实践案例中，我们将使用Jetpack Navigation创建一个简单的新闻应用。这个应用将包含以下功能：

  1. 新闻列表页面：显示一组新闻文章。
  2. 新闻详情页面：显示选定新闻文章的详细信息。
  3. 用户资料页面：显示用户的资料信息。

我们将通过导航图、传递数据、处理返回操作和集成底部导航来展示Jetpack Navigation的强大功能。

第一步：项目设置

添加依赖项

在build.gradle文件中添加必要的依赖项：

dependencies {
    def nav_version = "2.4.0"

    implementation "androidx.navigation:navigation-fragment-ktx:$nav_version"
    implementation "androidx.navigation:navigation-ui-ktx:$nav_version"
    implementation "com.google.android.material:material:1.4.0"
}

创建导航图

在res/navigation目录中创建一个新的导航图文件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"
    xmlns:tools="http://schemas.android.com/tools"
    app:startDestination="@id/newsListFragment">

    <fragment
        android:id="@+id/newsListFragment"
        android:name="com.example.newsapp.NewsListFragment"
        android:label="News List"
        tools:layout="@layout/fragment_news_list" >
        <action
            android:id="@+id/action_newsListFragment_to_newsDetailFragment"
            app:destination="@id/newsDetailFragment" />
        <action
            android:id="@+id/action_newsListFragment_to_userProfileFragment"
            app:destination="@id/userProfileFragment" />
    </fragment>

    <fragment
        android:id="@+id/newsDetailFragment"
        android:name="com.example.newsapp.NewsDetailFragment"
        android:label="News Detail"
        tools:layout="@layout/fragment_news_detail" >
        <argument
            android:name="articleId"
            app:argType="integer" />
    </fragment>

    <fragment
        android:id="@+id/userProfileFragment"
        android:name="com.example.newsapp.UserProfileFragment"
        android:label="User Profile"
        tools:layout="@layout/fragment_user_profile" />

</navigation>

主Activity布局

创建主Activity布局文件activity_main.xml，包含一个NavHostFragment和BottomNavigationView。

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout 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">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <fragment
            android:id="@+id/nav_host_fragment"
            android:name="androidx.navigation.fragment.NavHostFragment"
            android:layout_width="0dp"
            android:layout_height="0dp"
            app:defaultNavHost="true"
            app:navGraph="@navigation/nav_graph"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toTopOf="@id/bottom_nav"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent" />

        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottom_nav"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="start"
            app:menu="@menu/bottom_nav_menu"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent" />

    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.drawerlayout.widget.DrawerLayout>

BottomNavigationView菜单

在res/menu目录中创建bottom_nav_menu.xml。

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/newsListFragment"
        android:icon="@drawable/ic_news"
        android:title="News" />
    <item
        android:id="@+id/userProfileFragment"
        android:icon="@drawable/ic_profile"
        android:title="Profile" />
</menu>

主Activity

在MainActivity.kt中设置NavController和BottomNavigationView。

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val navController = findNavController(R.id.nav_host_fragment)
        val bottomNavigationView = findViewById<BottomNavigationView>(R.id.bottom_nav)
        bottomNavigationView.setupWithNavController(navController)
    }

    override fun onSupportNavigateUp(): Boolean {
        val navController = findNavController(R.id.nav_host_fragment)
        return navController.navigateUp() || super.onSupportNavigateUp()
    }
}

第二步：创建Fragment

新闻列表Fragment

创建NewsListFragment.kt，显示一组新闻文章。

class NewsListFragment : Fragment(R.layout.fragment_news_list) {

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        val navController = findNavController()

        // 示例数据
        val articles = listOf("Article 1", "Article 2", "Article 3")

        val adapter = ArrayAdapter(requireContext(), android.R.layout.simple_list_item_1, articles)
        view.findViewById<ListView>(R.id.newsListView).adapter = adapter

        view.findViewById<ListView>(R.id.newsListView).setOnItemClickListener { _, _, position, _ ->
            val action = NewsListFragmentDirections.actionNewsListFragmentToNewsDetailFragment(position)
            navController.navigate(action)
        }
    }
}

新闻详情Fragment

创建NewsDetailFragment.kt，显示选定新闻文章的详细信息。

class NewsDetailFragment : Fragment(R.layout.fragment_news_detail) {

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        val args: NewsDetailFragmentArgs by navArgs()
        val articleId = args.articleId

        view.findViewById<TextView>(R.id.articleTextView).text = "Displaying details for article $articleId"
    }
}

用户资料Fragment

创建UserProfileFragment.kt，显示用户的资料信息。

class UserProfileFragment : Fragment(R.layout.fragment_user_profile) {

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        // 示例用户信息
        view.findViewById<TextView>(R.id.userNameTextView).text = "John Doe"
        view.findViewById<TextView>(R.id.userEmailTextView).text = "john.doe@example.com"
    }
}

第三步：运行和测试

现在，我们已经完成了所有必要的步骤，可以运行应用程序并测试导航功能。

  • 启动应用程序，底部导航栏将显示新闻列表和用户资料页面。
  • 在新闻列表页面，点击任意文章将导航到新闻详情页面，并显示选定文章的详细信息。
  • 点击底部导航栏中的用户资料图标，将导航到用户资料页面，显示用户的相关信息。

结论

通过这个实践案例，我们展示了如何使用Jetpack Navigation创建一个简单的新闻应用。我们涵盖了设置导航图、在Fragment之间导航、传递数据、处理返回操作以及集成底部导航。Jetpack Navigation提供了强大且灵活的解决方案，使得管理复杂的导航场景变得更加简单和高效。

Best regards!

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：/a/749849.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

内网部署Prometheus-server结合grafana

内网部署Prometheus-server结合grafana

目录 1.提取依赖包 2.所有节点安装chrony服务 2.1集群角色规划 2.2 所有节点安装chrony服务 2.3添加hosts文件解析(服务端) 2.4修改时间服务器 ​编辑 2.5重启chrony服务&#xff0c;使得配置生效 2.6修改客户端配置&#xff08;注意是客户端其他节点&#xff09; 2.…
阅读更多...
【Knowledge Graph Context-Enhanced Diversified Recommendation(MSDM2024)】

【Knowledge Graph Context-Enhanced Diversified Recommendation(MSDM2024)】

Knowledge Graph Context-Enhanced Diversified Recommendation 摘要 推荐系统&#xff08;RecSys&#xff09;领域已被广泛研究&#xff0c;以通过利用用户的历史交互来提高准确性。 尽管如此&#xff0c;这种对准确性的持续追求常常导致多样性的减少&#xff0c;最终导致众所…
阅读更多...
Golang | Leetcode Golang题解之第187题重复的DNA序列

Golang | Leetcode Golang题解之第187题重复的DNA序列

题目&#xff1a; 题解&#xff1a; const L 10 var bin map[byte]int{A: 0, C: 1, G: 2, T: 3}func findRepeatedDnaSequences(s string) (ans []string) {n : len(s)if n < L {return}x : 0for _, ch : range s[:L-1] {x x<<2 | bin[byte(ch)]}cnt : map[int]in…
阅读更多...
ollama，springAi实现自然语言处理

ollama，springAi实现自然语言处理

ollama安装使用&#xff1a; https://ollama.com/ 下载速度比较慢的可以直接使用以下版本0.1.41 https://pan.baidu.com/s/1hCCkYvFjWqxvPyYA2-YElA?pwdotap 直接管理员身份双击安装&#xff0c;安装成功后会在任务栏里出现这个小图标&#xff1a; 打开cmd&#xff0c;输入…
阅读更多...
第1章 基础知识

第1章 基础知识

第1章 基础知识 1.1 机器语言 机器语言就是机器指令的集合&#xff0c;机器指令展开来讲就是一台机器可以正确执行的命令 1.2 汇编语言的产生 汇编语言的主题是汇编指令。汇编指令和机器指令的差别在于指令的表示方法上&#xff0c;汇编指令是机器指令便于记忆的书写格式。…
阅读更多...
免费分享一套SpringBoot+Vue在线水果(销售)商城管理系统【论文+源码+SQL脚本】，帅呆了~~

免费分享一套SpringBoot+Vue在线水果(销售)商城管理系统【论文+源码+SQL脚本】，帅呆了~~

大家好&#xff0c;我是java1234_小锋老师&#xff0c;看到一个不错的SpringBootVue在线水果(销售)商城管理系统&#xff0c;分享下哈。 项目视频演示 【免费】SpringBootVue在线水果(销售)商城管理系统 Java毕业设计_哔哩哔哩_bilibili【免费】SpringBootVue在线水果(销售)商…
阅读更多...
linux基于wifi，Xshell的远程连接

linux基于wifi，Xshell的远程连接

最近有个比赛&#xff0c;要使用ros小车但是系统是ubuntu20.04无桌面系统刚开始接触linux的我啥都不会&#xff0c;就一个简单的连接wifi都搞了3天才搞通。再此进行一个总结。参考博客原文链接&#xff1a;https://blog.csdn.net/qq_51491920/article/details/126221940 一、什…
阅读更多...
非最大值抑制（NMS）函数

非最大值抑制（NMS）函数

非最大值抑制&#xff08;NMS&#xff09;函数 flyfish 非最大值抑制&#xff08;Non-Maximum Suppression, NMS&#xff09;是计算机视觉中常用的一种后处理技术&#xff0c;主要用于目标检测任务。其作用是从一组可能存在大量重叠的候选边界框中&#xff0c;筛选出最具代表…
阅读更多...
从CVPR 2024看域适应、域泛化最新研究进展

从CVPR 2024看域适应、域泛化最新研究进展

域适应和域泛化一直以来都是各大顶会的热门研究方向。 域适应指&#xff1a;当我们在源域上训练的模型需要在目标域应用时&#xff0c;如果两域数据分布差异太大&#xff0c;模型性能就有可能降低。这时可以利用目标域的无标签数据&#xff0c;通过设计特定方法减小域间差异&a…
阅读更多...
thinksboard 新建子类菜单

thinksboard 新建子类菜单

新建需要的文件 打开bz-routing.module.ts文件&#xff0c;设置bzRoutes&#xff0c;为下面使用 import { Injectable, NgModule } from angular/core; import { Resolve, RouterModule, Routes } from angular/router; import { Authority } from shared/models/authority.en…
阅读更多...
【创建者模式-工厂模式】

【创建者模式-工厂模式】

简单工厂模式 &#xff08;也称为静态工厂模式&#xff09;由一个工厂对象负责创建所有产品类的实例。客户端通过传入一个参数给工厂类来请求创建哪种产品类的实例。这种模式的优点在于客户端不需要知道具体的产品类&#xff0c;只需要知道对应的参数即可。缺点是当需要添加新…
阅读更多...
redis复习

redis复习

redis知识点 redis持久化redis 订阅发布模式redis主从复制哨兵模式redis雪崩&#xff0c;穿透缓存击穿&#xff08;请求太多&#xff0c;缓存过期&#xff09;缓存雪崩 redis持久化 redis是内存数据库&#xff0c;持久化有两种方式&#xff0c;一种是RDB&#xff08;redis dat…
阅读更多...
【解决方案】你必须要知道的~前端九种跨域方式实现原理（完整版）

【解决方案】你必须要知道的~前端九种跨域方式实现原理（完整版）

前言 前后端数据交互经常会碰到请求跨域&#xff0c;什么是跨域&#xff0c;以及有哪几种跨域方式&#xff0c;这些问题通常出现在Web开发中&#xff0c;当浏览器执行脚本发起请求到不同的域名、协议或端口时&#xff0c;出于安全考虑&#xff0c;浏览器会限制这种跨源HTTP请求…
阅读更多...
Redis数据库（六）：主从复制和缓存穿透及雪崩

Redis数据库（六）：主从复制和缓存穿透及雪崩

目录 一、Redis主从复制 1.1 概念 1.2 主从复制的作用 1.3 实现一主二从 1.4 哨兵模式 1.4.1 哨兵的作用 1.4.2 哨兵模式的优缺点 二、Redis缓存穿透和雪崩 2.1 缓存穿透——查不到 2.1.1 缓存穿透解决办法 2.2 缓存击穿 - 量太大&#xff0c;缓存过期 2.2.1 缓存…
阅读更多...
拍照就用华为Pura 70系列，后置真实感人像轻松出片！

拍照就用华为Pura 70系列，后置真实感人像轻松出片！

平时喜欢用手机记录生活的人是不是总有个烦恼&#xff0c;想要拍出媲美单反的完美人像&#xff0c;又怕照片失真&#xff0c;经过近期对手机摄影的探索&#xff0c;我发现了华为Pura70系列的真实感人像之美&#xff0c;它给予每个热爱生活的人直面镜头的自信&#xff0c;记录真…
阅读更多...
毕业季留念，就该这样记录下来

毕业季留念，就该这样记录下来

毕业季来啦&#xff01;这个季节总是充满了不舍和期待&#xff0c;就像夏天里的冰淇淋&#xff0c;甜蜜中带着一丝丝凉意。在这个特别的时刻&#xff0c;我想和大家分享一款陪伴我记录青春点滴的神器——nova 12 Ultra 手机。 要说自拍&#xff0c;我可是个“资深玩家”。以前…
阅读更多...
以算筑基，以智赋能 | Gooxi受邀出席2024中国智算中心全栈技术大会

以算筑基，以智赋能 | Gooxi受邀出席2024中国智算中心全栈技术大会

6月25日&#xff0c;2024中国智算中心全栈技术大会暨展览会、第5届中国数据中心绿色能源大会暨第10届中国&#xff08;上海&#xff09;国际数据中心产业展览会在上海新国际博览中心隆重召开。Gooxi受邀参与并携最新服务器产品以及解决方案亮相展会&#xff0c;吸引众多行业领袖…
阅读更多...
基于MATLAB仿真设计无线充电系统

基于MATLAB仿真设计无线充电系统

通过学习无线充电相关课程知识&#xff0c;通过课程设计无线充电系统&#xff0c;将所学习的WPT&#xff0c;DC-DC&#xff0c;APFC进行整合得到整个无线充电系统&#xff0c;通过进行仿真研究其系统特性&#xff0c;完成我们预期系统功能和指标。 以功率器件为基本元件&#x…
阅读更多...
【人工智能学习之图像操作（二）】

【人工智能学习之图像操作（二）】

【人工智能学习之图像操作&#xff08;二&#xff09;】 图像上的运算图像混合按位运算 图像的几何变换仿射变换透视变换膨胀操作腐蚀操作开操作闭操作梯度操作礼帽操作黑帽操作 图像上的运算 图像上的算术运算&#xff0c;加法&#xff0c;减法&#xff0c;图像混合等。 加减…
阅读更多...
Profibus协议转Modbus协议网关模块在船舶中的应用

Profibus协议转Modbus协议网关模块在船舶中的应用

一、背景 在当今数字化快速发展的时代&#xff0c;船舶作为重要的交通工具之一&#xff0c;也在不断追赶着科技的步伐&#xff0c;实现自身的智能化升级。而在这个过程中&#xff0c;Profibus转Modbus网关&#xff08;XD-MDPB100&#xff09;作为关键的一环&#xff0c;扮演着…
阅读更多...
最新文章

Copyright @ 2022~2023