Glance-এর সাহায্যে অ্যাপ উইজেট তৈরি করা

Glance-এর সাহায্যে কীভাবে একটি প্রাথমিক অ্যাপ উইজেট তৈরি করতে হয় তা নিম্নলিখিত বিভাগে বর্ণনা করা হয়েছে।

ম্যানিফেস্টে AppWidget ঘোষণা করুন

সেট-আপ ধাপ সম্পূর্ণ করার পরে, আপনার অ্যাপে AppWidget এবং এর মেটাডেটা ঘোষণা করুন।

1. GlanceAppWidgetReceiver থেকে AppWidget রিসিভার এক্সটেন্ড করুন:

   class MyAppWidgetReceiver : GlanceAppWidgetReceiver() {
       override val glanceAppWidget: GlanceAppWidget = TODO("Create GlanceAppWidget")
   }
   GlanceSnippets.kt

2. আপনার AndroidManifest.xml ফাইলে এবং সংশ্লিষ্ট মেটাডেটা ফাইলে অ্যাপ উইজেটের প্রদানকারীকে রেজিস্টার করুন:

       <receiver android:name=".glance.MyReceiver"
       android:exported="true">
       <intent-filter>
           <action android:name="android.appwidget.action.APPWIDGET_UPDATE" />
       </intent-filter>
       <meta-data
           android:name="android.appwidget.provider"
           android:resource="@xml/my_app_widget_info" />
   </receiver>
   AndroidManifest.xml
   

AppWidgetProviderInfo মেটাডেটা যোগ করুন

এরপরে, @xml/my_app_widget_info ফাইলে অ্যাপ উইজেট সংক্রান্ত তথ্য তৈরি ও সংজ্ঞায়িত করতে, উইজেট তৈরি করুন গাইড অনুসরণ করুন।

Glance-এর ক্ষেত্রে একমাত্র পার্থক্য হল, কোনও initialLayout XML নেই, কিন্তু আপনাকে অবশ্যই একটি নির্ধারণ করতে হবে। আপনি লাইব্রেরিতে প্রদত্ত পূর্বনির্ধারিত লোডিং লেআউট ব্যবহার করতে পারেন:

<appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android"
    android:initialLayout="@layout/glance_default_loading_layout">
</appwidget-provider>
my_app_widget_info.xml

AppWidgetProviderInfo XML ঘোষণা করা

AppWidgetProviderInfo অবজেক্ট আপনার উইজেটের গুরুত্বপূর্ণ কোয়ালিটি নির্ধারণ করে। <appwidget-provider> এলিমেন্টের মধ্যে আপনার XML মেটাডেটা রিসোর্স ফাইলে AppWidgetProviderInfo ডিফাইন করুন (res/xml/my_app_widget_info.xml):

<appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android"
    android:minWidth="40dp"
    android:minHeight="40dp"
    android:targetCellWidth="1"
    android:targetCellHeight="1"
    android:maxResizeWidth="250dp"
    android:maxResizeHeight="120dp"
    android:updatePeriodMillis="86400000"
    android:description="@string/example_appwidget_description"
    android:previewLayout="@layout/example_appwidget_preview"
    android:initialLayout="@layout/glance_default_loading_layout"
    android:configure="com.example.android.ExampleAppWidgetConfigurationActivity"
    android:resizeMode="horizontal|vertical"
    android:widgetCategory="home_screen"
    android:widgetFeatures="reconfigurable|configuration_optional">
</appwidget-provider>

উইজেটের সাইজ সংক্রান্ত অ্যাট্রিবিউট

ডিফল্ট হোম স্ক্রিন, সেলের গ্রিডের উপর ভিত্তি করে উইন্ডোতে উইজেট প্লেস করে যেগুলির নির্দিষ্ট উচ্চতা ও প্রস্থ আছে। বেশিরভাগ হোম স্ক্রিনে উইজেটকে শুধুমাত্র গ্রিড সেলের পূর্ণ সংখ্যায় গুণিতক সাইজ নিতে দেওয়া হয়—যেমন, দুটি সেল হরাইজন্টালি ও তিনটি সেল ভার্টিকালি।

