অ্যান্ড্রয়েডে ট্রান্সপারেন্ট স্ট্যাটাসবার এবং একশনবার কীভাবে তৈরি করবেন?

Window Flags এবং Styles ব্যবহার করে ট্রান্সপারেন্ট সিস্টেম বারস

এই টিউটোরিয়ালটি দেখায় কীভাবে স্ট্যাটাস বার এবং একশনবার (টুলবার) ট্রান্সপারেন্ট করে কন্টেন্টকে পূর্ণ স্ক্রিনে বিতান করা যায়।

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

Android Studio-তে নতুন প্রজেক্ট।

ধাপ ২: লেআউট (activity_main.xml) - ফুলস্ক্রিন ড্র সক্ষম

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:app="https://schemas.android.com/apk/res-auto"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:background="#222222"
    android:fitsSystemWindows="true">
    
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
        
</androidx.constraintlayout.widget.ConstraintLayout>

ধাপ ৩: MainActivity.java

package com.app.sample;

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

ধাপ ৪: Styles (res/values/styles.xml) - কী পদ্ধতি

<resources>
    <!-- Base theme -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

    <!-- ট্রান্সপারেন্ট একশনবার থিম -->
    <style name="AppTheme.ActionBar.Transparent" parent="AppTheme">
        <!-- একশনবার ছায়া সরান -->
        <item name="android:windowContentOverlay">@null</item>
        <!-- কন্টেন্ট একশনবারের নিচে যাবে -->
        <item name="windowActionBarOverlay">true</item>
        <!-- একশনবার ব্যাকগ্রাউন্ড ট্রান্সপারেন্ট -->
        <item name="colorPrimary">@android:color/transparent</item>
    </style>
    
    <!-- ফুল ট্রান্সপারেন্ট (স্ট্যাটাসবার + একশনবার) -->
    <style name="AppTheme.TransparentBars" parent="AppTheme">
        <item name="android:windowTranslucentStatus">true</item>
        <item name="android:windowTranslucentNavigation">true</item>
        <item name="windowActionBarOverlay">true</item>
        <item name="android:windowContentOverlay">@null</item>
        <item name="colorPrimary">@android:color/transparent</item>
    </style>
</resources>

ধাপ ৫: AndroidManifest.xml - থিম প্রয়োগ

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android"
    package="com.app.sample">
    <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/AppTheme">
        
        <activity 
            android:name=".MainActivity" 
            android:theme="@style/AppTheme.ActionBar.Transparent">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        
    </application>
</manifest>

আধুনিক পদ্ধতি (API 21+ / Material 3)

<!-- res/values-v21/styles.xml -->
<style name="AppTheme.TransparentBars" parent="Theme.Material3.DayNight.NoActionBar">
    <item name="android:windowTranslucentStatus">true</item>
    <item name="android:windowTranslucentNavigation">true</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
    <item name="android:navigationBarColor">@android:color/transparent</item>
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
</style>

জাভা/কোটলিনে প্রোগ্রামেটিক্যালি (API 23+)

// MainActivity.java onCreate-এ
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
    getWindow().getDecorView().setSystemUiVisibility(
        View.SYSTEM_UI_FLAG_LAYOUT_STABLE
        | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
        | View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR); // ডার্ক আইকন
    
    getWindow().setStatusBarColor(Color.TRANSPARENT);
    getWindow().setNavigationBarColor(Color.TRANSPARENT);
}

// কোটলিন এক্সটেনশন
fun Activity.makeStatusBarTransparent() {
    window.apply {
        decorView.systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
        statusBarColor = Color.TRANSPARENT
        navigationBarColor = Color.TRANSPARENT
    }
}

গুরুত্বপূর্ণ বিবেচনা

• android:fitsSystemWindows="true" রুট লেআউটে যোগ করুন যাতে কন্টেন্ট সিস্টেম বারসের নিচে না যায়
• স্ট্যাটাসবার আইকন রঙ: SYSTEM_UI_FLAG_LIGHT_STATUS_BAR (ডার্ক আইকন) বা সরিয়ে দিন (লাইট আইকন)
• নেভিগেশনবার হ্যান্ডলিং: জেসচার নেভিগেশনে আচরণ ভিন্ন হতে পারে
• Edge-to-Edge Enablement (API 35+): WindowCompat.setDecorFitsSystemWindows(window, false)