Toolbar: Android অ্যাপ্লিকেশনে টুলবার

লেখক: IT Sectr প্রকাশিত: 2026-02-23 পড়ার সময়: 12 মিনিট

Toolbar (টুলবার) — একটি Android উপাদান যা ActionBar প্রতিস্থাপন করেছে, এটি স্ক্রিনের শিরোনাম, নেভিগেশন উপাদান এবং কার্যক্রম প্রদর্শন করে। Toolbar Material Design Library-এর অংশ এবং সম্পূর্ণ কাস্টমাইজযোগ্য: সাধারণ শিরোনাম থেকে কাস্টম ভিউ এবং অ্যানিমেটেড আইকন পর্যন্ত। উপাদান সম্পর্কে আরও জানতে Material Design 3 স্পেসিফিকেশন দেখুন।

মূল পয়েন্ট

  • Toolbar — কাস্টমাইজযোগ্য Android টুলবার, Material Design থেকে ActionBar-এর উত্তরসূরি
  • ActionBar — সিস্টেম বার যা Android 5.0-এর আগে বিদ্যমান ছিল, Toolbar দ্বারা প্রতিস্থাপিত
  • Material 3 — Top App Bar চারটি ভিন্নতায়: Small, Center-aligned, Medium, Large
  • Menu — action items সহ XML মেনু, onCreateOptionsMenu-এর মাধ্যমে Toolbar-এ সংহত
  • কাস্টমাইজেশন — শিরোনাম, লোগো, নেভিগেশন আইকন, কাস্টম ভিউ এবং অ্যানিমেশন

Toolbar কী?

Toolbar Material Design লাইব্রেরি (androidx.appcompat.widget.Toolbar) থেকে একটি Android উপাদান যা অ্যাপ স্ক্রিনের জন্য একটি নমনীয় টুলবার সরবরাহ করে। Toolbar পুরনো ActionBar-কে প্রতিস্থাপন করেছে, ডেভেলপারদের চেহারা এবং আচরণের উপর সম্পূর্ণ নিয়ন্ত্রণ দেয়। এটি layout-এর যেকোনো জায়গায় রাখা যেতে পারে, কাস্টম চাইল্ড ভিউ থাকতে পারে, অ্যানিমেটেড হতে পারে এবং বিভিন্ন স্ক্রিন সাইজের সাথে খাপ খাইয়ে নিতে পারে।

Material Design 3 (2026) Top App Bar সংজ্ঞায়িত করে — Toolbar-এর বিবর্তন — চারটি ভিন্নতায়: Small (কমপ্যাক্ট, 48 dp), Center-aligned (কেন্দ্রীভূত শিরোনাম), Medium (বর্ধিত শিরোনাম, 112 dp) এবং Large (বড় শিরোনাম, 168 dp)। প্রতিটি ভিন্নতার নিজস্ব স্ক্রোল আচরণ রয়েছে: Small স্থির থাকে, Medium এবং Large স্ক্রোল করার সময় Small-এ সঙ্কুচিত হয়।

Toolbar তিনটি মূল অঞ্চল প্রদর্শন করে: নেভিগেশন আইকন (বামে, সাধারণত হ্যামবার্গার বা ব্যাক তীর), স্ক্রিন শিরোনাম (কেন্দ্র বা বামে) এবং action items (ডানে — কার্যক্রম আইকন, overflow মেনু)। Toolbar-এ লোগো, সাবটাইটেল, কাস্টম ভিউ (search view, switch) এবং CoordinatorLayout-এর সাথে CollapsingToolbarLayout থাকতে পারে।

ActionBar: ইতিহাস ও বিবর্তন

ActionBar একটি সিস্টেম Android বার যা Android 3.0 (API 11)-এ পুরনো Title Bar-এর প্রতিস্থাপন হিসাবে আবির্ভূত হয়েছিল। ActionBar Activity-এর সাথে দৃঢ়ভাবে আবদ্ধ ছিল, স্ক্রিনের শীর্ষে একটি নির্দিষ্ট অবস্থান ছিল এবং সীমিত কাস্টমাইজেশন বিকল্প ছিল। Android 5.0 (Lollipop, 2014) এবং AppCompat লাইব্রেরি প্রকাশের সাথে, Google Toolbar-কে একটি নমনীয় বিকল্প হিসাবে উপস্থাপন করে।