উইজেটের সাইজ সংক্রান্ত অ্যাট্রিবিউট আপনাকে উইজেটের ডিফল্ট সাইজ নির্দিষ্ট করতে এবং উইজেটের সাইজের নিম্ন ও উচ্চ সীমা প্রদান করতে দেয়। এই প্রসঙ্গে, উইজেটের ডিফল্ট সাইজ হল সেই সাইজ যা উইজেটটি প্রথমবার হোম স্ক্রিনে যোগ করার সময় নেয়।

নিচের সারণীতে উইজেটের সাইজ সংক্রান্ত <appwidget-provider> অ্যাট্রিবিউট সম্পর্কে বর্ণনা করা হয়েছে:

উদাহরণ

পূর্ববর্তী সারণীতে অ্যাট্রিবিউট কীভাবে উইজেটের সাইজকে প্রভাবিত করে তা বোঝাতে, নিম্নলিখিত স্পেসিফিকেশন ধরে নিন:

• গ্রিড সেল ৩০ dp চওড়া ও ৫০ dp লম্বা।
• নিম্নলিখিত অ্যাট্রিবিউট স্পেসিফিকেশন প্রদান করা হয়েছে:

<appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android"
    android:minWidth="80dp"
    android:minHeight="80dp"
    android:targetCellWidth="2"
    android:targetCellHeight="2"
    android:minResizeWidth="40dp"
    android:minResizeHeight="40dp"
    android:maxResizeWidth="120dp"
    android:maxResizeHeight="120dp"
    android:resizeMode="horizontal|vertical" />

Android 12 থেকে শুরু করে:

উইজেটের ডিফল্ট সাইজ হিসেবে targetCellWidth ও targetCellHeight অ্যাট্রিবিউট ব্যবহার করুন।

ডিফল্ট হিসেবে উইজেটের সাইজ ২x২ হয়। উইজেটের সাইজ কমিয়ে ২x১ বা বাড়িয়ে ৪x৩ করা যেতে পারে।

Android 11 ও তার আগের যেকোনও ভার্সনে:

উইজেটের ডিফল্ট সাইজ গণনা করতে minWidth ও minHeight অ্যাট্রিবিউট ব্যবহার করুন।

ডিফল্ট প্রস্থ = Math.ceil(80 / 30) = ৩

ডিফল্ট উচ্চতা = Math.ceil(80 / 50) = ২

ডিফল্ট হিসেবে উইজেটের সাইজ ৩x২ হয়। উইজেটটি ২x১ সাইজ পর্যন্ত ছোট করা বা ফুল-স্ক্রিন পর্যন্ত বড় করা যেতে পারে।

অতিরিক্ত উইজেট অ্যাট্রিবিউট

নিচের সারণীতে উইজেটের সাইজ ছাড়া অন্যান্য কোয়ালিটি সম্পর্কিত <appwidget-provider> অ্যাট্রিবিউট বর্ণনা করা হয়েছে।

GlanceAppWidget-এর সংজ্ঞা দাও

1. GlanceAppWidget থেকে এক্সটেন্ড করে এবং provideGlance মেথডকে ওভাররাইড করে এমন একটি নতুন ক্লাস তৈরি করুন। এটি এমন একটি পদ্ধতি যেখানে আপনি সেই ডেটা লোড করতে পারবেন যা আপনার উইজেট রেন্ডার করার জন্য প্রয়োজন:

   class MyAppWidget : GlanceAppWidget() {
   
       override suspend fun provideGlance(context: Context, id: GlanceId) {
   
           // In this method, load data needed to render the AppWidget.
           // Use `withContext` to switch to another thread for long running
           // operations.
   
           provideContent {
               // create your AppWidget here
               Text("Hello World")
           }
       }
   }
   GlanceSnippets.kt

