点击CardView后如何通过NavController跳转至指定Fragment？

问题根源分析 #

当前代码未给CardView设置点击事件监听，也没有建立点击事件与NavController导航的关联逻辑，导致点击无响应。以下是分步修改方案：

1. 扩展数据类，绑定跳转目标 #

修改FlashCardInfo，新增字段存储对应Fragment在Navigation Graph中的ID，实现数据与跳转目标的绑定：

data class FlashCardInfo(
    val imageId: Int,
    val name: String,
    val translation: String,
    val destinationId: Int // 新增：对应Navigation Graph中目标Fragment的ID
)

2. 修改Adapter，添加点击回调 #

重构FlashcardsAdapter，通过Lambda回调传递点击事件，避免Adapter持有Context或NavController：

class FlashcardsAdapter(
    private val imageList: List<FlashCardInfo>,
    private val onItemClick: (FlashCardInfo) -> Unit // 点击事件回调
) : RecyclerView.Adapter<FlashcardsAdapter.ViewHolder>() {

    class ViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
        val imageViewFlashcards = itemView.findViewById<ImageView>(com.example.visuallithuanian.R.id.imageViewFlashcards)
        val textViewFlashcards = itemView.findViewById<TextView>(com.example.visuallithuanian.R.id.textflashCardName)
        val textViewFlashcardsLithuanian = itemView.findViewById<TextView>(com.example.visuallithuanian.R.id.textflashCardLithuanian)
        val cardView = itemView.findViewById<CardView>(com.example.visuallithuanian.R.id.cardFlashCards) // 直接在ViewHolder中缓存CardView
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val view = LayoutInflater.from(parent.context).inflate(com.example.visuallithuanian.R.layout.item_flashcards, parent, false)
        return ViewHolder(view)
    }

    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
        val currentItem = imageList[position]

        holder.imageViewFlashcards.setImageResource(currentItem.imageId)
        holder.textViewFlashcards.text = currentItem.name
        holder.textViewFlashcardsLithuanian.text = currentItem.translation

        // 给CardView设置点击事件，触发回调
        holder.cardView.setOnClickListener {
            onItemClick(currentItem)
        }
    }

    override fun getItemCount(): Int {
        return imageList.size
    }
}

3. 更新Fragment，处理点击导航 #

在FlashCards Fragment中，初始化Adapter时传入点击回调，利用NavController完成页面跳转：

class FlashCards : Fragment() {

    lateinit var bottomNav:BottomNavigationView

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        val view=inflater.inflate(R.layout.fragment_flash_cards, container, false)

        bottomNav = (activity as? FirstScreen)?.findViewById(R.id.bottomNavigationView)!!
        bottomNav.visibility = View.VISIBLE

        val back_icon = view.findViewById<ImageView>(R.id.back_icon)
        val recyclerViewCards1 = view.findViewById<RecyclerView>(R.id.recyclerViewFlashcards)

        recyclerViewCards1.layoutManager = LinearLayoutManager(context)
        val navController = Navigation.findNavController(requireActivity(), R.id.nav_host_fragment)

        val flashCardList = generateFlashCards()
        // 初始化Adapter并设置点击回调
        val adapter = FlashcardsAdapter(flashCardList) { flashCardInfo ->
            navController.navigate(flashCardInfo.destinationId)
        }
        recyclerViewCards1.adapter = adapter

        back_icon.setOnClickListener {
            activity?.onBackPressed()
        }

        return view
    }

    // 更新数据生成逻辑，添加对应Fragment的ID
    private fun generateFlashCards():List<FlashCardInfo> {
        return listOf(
            FlashCardInfo(R.drawable.talking,"Daily Conversation","Kasdienis pokalbis", R.id.dailyConversationFragment),
            FlashCardInfo(R.drawable.doctorvisit,"Questions and Pronouns","Klausimai ir įvardžiai", R.id.questionsPronounsFragment),
            FlashCardInfo(R.drawable.food,"Food","Maistas", R.id.foodFragment),
            FlashCardInfo(R.drawable.relatives,"Relatives","Giminaičiai", R.id.relativesFragment),
            FlashCardInfo(R.drawable.clothing,"Clothing","Drabužiai", R.id.clothingFragment),
            FlashCardInfo(R.drawable.village,"Towns and Villages","Miestai ir kaimai", R.id.townsVillageFragment),
            FlashCardInfo(R.drawable.nature,"Nature","Gamta", R.id.natureFragment),
            FlashCardInfo(R.drawable.verbs,"Popular Verbs","Populiariausi veiksmažodžiai", R.id.popularVerbsFragment),
        )
    }
}

4. 配置Navigation Graph #

确保res/navigation/nav_graph.xml中已添加所有目标Fragment，并设置正确的ID（需与上述代码中的destinationId一致）：

<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/flashCardsFragment">

    <fragment
        android:id="@+id/flashCardsFragment"
        android:name="com.example.visuallithuanian.FlashCards"
        android:label="FlashCards" />

    <!-- 示例目标Fragment，需替换为实际类路径 -->
    <fragment
        android:id="@+id/dailyConversationFragment"
        android:name="com.example.visuallithuanian.DailyConversationFragment"
        android:label="Daily Conversation" />

    <fragment
        android:id="@+id/questionsPronounsFragment"
        android:name="com.example.visuallithuanian.QuestionsPronounsFragment"
        android:label="Questions and Pronouns" />

    <!-- 其他目标Fragment依次添加 -->
</navigation>

内容的提问来源于stack exchange，提问作者PurpleRabbit