ActionBar-এর প্রধান ত্রুটিগুলি যা Toolbar সমাধান করেছে: নির্দিষ্ট অবস্থান (শুধুমাত্র উপরে), অ্যানিমেশনের অসম্ভবতা, কাস্টম ভিউতে জটিলতা, CoordinatorLayout এবং CollapsingToolbarLayout-এর সাথে সমস্যা। Google 2015 সালে আনুষ্ঠানিকভাবে ActionBar-কে অপ্রচলিত (deprecated) ঘোষণা করেছে এবং সমস্ত নতুন প্রকল্পের জন্য Toolbar সুপারিশ করে। Android 12 (2021) থেকে শুরু করে, নতুন Material 3 থিমে ActionBar ডিফল্টভাবে নিষ্ক্রিয়।

বৈশিষ্ট্যActionBarToolbar
অবস্থানশীর্ষে নির্দিষ্টLayout-এ যেকোনো জায়গায়
কাস্টমাইজেশনসীমিত (রং, পটভূমি)সম্পূর্ণ (ভিউ, স্টাইল, অ্যানিমেশন)
সঙ্কোচনসমর্থিত নয়CollapsingToolbarLayout
অ্যানিমেশনশুধুমাত্র সিস্টেমযেকোনো (ObjectAnimator, Transition)
Material 3সমর্থিত নয়Small / Medium / Large App Bar

Android-এ Toolbar সেটআপ করা

Toolbar ব্যবহার করতে: (1) ActionBar ছাড়া থিম সেট করুন (Theme.Material3.NoActionBar বা Theme.AppCompat.NoActionBar), (2) XML layout-এ Toolbar যোগ করুন, (3) setSupportActionBar-এর মাধ্যমে এটি ActionBar হিসাবে সেট করুন। এর পরে, Toolbar ActionBar-এর সমস্ত বৈশিষ্ট্য পায়: মেনু হ্যান্ডলিং, নেভিগেশন আইকন, AndroidManifest থেকে শিরোনাম।

xml
<!-- Toolbar সহ activity_main.xml -->
<LinearLayout
    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"
    android:orientation="vertical">

    <androidx.appcompat.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        android:elevation="4dp"
        app:titleTextColor="@android:color/white"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</LinearLayout>
kotlin
class MainActivity : AppCompatActivity() {

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

        val toolbar = findViewById<Toolbar>(R.id.toolbar)
        setSupportActionBar(toolbar)

        // নেভিগেশন আইকন সেটআপ
        supportActionBar?.setDisplayHomeAsUpEnabled(true)
        supportActionBar?.setHomeAsUpIndicator(R.drawable.ic_menu)

        // কাস্টম শিরোনাম
        supportActionBar?.title = "হোম"
        supportActionBar?.subtitle = "হ্যালো, ব্যবহারকারী!"
    }

    override fun onCreateOptionsMenu(menu: Menu): Boolean {
        menuInflater.inflate(R.menu.toolbar_menu, menu)
        return true
    }
}

Toolbar-এ মেনু সংহত করা

Toolbar onCreateOptionsMenu এবং onOptionsItemSelected কলব্যাকের মাধ্যমে Android মেনু সিস্টেমের সাথে সংহত হয়। মেনু action items সংজ্ঞায়িত করে — Toolbar-এ ডানদিকে প্রদর্শিত কার্যক্রম আইকন। যদি action items ফিট না হয়, তবে তারা স্বয়ংক্রিয়ভাবে overflow মেনুতে (তিন বিন্দু) চলে যায়। ডেভেলপার app:showAsAction অ্যাট্রিবিউটের মাধ্যমে এটি নিয়ন্ত্রণ করে: always, ifRoom, never।

xml
<!-- res/menu/toolbar_menu.xml -->
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/action_search"
        android:icon="@drawable/ic_search"
        android:title="অনুসন্ধান"
        app:showAsAction="ifRoom"
        app:actionViewClass="androidx.appcompat.widget.SearchView" />

    <item
        android:id="@+id/action_notifications"
        android:icon="@drawable/ic_notifications"
        android:title="বিজ্ঞপ্তি"
        app:showAsAction="ifRoom" />

    <item
        android:id="@+id/action_settings"
        android:title="সেটিংস"
        app:showAsAction="never" />
</menu>
kotlin
override fun onOptionsItemSelected(item: MenuItem): Boolean {
    return when (item.itemId) {
        R.id.action_search -> {
            Toast.makeText(this, "অনুসন্ধান", Toast.LENGTH_SHORT).show()
            true
        }
        R.id.action_notifications -> {
            openNotifications()
            true
        }
        R.id.action_settings -> {
            openSettings()
            true
        }
        else -> super.onOptionsItemSelected(item)
    }
}