2. আপনার GlanceAppWidgetReceiver-এ glanceAppWidget-এ এটি ইনস্ট্যানশিয়েট করুন:

   class MyAppWidgetReceiver : GlanceAppWidgetReceiver() {
   
       // Let MyAppWidgetReceiver know which GlanceAppWidget to use
       override val glanceAppWidget: GlanceAppWidget = MyAppWidget()
   }
   GlanceSnippets.kt

আপনি এখন Glance ব্যবহার করে AppWidget কনফিগার করেছেন।

উইজেট ব্রডকাস্ট ম্যানেজ করতে GlanceAppWidgetReceiver ক্লাস ব্যবহার করুন

GlanceAppWidgetReceiver কোঅর্ডিনেট উইজেট ব্রডকাস্ট করে এবং প্ল্যাটফর্মের স্ট্যাটাস আপডেট করে, এর জন্য অন্তর্নিহিত AppWidgetProvider-কে এক্সটেন্ড করা হয়। আপনার উইজেট আপডেট, মুছে ফেলা, চালু বা বন্ধ করা হলে এটি প্ল্যাটফর্ম ইভেন্ট পায়, সেগুলি Compose লাইফসাইকেল অনুরোধে ট্রান্সলেট করে।

ম্যানিফেস্টে উইজেট ঘোষণা করা

আপনার GlanceAppWidgetReceiver ক্লাস সাবক্লাসকে আপনার AndroidManifest.xml ফাইলে ব্রডকাস্ট রিসিভার হিসেবে ঘোষণা করুন:

<receiver android:name="MyReceiver"
          android:exported="false">
    <intent-filter>
        <action android:name="android.appwidget.action.APPWIDGET_UPDATE" />
    </intent-filter>
    <meta-data android:name="android.appwidget.provider"
               android:resource="@xml/my_app_widget_info" />
</receiver>

<receiver> এলিমেন্টে android:name অ্যাট্রিবিউট থাকতে হবে, যা প্রাপক ক্লাস নির্দিষ্ট করে। প্রাপককে অবশ্যই <intent-filter>-এর মধ্যে ACTION_APPWIDGET_UPDATE ব্রডকাস্ট অ্যাকশন গ্রহণ করতে হবে।

<meta-data> এলিমেন্টকে অবশ্যই নিজের নাম android.appwidget.provider হিসেবে শনাক্ত করতে হবে এবং android:resource অ্যাট্রিবিউটকে অবশ্যই আপনার AppWidgetProviderInfo XML মেটাডেটা রিসোর্সের (@xml/my_app_widget_info) দিকে পয়েন্ট করতে হবে।

GlanceAppWidgetReceiver ক্লাস প্রয়োগ করা

Glance-এ, আপনি সরাসরি AppWidgetProvider-এর পরিবর্তে GlanceAppWidgetReceiver এক্সটেন্ড করেন। আপনার রিসিভারকে আপনার GlanceAppWidget ইন্সট্যান্সের সাথে লিঙ্ক করে এটি প্রয়োগ করুন। -এ উপলভ্য প্রাথমিক কলব্যাক GlanceAppWidgetReceiver নিম্নলিখিতভাবে কাজ করে:

