কোটলিন ব্যবহার করে অ্যান্ড্রয়েডে ওভারফ্লো মেনু আইকন প্রোগ্রাম্যাটিক্যালি পরিবর্তন করা

ওভারভিউ

এই উদাহরণটি দেখায় কিভাবে Toolbar এবং onPrepareOptionsMenu() ব্যবহার করে অ্যান্ড্রয়েডে ওভারফ্লো মেনু (৩ ডট মেনু) এর আইকন এবং মেনু আইটেমের ভিজিবিলিটি ডাইনামিক্যালি পরিবর্তন করা যায়।

পূর্বশর্ত

• অ্যান্ড্রয়েড স্টুডিও (কোটলিন)
• Menu, MenuItem, Toolbar বেসিক জ্ঞান
• AppCompat লাইব্রেরি (material-components)

ধাপ ১: প্রজেক্ট তৈরি করুন

File → New Project → Empty Activity → Language: Kotlin।

ধাপ ২: লেআউট (res/layout/activity_main.xml)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="4dp"
    tools:context=".MainActivity">

    <androidx.appcompat.widget.Toolbar
        android:id="@+id/tootBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />

</LinearLayout>

ধাপ ৩: মেনু রিসোর্স (res/menu/menu.xml)

Right-click res → New → Android Resource Directory → Resource type: menu → ফাইল নাম menu.xml।

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:app="https://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/option1"
        android:icon="@drawable/ic_baseline_bluetooth_24"
        android:orderInCategory="1"
        android:title="Bluetooth"
        app:showAsAction="ifRoom" />

    <item
        android:id="@+id/option2"
        android:icon="@drawable/ic_baseline_call_24"
        android:orderInCategory="2"
        android:title="Call"
        app:showAsAction="ifRoom|collapseActionView" />

    <item
        android:id="@+id/option4"
        android:icon="@drawable/ic_baseline_chat_24"
        android:orderInCategory="3"
        android:title="Chat"
        android:visible="false"
        app:showAsAction="ifRoom|collapseActionView" />

    <item
        android:id="@+id/option3"
        android:orderInCategory="4"
        android:title="About"
        app:showAsAction="never" />

</menu>

ধাপ ৪: MainActivity.kt

package com.example.overflowmenu

import android.graphics.Color
import android.os.Bundle
import android.view.Menu
import android.view.MenuItem
import android.widget.Toast
import androidx.appcompat.widget.Toolbar
import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity() {

    lateinit var toolBar: Toolbar

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

        toolBar = findViewById(R.id.tootBar)
        toolBar.title = "MyToolBar"
        toolBar.setTitleTextColor(Color.WHITE)
        setSupportActionBar(toolBar) // Toolbar কে ActionBar হিসেবে সেট করুন
    }

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

    override fun onOptionsItemSelected(item: MenuItem): Boolean {
        return when (item.itemId) {
            R.id.option1 -> {
                Toast.makeText(applicationContext, "Bluetooth Option Selected", Toast.LENGTH_SHORT).show()
                true
            }
            R.id.option2 -> {
                Toast.makeText(applicationContext, "Call Option Selected", Toast.LENGTH_SHORT).show()
                true
            }
            R.id.option3 -> {
                Toast.makeText(applicationContext, "About Option Selected", Toast.LENGTH_SHORT).show()
                true
            }
            R.id.option4 -> {
                Toast.makeText(applicationContext, "Chat Option Selected", Toast.LENGTH_SHORT).show()
                true
            }
            else -> super.onOptionsItemSelected(item)
        }
    }

    // ডাইনামিক মেনু আপডেটের জন্য (প্রতিবার মেনু খোলার আগে কল হয়)
    override fun onPrepareOptionsMenu(menu: Menu): Boolean {
        // উদাহরণ: শর্তানুসারে আইটেম লুকান/দেখানো
        // menu.findItem(R.id.option2).isVisible = false
        // menu.findItem(R.id.option4).isVisible = true
        return super.onPrepareOptionsMenu(menu)
    }
}

ধাপ ৫: AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android"
    package="com.example.overflowmenu">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.AppCompat.Light.NoActionBar"> <!-- NoActionBar থিম ব্যবহার করুন -->

        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

    </application>
</manifest>

চলান ও ফলাফল

1. টুলবারের ডান পাশে ওভারফ্লো মেনু (৩ ডট) দেখাবে।
2. ক্লিক করলে "Bluetooth", "Call", "About" দেখাবে ("Chat" লুকানো আছে)।
3. আইটেম ক্লিক করলে টোস্ট দেখাবে।

ওভারফ্লো মেনু আইকন পরিবর্তন (প্রোগ্রাম্যাটিক্যালি)

টুলবারের ওভারফ্লো আইকন (৩ ডট) পরিবর্তন করতে:

// onCreate-এ setSupportActionBar()-এর পর
val overflowIcon = ContextCompat.getDrawable(this, R.drawable.custom_overflow_icon)
toolBar.setOverflowIcon(overflowIcon)

মেনু আইটেমের আইকন ডাইনামিক্যালি পরিবর্তন

override fun onPrepareOptionsMenu(menu: Menu): Boolean {
    val item = menu.findItem(R.id.option1)
    item.setIcon(ContextCompat.getDrawable(this, R.drawable.new_icon))
    return super.onPrepareOptionsMenu(menu)
}

বেস্ট প্র্যাকটিস

• Theme: Theme.MaterialComponents.DayNight.NoActionBar ব্যবহার করুন।
• Vector Drawable: আইকনে ভেক্টর ড্রয়েবল (.xml) ব্যবহার করুন (স্কেলেবল)।
• Material Design: MaterialToolbar (com.google.android.material.appbar.MaterialToolbar) ব্যবহার করুন।