Material 3: Center এবং Large Top App Bar

Material 3 Top App Bar-এর চারটি ভিন্নতা প্রবর্তন করে: Small (কমপ্যাক্ট, 48 dp), Center-aligned (কেন্দ্রীভূত শিরোনাম), Medium (বর্ধিত শিরোনাম সহ 112 dp) এবং Large (বড় শিরোনাম সহ 168 dp)। Medium এবং Large App Bar সঙ্কোচনযোগ্য আচরণ সমর্থন করে — স্ক্রোল করার সময় এগুলি মসৃণভাবে Small-এ সঙ্কুচিত হয়। অ্যানিমেশন CoordinatorLayout এবং AppBarLayout-এর মাধ্যমে নিয়ন্ত্রিত হয়।

Center-aligned Top App Bar Material 3-এর একটি নতুন ভিন্নতা যেখানে শিরোনাম বারের কেন্দ্রে অবস্থিত। এই স্টাইলটি প্রায়শই Google অ্যাপে (Play Store, YouTube) ব্যবহৃত হয় এবং ন্যূনতম action items সহ স্ক্রিনের জন্য সুপারিশ করা হয়। Small Top App Bar ক্লাসিক Toolbar, যা পুরনো Android সংস্করণের সাথে সামঞ্জস্যপূর্ণ। Medium এবং Large সেই স্ক্রিনগুলির জন্য উপযুক্ত যেখানে শিরোনাম একটি মূল উপাদান (প্রোফাইল, হোম পৃষ্ঠা)।

xml
<!-- CollapsingToolbarLayout সহ Material 3 Large Top App Bar -->
<CoordinatorLayout
    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">

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="168dp"
            app:contentScrim="?attr/colorPrimary"
            app:titleEnabled="true"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

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

    <androidx.core.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="16dp"
            android:text="স্ক্রিন কন্টেন্ট..." />
    </NestedScrollView>
</CoordinatorLayout>

Toolbar-এর উন্নত কাস্টমাইজেশন

Toolbar সম্পূর্ণ কাস্টমাইজেশন সমর্থন করে: উচ্চতা পরিবর্তন, প্রদর্শন/লুকানোর অ্যানিমেশন, কাস্টম চাইল্ড ভিউ, লোগো, নেভিগেশন আইকন, PopupMenu এবং CoordinatorLayout-এর সাথে সংহতি। স্ক্রোল করার সময় লুকানোর অ্যানিমেশনের জন্য AppBarLayout ব্যবহার করা হয় scroll, enterAlways, snap ফ্ল্যাগ সহ। Toolbar-এর নিচে ছবির parallax প্রভাবের জন্য — CollapsingToolbarLayout mode parallax সহ।

লোগো এবং সাবটাইটেল setLogo এবং setSubtitle পদ্ধতির মাধ্যমে সেট করা হয়। নেভিগেশন আইকন setNavigationIcon এবং setNavigationOnClickListener-এর মাধ্যমে কনফিগার করা হয়। কাস্টম ভিউ addView-এর মাধ্যমে সরাসরি Toolbar-এ যোগ করা হয়। SearchView-এর জন্য, actionViewClass সহ MenuItem ব্যবহার করুন। ডার্ক থিমের জন্য, Material 3 বৈশিষ্ট্যের রং স্বয়ংক্রিয়ভাবে প্রয়োগ হয়।

kotlin
// Toolbar-এর উন্নত কাস্টমাইজেশন
with (toolbar) {
    // লোগো এবং শিরোনাম
    setLogo(R.drawable.ic_logo)
    setTitle("আমার অ্যাপ")
    setSubtitle("সংস্করণ 2.0")

    // হ্যান্ডলার সহ নেভিগেশন আইকন
    setNavigationIcon(R.drawable.ic_drawer)
    setNavigationOnClickListener {
        drawerLayout.open()
    }

    // কাস্টম ভিউ — থিমের জন্য Switch
    val themeSwitch = Switch(this@MainActivity).apply {\n        thumbDrawable = ContextCompat.getDrawable(
            this@MainActivity, R.drawable.ic_theme
        )
    }
    addView(themeSwitch)

    // কাস্টম PopupMenu
    setOnMenuItemClickListener { item ->
        Toast.makeText(this@MainActivity, item.title, Toast.LENGTH_SHORT).show()
        true
    }
}

সচরাচর জিজ্ঞাসিত প্রশ্ন