• onUpdate(): কম্পোজিশন আপডেট কার্যকর করতে Glance অটোমেটিক ওভাররাইড করে। আপনি ম্যানুয়ালি onUpdate ওভাররাইড করলে, Glance-কে কম্পোজিশন থ্রেড সফলভাবে লঞ্চ করার অনুমতি দিতে আপনাকে অবশ্যই কল করতে হবে super.onUpdate।
• onAppWidgetOptionsChanged(): উইজেট প্রথমবার প্লেস করা হলে বা সাইজ পরিবর্তন করা হলে কল করা হয়। Glance রিড বিকল্পগুলি ব্যাকগ্রাউন্ডে আইটেম বান্ডেল করে, যাতে রানটাইম ডাইমেনশনের উপর ভিত্তি করে আপনার লেআউট নিখুঁতভাবে অ্যাডজাস্ট হয়।
• onDeleted(Context, IntArray): ব্যবহারকারী কোনও নির্দিষ্ট উইজেট ইনস্ট্যান্স মুছে দিলে এটি চালু হয়।
• onEnabled(Context): আপনার উইজেটের প্রথম ইনস্ট্যান্স সফলভাবে তৈরি হলে ট্রিগার হয়। গ্লোবাল মাইগ্রেশন চালানোর জন্য অসাধারণ।
• onDisabled(Context): প্রোভাইডারের শেষ অ্যাক্টিভ ইনস্ট্যান্স সরিয়ে দেওয়া হলে কল করা হয়।
• onReceive(Context, Intent): নির্দিষ্ট কলব্যাক পদ্ধতির আগে প্রতিটি প্ল্যাটফর্ম ব্রডকাস্ট ইন্টারসেপ্ট করে। আপনি যে কাস্টম রিসিভার লজিক লেখেন তা super.onReceive(context, intent) কল করে এবং কখনও কল করে না goAsync কারণ Glance অটোমেটিক অ্যাসিঙ্ক্রোনাস পদ্ধতিতে কাজ রাউট করে।

উইজেট ব্রডকাস্ট ইনটেন্ট পাওয়া

GlanceAppWidgetReceiver নিম্নলিখিত ফাউন্ডেশনাল প্ল্যাটফর্ম উইজেট ব্রডকাস্ট ইনটেন্ট ফিল্টার ও হ্যান্ডেল করে:

• ACTION_APPWIDGET_UPDATE
• ACTION_APPWIDGET_DELETED
• ACTION_APPWIDGET_ENABLED
• ACTION_APPWIDGET_DISABLED
• ACTION_APPWIDGET_OPTIONS_CHANGED

UI তৈরি করা

UI কীভাবে তৈরি করতে হয় তা নিম্নলিখিত স্নিপেট থেকে বোঝা যাবে:

/* Import Glance Composables
 In the event there is a name clash with the Compose classes of the same name,
 you may rename the imports per https://kotlinlang.org/docs/packages.html#imports
 using the `as` keyword.

import androidx.glance.Button
import androidx.glance.layout.Column
import androidx.glance.layout.Row
import androidx.glance.text.Text
*/
class MyAppWidget : GlanceAppWidget() {

    override suspend fun provideGlance(context: Context, id: GlanceId) {
        // Load data needed to render the AppWidget.
        // Use `withContext` to switch to another thread for long running
        // operations.

        provideContent {
            // create your AppWidget here
            MyContent()
        }
    }

    @Composable
    private fun MyContent() {
        Column(
            modifier = GlanceModifier.fillMaxSize(),
            verticalAlignment = Alignment.Top,
            horizontalAlignment = Alignment.CenterHorizontally
        ) {
            Text(text = "Where to?", modifier = GlanceModifier.padding(12.dp))
            Row(horizontalAlignment = Alignment.CenterHorizontally) {
                Button(
                    text = "Home",
                    onClick = actionStartActivity<MyActivity>()
                )
                Button(
                    text = "Work",
                    onClick = actionStartActivity<MyActivity>()
                )
            }
        }
    }
}
GlanceSnippets.kt

আগের কোড স্যাম্পেলটি নিম্নলিখিত কাজগুলি করে:

