How to put Toolbar in mutliple Fragments using Kotlin-CodePudding

I'm working on a project, with many fragments.. Please is there a way I can create Toolbar that appears on all fragment, I was watching a tutorial on youtube, where they used navController, but when I try to do the same I get an Unresolved reference error..

Please Keep in mind that I want different fragments to have different icons.

So with that, How do I do this?? Or Do I have to create toolbar explicitly in each fragment .xml file???

Here's my MainActivity.kt file, with the incomplete code I was trying to implement:

package com.example.a500months

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.appcompat.app.AppCompatDelegate
import androidx.fragment.app.Fragment
import com.google.android.material.bottomnavigation.BottomNavigationView

class MainActivity : AppCompatActivity() {

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

        // Assign Toolbar to Actionbar
        setSupportActionBar(findViewById(R.id.material_Toolbar))

        // To make Toolbar show back button (!!!I get the error here!!!)
        val navController = findNavController

And Here's my .xml file:

<?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">

    <com.google.android.material.appbar.MaterialToolbar
        android:id="@ id/material_Toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        android:elevation="4dp"
        android:theme="@style/ThemeOverlay.MaterialComponents.Dark.ActionBar"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />


    <FrameLayout
        android:id="@ id/fl_fragment"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintBottom_toTopOf="@ id/bottomNavigationView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@ id/bottomNavigationView"
        android:layout_width="match_parent"
        android:layout_height="65dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:menu="@menu/bottom_nav_menu" />

</androidx.constraintlayout.widget.ConstraintLayout>

I'd appreciate anything a suggestion, tip, answer ...Anything.

Thanks in Advance for your help..

CodePudding user response：

you can create separate toolbar.xml and this toolbar.xml include in your mainActivity's xml and it's reflect your all fragment. You can also manage show hide extra thing in toolbar with different fragment.

CodePudding user response：

Below code is your common_toolbar.xml

    <androidx.appcompat.widget.Toolbar
    android:id="@ id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="@dimen/_50sdp">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@ id/clParent"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <View
            android:id="@ id/viewToolbar"
            android:layout_width="match_parent"
            android:layout_height="2dp"
            android:layout_marginTop="@dimen/_16sdp"
            android:layout_marginEnd="@dimen/_10sdp"
            android:background="@color/black"
            app:layout_constraintTop_toBottomOf="@ id/txtToolbarName" />

        <androidx.appcompat.widget.AppCompatImageView
            android:id="@ id/imgToolbarCancel"
            android:layout_width="@dimen/_50sdp"
            android:layout_height="@dimen/_40sdp"
            android:src="@drawable/ic_basic_cancel"
            android:visibility="gone"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <androidx.appcompat.widget.AppCompatImageView
            android:id="@ id/imgToolbarMainMenu"
            android:layout_width="@dimen/_50sdp"
            android:layout_height="@dimen/_40sdp"
            android:src="@drawable/ic_basic_mainmenu"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <androidx.appcompat.widget.AppCompatImageView
            android:id="@ id/imgToolbarLeft"
            android:layout_width="@dimen/_16sdp"
            android:layout_height="@dimen/_16sdp"
            android:src="@drawable/ic_back_btn"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <androidx.appcompat.widget.AppCompatTextView
            android:id="@ id/txtToolbarName"
            style="@style/TextView_regular_12_black_caps_bold"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/_15sdp"
            android:fontFamily="@font/lato_heavy"
            android:text=""
            android:textAllCaps="true"
            app:layout_constraintBottom_toTopOf="@ id/viewToolbar"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <androidx.appcompat.widget.AppCompatTextView
            android:id="@ id/txtToolbarDone"
            style="@style/TextView_regular_12_black_caps_bold"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="@dimen/_13sdp"
            android:text="@string/done"
            android:textAllCaps="true"
            android:visibility="gone"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    </androidx.constraintlayout.widget.ConstraintLayout>
</androidx.appcompat.widget.Toolbar>

and this is a mainActivity's.xml

 <androidx.constraintlayout.widget.ConstraintLayout
    android:id="@ id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <include
        android:id="@ id/include"
        layout="@layout/common_fragment_header"
        android:visibility="visible"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        tools:layout_editor_absoluteY="56dp" />
</androidx.constraintlayout.widget.ConstraintLayout>

and in mainActivity you can hide show toolbar 's extra things

 fun onSectionAttached(number: Int, title: String): Boolean {
    return when (number) {
        0 -> {
            setViewVisible(
                title,
                0,
                View.GONE,
                View.GONE,
                View.GONE,
                View.GONE,
                View.GONE,
                View.VISIBLE
            )
            true
        }
        1 -> {
            setViewVisible(
                title,
                1,
                View.GONE,
                View.GONE,
                View.GONE,
                View.GONE,
                View.VISIBLE,
                View.VISIBLE
            )
            true
        }
        
        else -> true
    }
}

 private fun setViewVisible(
    title: String,
    from: Int,
    imgToolbarLeft: Int,
    imgToolbarCancel: Int,
    txtToolbarDone: Int,
    viewToolbar: Int,
    imgToolbarMainMenu: Int,
    nav_view: Int
) {
    binding.include.txtToolbarName.text = title
    binding.include.txtToolbarDone.visibility = txtToolbarDone
    binding.include.imgToolbarLeft.visibility = imgToolbarLeft
    binding.include.imgToolbarCancel.visibility = imgToolbarCancel
    binding.include.imgToolbarMainMenu.visibility = imgToolbarMainMenu
    binding.include.viewToolbar.visibility = viewToolbar
    binding.navView.visibility = nav_view

}

in fragment you can add your toolbar in inActivityCreated() with the tollbar number

 override fun onActivityCreated(savedInstanceState: Bundle?) {
    super.onActivityCreated(savedInstanceState)
    (context as MainActivity).onSectionAttached(1, resources.getString(R.string.your_string))
}