Toolbar এবং ActionBar-এর মধ্যে পার্থক্য কী?

ActionBar Android 3.0–4.4-এর একটি সিস্টেম বার যার সীমিত কাস্টমাইজেশন। Toolbar Material Design-এর একটি নমনীয় উপাদান যা layout-এর যেকোনো জায়গায় রাখা, অ্যানিমেট করা এবং কাস্টম ভিউ দিয়ে পূর্ণ করা যায়। Toolbar setSupportActionBar-এর মাধ্যমে ActionBar-কে সম্পূর্ণরূপে প্রতিস্থাপন করে।

স্ক্রোল করার সময় Toolbar কীভাবে লুকাবেন?

CoordinatorLayout + AppBarLayout + CollapsingToolbarLayout ব্যবহার করুন। layout_scrollBehavior-এ Toolbar-এর জন্য scroll ফ্ল্যাগ সেট করুন। নিচে স্ক্রোল করলে Toolbar লুকিয়ে যায়; উপরে স্ক্রোল করলে অ্যানিমেশন সহ প্রদর্শিত হয়। Material 3-এ, Medium/Large Top App Bar Small-এ সঙ্কুচিত হয়।

Toolbar-এ কতগুলি action items রাখা যেতে পারে?

সীমা হল স্ক্রিনের ভৌত প্রস্থ। 2–4টি action items (আইকন) সুপারিশ করা হয়। বাকিগুলি overflow মেনুতে (তিন বিন্দু) চলে যায়। app:showAsAction-এর মাধ্যমে কনফিগার করুন: always (সর্বদা দেখান), ifRoom (যদি জায়গা থাকে), never (overflow-এ)।

Toolbar-এ SearchView কীভাবে যোগ করবেন?

SearchView মেনুতে action view হিসাবে যোগ করা হয়। XML মেনুতে: app:actionViewClass="androidx.appcompat.widget.SearchView"। SearchView স্বয়ংক্রিয়ভাবে সার্চ আইকনে সঙ্কুচিত হয় এবং ট্যাপ করলে প্রসারিত হয়। SearchRecentSuggestionsProvider-এর মাধ্যমে ভয়েস সার্চ এবং অটোকমপ্লিট সমর্থন করে।

CollapsingToolbarLayout কী?

CollapsingToolbarLayout Toolbar-এর জন্য একটি কন্টেইনার যা স্ক্রোল করার সময় অ্যানিমেটেডভাবে সঙ্কুচিত হয়। CoordinatorLayout এবং AppBarLayout-এর সাথে ব্যবহৃত হয়। মোড সমর্থন করে: pin (স্থির), parallax (প্যারালাক্স প্রভাব)। হেডার ছবি সহ স্ক্রিনের জন্য আদর্শ (প্রোফাইল, বিস্তারিত পৃষ্ঠা)।

সারসংক্ষেপ

  • Toolbar একটি নমনীয় Android টুলবার যা ActionBar-কে প্রতিস্থাপন করেছে এবং Material Design-এর সাথে সম্পূর্ণ সংহত
  • Material 3 Top App Bar — চারটি ভিন্নতা: Small, Center-aligned, Medium, Large ভিন্ন স্ক্রোল আচরণ সহ
  • ActionBar একটি অপ্রচলিত সিস্টেম বার, কাস্টমাইজেশন এবং অ্যানিমেশনে সীমিত
  • মেনু এবং action items — always/ifRoom/never ফ্ল্যাগ সহ XML মেনুর মাধ্যমে সংহতি
  • CollapsingToolbarLayout — হেডার ছবি সহ স্ক্রিনের জন্য স্ক্রোল-এ Toolbar-এর অ্যানিমেটেড সঙ্কোচন
  • কাস্টমাইজেশন — লোগো, সাবটাইটেল, কাস্টম ভিউ, SearchView, PopupMenu এবং Material 3 রং
  • SearchView — ভয়েস ইনপুট এবং অটোকমপ্লিট সহ অনুসন্ধানের জন্য বিল্ট-ইন action view

আমরা একটি মোবাইল অ্যাপ্লিকেশন টার্নকি তৈরি করব

IT Sectr 2017 সাল থেকে স্টার্টআপ এবং ব্যবসার জন্য iOS এবং Android অ্যাপ্লিকেশন তৈরি করে। আমরা আপনাকে পরামর্শ দেব এবং সেরা সমাধান প্রস্তাব করব।

প্রকল্প নিয়ে আলোচনা করুন

আরও পড়ুন