• সবচেয়ে উপরের লেভেলে Column, আইটেমগুলি উল্লম্বভাবে একটির পরে একটি করে সাজানো হয়।
• উপলভ্য স্পেসের সাথে মানানসই হতে Column-এর সাইজ বড় করা হয় (এর মাধ্যমে GlanceModifier এবং এর কন্টেন্ট উপরের দিকে (verticalAlignment) অ্যালাইন করা হয় এবং এটি অনুভূমিকভাবে সেন্টারে রাখা হয় (horizontalAlignment)।
• Column-এর কন্টেন্ট ল্যাম্বডা ব্যবহার করে সংজ্ঞায়িত করা হয়। ক্রম গুরুত্বপূর্ণ।
  • Column-এর প্রথম আইটেমটি হল Text কম্পোনেন্ট যার 12.dp প্যাডিং আছে।
  • দ্বিতীয় আইটেমটি হল Row, যেখানে আইটেমগুলি অনুভূমিকভাবে একটি পরে একটি করে রাখা হয়, সাথে দুটি Buttons অনুভূমিকভাবে কেন্দ্রে রাখা হয় (horizontalAlignment)। চূড়ান্ত ডিসপ্লে উপলভ্য স্পেসের উপর নির্ভর করে। নিচের ছবিটি থেকে আপনি বুঝতে পারবেন যে এটি দেখতে কেমন হতে পারে:

কম্পোনেন্টের প্লেসমেন্ট ও সাইজ পরিবর্তন করতে, আপনি অ্যালাইনমেন্ট ভ্যালু পরিবর্তন করতে পারেন অথবা আলাদা মডিফায়ার ভ্যালু (যেমন প্যাডিং) প্রয়োগ করতে পারেন। প্রতিটি ক্লাসের জন্য কম্পোনেন্ট, প্যারামিটার ও উপলভ্য মডিফায়ারের সম্পূর্ণ তালিকা পেতে রেফারেন্স ডকুমেন্টেশন দেখুন।

গোলাকার কোণ প্রয়োগ করা

Android 12, আপনার অ্যাপ উইজেটের কোণের ব্যাসার্ধ ডায়নামিক কাস্টমাইজ করার জন্য সিস্টেম প্যারামিটার চালু করে:

• system_app_widget_background_radius: উইজেট ব্যাকগ্রাউন্ড কন্টেনারের কোণের রেডিয়াস নির্দিষ্ট করে (কখনও ২৮ dp-এর চেয়ে বড় নয়)।
• ভেতরের ব্যাসার্ধ: কন্টেন্ট ক্লিপিং প্রতিরোধ করতে, সিস্টেম ব্যাকগ্রাউন্ড আউটলাইনের উপর ভিত্তি করে আপনার ভেতরের কন্টেন্টের জন্য একটি আনুপাতিক ব্যাসার্ধ গণনা করুন: systemRadiusValue - widgetPadding

Glance-এ, আপনি কম্পোজিশনে GlanceModifier.cornerRadius(android.R.dimen.system_app_widget_background_radius) ব্যবহার করে কোণের রেডিয়াস সাইজিং প্রপার্টি ডায়নামিক প্রয়োগ করতে পারবেন।

Android 11 (API লেভেল 30) বা এর নিচের ভার্সনে চলা ডিভাইসে পুরনো মানানসই ভার্সনের জন্য, কাস্টম অ্যাট্রিবিউট ও কাস্টম থিম রিসোর্স ফলব্যাক প্রয়োগ করুন:

• /values/attrs.xml

  <resources>
  <attr name="backgroundRadius" format="dimension" />
  </resources>
  

• /values/styles.xml

  <resources>
  <style name="MyWidgetTheme">
    <item name="backgroundRadius">@dimen/my_background_radius_dimen</item>
  </style>
  </resources>
  

• /values-31/styles.xml

  <resources>
  <style name="MyWidgetTheme" parent="@android:style/Theme.DeviceDefault.DayNight">
    <item name="backgroundRadius">@android:dimen/system_app_widget_background_radius</item>
  </style>
  </resources>
  

• /drawable/my_widget_background.xml

  <shape xmlns:android="http://schemas.android.com/apk/res/android"
  android:shape="rectangle">
  <corners android:radius="?attr/backgroundRadius" />
  </shape>