0

Hey guys I am trying to set title in my custom toolbar. It's not working until I explicit through xml. I don't want to put a Textview in xml in toolbar. I tried this post and trying to set by code, it is not working.

consultation.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/coordinatorLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    android:focusable="true">

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appBar"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:backgroundTint="#FFC04A"
        android:fitsSystemWindows="true"
        android:gravity="bottom">

        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:id="@+id/collapsingToolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">

            <androidx.appcompat.widget.SearchView
                android:id="@+id/consultationSearchView"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:layout_gravity="bottom"
                android:layout_marginStart="16dp"
                android:layout_marginTop="16dp"
                android:layout_marginEnd="16dp"
                android:background="@drawable/consultations_search_edit_text_rounded_corner"
                android:fitsSystemWindows="true"
                android:theme="@style/ConsultationsSearchViewTheme"
                app:layout_collapseMode="pin" />

            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?android:attr/actionBarSize"
                app:layout_collapseMode="pin"
                app:titleTextColor="@android:color/white" />

        </com.google.android.material.appbar.CollapsingToolbarLayout>

    </com.google.android.material.appbar.AppBarLayout>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/constraintLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

I tried through code

ToolbarActivity.kt

class ToolbarActivity : AppCompatActivity() {

    private lateinit var binding: ToolBarLayoutBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ToolBarLayoutBinding.inflate(layoutInflater)
        setContentView(binding.root)
        actionBar()
        setupSearchView()
    }

    private fun actionBar() {
        setSupportActionBar(binding.toolbar)
        supportActionBar?.setDisplayHomeAsUpEnabled(true)
        supportActionBar?.setDisplayShowTitleEnabled(true)
        supportActionBar?.title = "Toolbar"
    }

    private fun setupSearchView() {
        var originalMargin = 0
        binding.consultationSearchView.apply {
            setOnQueryTextListener(object : SearchView.OnQueryTextListener {
                override fun onQueryTextSubmit(query: String?) = false
                override fun onQueryTextChange(newText: String?): Boolean {
                    if (newText != null) {
                    }
                    return true
                }
            })
            val params =
                binding.consultationSearchView.layoutParams as CollapsingToolbarLayout.LayoutParams
            originalMargin = params.marginStart
            setOnQueryTextFocusChangeListener { view, hasFocus ->
                binding.appBar.setExpanded(!hasFocus)
                isSelected = hasFocus
                if (hasFocus) {
                    params.marginStart = originalMargin + 150 // arbitrary constant
                } else {
                    params.marginStart = originalMargin
                }
                view.layoutParams = params
            }
        }
    }

}

It look like this

enter image description here

Note I don't want to use xml to set text view inside toolbar. I want to do it programmatically. Inside my github project I used xml text view.

Expected output

when screen opens i want like this arrow + title

enter image description here

when collapse it look like this

enter image description here

20
  • I couldn't see where do you set the toolBar title programmatically.. you just change its visibility when the SearchView changes its focus
    – Zain
    Commented Jun 21, 2022 at 20:40
  • @Zain in above code, there is a function actionBar() inside that I used supportActionBar?.title = "Toolbar".
    – Vivek Modi
    Commented Jun 21, 2022 at 20:42
  • Got it.. Do you mean when you collapse the Toolbar the title overlaps with the the view?
    – Zain
    Commented Jun 21, 2022 at 20:45
  • @Zain the text is not setting in toolbar. When screen load it look like the above image. I didn't try to collapse because I got the issue this one first.
    – Vivek Modi
    Commented Jun 21, 2022 at 20:46
  • Do you need something like this
    – Zain
    Commented Jun 21, 2022 at 20:54

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.