অ্যান্ড্রয়েড প্ল্যাটফর্ম সিস্টেম UI আঁকার জন্য দায়ী, যেমন স্ট্যাটাস বার এবং নেভিগেশন বার। ব্যবহারকারী কোন অ্যাপ ব্যবহার করছেন তা নির্বিশেষে এই সিস্টেম UI প্রদর্শিত হয়।
WindowInsets
সিস্টেম UI সম্পর্কে তথ্য প্রদান করে যাতে আপনার অ্যাপটি সঠিক এলাকায় আঁকা হয় এবং আপনার UI সিস্টেম UI দ্বারা অস্পষ্ট না হয়।
![সিস্টেম বারের পিছনে আঁকতে প্রান্ত থেকে প্রান্তে যাওয়া](https://developer.android.com/static/develop/ui/compose/images/layouts/insets/e2e-intro.gif?authuser=4&hl=bn)
অ্যান্ড্রয়েড 14 (এপিআই লেভেল 34) এবং তার নিচে, আপনার অ্যাপের UI ডিফল্টরূপে সিস্টেম বার এবং ডিসপ্লে কাটআউটগুলির নীচে আঁকা হয় না।
অ্যান্ড্রয়েড 15 (এপিআই লেভেল 35) এবং উচ্চতর সংস্করণে, আপনার অ্যাপটি সিস্টেম বারের নীচে ড্র করে এবং একবার আপনার অ্যাপটি SDK 35 কে লক্ষ্য করে কাটআউটগুলি প্রদর্শন করে। এর ফলে ব্যবহারকারীর আরও বিরামবিহীন অভিজ্ঞতা হয় এবং আপনার অ্যাপকে উপলব্ধ উইন্ডো স্পেসের সম্পূর্ণ সুবিধা নিতে দেয় এটা
সিস্টেম UI এর পিছনে সামগ্রী প্রদর্শন করাকে বলা হয় এজ-টু-এজ । এই পৃষ্ঠায়, আপনি বিভিন্ন ধরণের ইনসেট সম্পর্কে শিখবেন, কীভাবে এজ-টু-এজ যেতে হবে এবং কীভাবে আপনার UI অ্যানিমেট করতে ইনসেট APIগুলি ব্যবহার করবেন এবং আপনার অ্যাপের সামগ্রী সিস্টেম UI উপাদানগুলির দ্বারা অস্পষ্ট নয় তা নিশ্চিত করুন৷
ইনসেট মৌলিক
যখন একটি অ্যাপ এজ-টু-এজ যায়, আপনাকে নিশ্চিত করতে হবে যে গুরুত্বপূর্ণ বিষয়বস্তু এবং মিথস্ক্রিয়াগুলি সিস্টেম UI দ্বারা অস্পষ্ট না হয়। উদাহরণস্বরূপ, যদি নেভিগেশন বারের পিছনে একটি বোতাম রাখা হয়, ব্যবহারকারী এটি ক্লিক করতে সক্ষম নাও হতে পারে।
সিস্টেম UI এর আকার এবং এটি কোথায় স্থাপন করা হয়েছে সে সম্পর্কে তথ্য ইনসেটের মাধ্যমে নির্দিষ্ট করা হয়।
সিস্টেম UI-এর প্রতিটি অংশে একটি সংশ্লিষ্ট ধরনের ইনসেট রয়েছে যা এর আকার এবং এটি কোথায় স্থাপন করা হয়েছে তা বর্ণনা করে। উদাহরণস্বরূপ, স্ট্যাটাস বার ইনসেটগুলি স্ট্যাটাস বারের আকার এবং অবস্থান প্রদান করে, যেখানে নেভিগেশন বার ইনসেটগুলি নেভিগেশন বারের আকার এবং অবস্থান প্রদান করে। প্রতিটি ধরণের ইনসেট চারটি পিক্সেল মাত্রা নিয়ে গঠিত: উপরে, বাম, ডান এবং নীচে। এই মাত্রাগুলি অ্যাপের উইন্ডোর সংশ্লিষ্ট দিক থেকে সিস্টেম UI কতদূর প্রসারিত তা নির্দিষ্ট করে৷ এই ধরনের সিস্টেম UI এর সাথে ওভারল্যাপিং এড়াতে, তাই, অ্যাপ UI অবশ্যই সেই পরিমাণ দ্বারা ইনসেট করতে হবে।
এই অন্তর্নির্মিত Android ইনসেট প্রকারগুলি WindowInsets
এর মাধ্যমে উপলব্ধ:
স্ট্যাটাস বার বর্ণনাকারী ইনসেট। এগুলি হল শীর্ষ সিস্টেম UI বার যাতে বিজ্ঞপ্তি আইকন এবং অন্যান্য সূচক রয়েছে৷ | |
যখন তারা দৃশ্যমান হয় তখন স্ট্যাটাস বার ইনসেট করে। যদি স্ট্যাটাস বারগুলি বর্তমানে লুকানো থাকে (ইমারসিভ পূর্ণ স্ক্রীন মোডে প্রবেশ করার কারণে), তাহলে প্রধান স্ট্যাটাস বার ইনসেটগুলি খালি থাকবে, কিন্তু এই ইনসেটগুলি খালি থাকবে না। | |
ন্যাভিগেশন বার বর্ণনাকারী ইনসেট। এগুলি হল ডিভাইসের বাম, ডান বা নীচের দিকে সিস্টেম UI বার, টাস্কবার বা নেভিগেশন আইকনগুলি বর্ণনা করে৷ এগুলি ব্যবহারকারীর পছন্দের নেভিগেশন পদ্ধতি এবং টাস্কবারের সাথে ইন্টারঅ্যাক্ট করার উপর ভিত্তি করে রানটাইমে পরিবর্তন করতে পারে। | |
ন্যাভিগেশন বার যখন তারা দৃশ্যমান হয় তার জন্য ইনসেট করে। যদি নেভিগেশন বারগুলি বর্তমানে লুকানো থাকে (ইমারসিভ পূর্ণ স্ক্রিন মোডে প্রবেশ করার কারণে), তবে প্রধান নেভিগেশন বার ইনসেটগুলি খালি থাকবে, তবে এই ইনসেটগুলি খালি থাকবে না। | |
উপরের শিরোনাম দণ্ডের মতো একটি ফ্রিফর্ম উইন্ডোতে থাকলে সিস্টেম UI উইন্ডোর সাজসজ্জার বর্ণনা দেয় ইনসেট। | |
ক্যাপশন বার যখন দৃশ্যমান হয় তার জন্য ইনসেট করে। যদি ক্যাপশন বারগুলি বর্তমানে লুকানো থাকে, তাহলে প্রধান ক্যাপশন বার ইনসেটগুলি খালি থাকবে, কিন্তু এই ইনসেটগুলি খালি থাকবে না৷ | |
সিস্টেম বার ইনসেটগুলির মিলন, যার মধ্যে স্ট্যাটাস বার, নেভিগেশন বার এবং ক্যাপশন বার অন্তর্ভুক্ত। | |
যখন তারা দৃশ্যমান হয় তখন সিস্টেম বার ইনসেট করে। যদি সিস্টেম বারগুলি বর্তমানে লুকানো থাকে (ইমারসিভ পূর্ণ স্ক্রীন মোডে প্রবেশ করার কারণে), তাহলে প্রধান সিস্টেম বার ইনসেটগুলি খালি থাকবে, কিন্তু এই ইনসেটগুলি খালি থাকবে না৷ | |
সফ্টওয়্যার কীবোর্ডের নিচের অংশে কতটা জায়গা আছে তা বর্ণনা করে ইনসেটগুলি। | |
বর্তমান কীবোর্ড অ্যানিমেশনের আগে সফ্টওয়্যার কীবোর্ড যে পরিমাণ স্থান দখল করেছিল তা বর্ণনা করে ইনসেটগুলি৷ | |
বর্তমান কীবোর্ড অ্যানিমেশনের পরে সফ্টওয়্যার কীবোর্ড যে পরিমাণ স্থান দখল করবে তা বর্ণনা করে ইনসেটগুলি৷ | |
ন্যাভিগেশন UI সম্পর্কে আরও বিশদ তথ্য বর্ণনা করে এমন এক ধরনের ইনসেট, যেখানে "ট্যাপ" সিস্টেম দ্বারা পরিচালনা করা হবে, অ্যাপ নয়। অঙ্গভঙ্গি নেভিগেশন সহ স্বচ্ছ নেভিগেশন বারগুলির জন্য, কিছু অ্যাপ উপাদান সিস্টেম নেভিগেশন UI এর মাধ্যমে ট্যাপযোগ্য হতে পারে। | |
ট্যাপযোগ্য উপাদানটি কখন দৃশ্যমান হয় তার জন্য ইনসেট করে। যদি ট্যাপযোগ্য উপাদানগুলি বর্তমানে লুকানো থাকে (ইমারসিভ পূর্ণ স্ক্রিন মোডে প্রবেশ করার কারণে), তাহলে প্রধান ট্যাপযোগ্য উপাদান ইনসেটগুলি খালি থাকবে, তবে এই ইনসেটগুলি খালি থাকবে না। | |
ইনসেটগুলি ইনসেটের পরিমাণ প্রতিনিধিত্ব করে যেখানে সিস্টেম নেভিগেশনের জন্য অঙ্গভঙ্গিগুলিকে বাধা দেবে৷ অ্যাপগুলি | |
সিস্টেমের অঙ্গভঙ্গির একটি উপসেট যা সবসময় সিস্টেম দ্বারা পরিচালনা করা হবে এবং যা | |
ডিসপ্লে কাটআউট (খাঁজ বা পিনহোল) দিয়ে ওভারল্যাপিং এড়ানোর জন্য প্রয়োজনীয় ব্যবধানের পরিমাণ প্রতিনিধিত্বকারী ইনসেটগুলি। | |
একটি জলপ্রপাত প্রদর্শনের বাঁকা এলাকা প্রতিনিধিত্বকারী ইনসেট। একটি জলপ্রপাত ডিসপ্লেতে পর্দার প্রান্ত বরাবর বাঁকা এলাকা রয়েছে যেখানে স্ক্রীনটি ডিভাইসের পাশে মোড়ানো শুরু করে। |
এই ধরনের তিনটি "নিরাপদ" ইনসেট প্রকার দ্বারা সংক্ষিপ্ত করা হয় যা নিশ্চিত করে যে বিষয়বস্তু অস্পষ্ট নয়:
অন্তর্নিহিত প্ল্যাটফর্ম ইনসেটগুলির উপর ভিত্তি করে এই "নিরাপদ" ইনসেট প্রকারগুলি বিভিন্ন উপায়ে সামগ্রীকে রক্ষা করে:
- কোন সিস্টেম UI এর নিচে আঁকা উচিত নয় এমন সামগ্রী রক্ষা করতে
WindowInsets.safeDrawing
ব্যবহার করুন। এটি ইনসেটগুলির সবচেয়ে সাধারণ ব্যবহার: সিস্টেম UI (হয় আংশিকভাবে বা সম্পূর্ণ) দ্বারা অস্পষ্ট বিষয়বস্তু অঙ্কন প্রতিরোধ করতে। - অঙ্গভঙ্গি সহ বিষয়বস্তু রক্ষা করতে
WindowInsets.safeGestures
ব্যবহার করুন। এটি সিস্টেমের অঙ্গভঙ্গিগুলিকে অ্যাপের অঙ্গভঙ্গির সাথে সংঘর্ষে এড়ায় (যেমন নীচের শীট, ক্যারোসেল বা গেমগুলিতে)। -
WindowInsets.safeContent
ব্যবহার করুনWindowInsets.safeDrawing
এবংWindowInsets.safeGestures
এর সংমিশ্রণ হিসাবে কনটেন্টের কোনও ভিজ্যুয়াল ওভারল্যাপ নেই এবং কোনও অঙ্গভঙ্গি ওভারল্যাপ নেই।
ইনসেট সেটআপ
আপনার অ্যাপটি কোথায় বিষয়বস্তু আঁকে তার উপর সম্পূর্ণ নিয়ন্ত্রণের অনুমতি দিতে, এই সেটআপ পদক্ষেপগুলি অনুসরণ করুন৷ এই পদক্ষেপগুলি ছাড়া, আপনার অ্যাপটি সিস্টেম UI এর পিছনে কালো বা শক্ত রঙ আঁকতে পারে, বা সফ্টওয়্যার কীবোর্ডের সাথে সিঙ্ক্রোনাসভাবে অ্যানিমেট করতে পারে না।
- Android 15 এবং উচ্চতর সংস্করণে এজ-টু-এজ প্রয়োগ করতে SDK 35 বা তার পরে লক্ষ্য করুন। আপনার অ্যাপটি সিস্টেম UI এর পিছনে প্রদর্শিত হয়। আপনি ইনসেটগুলি পরিচালনা করে আপনার অ্যাপের UI সামঞ্জস্য করতে পারেন।
- ঐচ্ছিকভাবে,
Activity.onCreate()
-এenableEdgeToEdge()
কল করুন, যা আপনার অ্যাপকে পূর্ববর্তী অ্যান্ড্রয়েড সংস্করণে এজ-টু-এজ হতে দেয়। আপনার কার্যকলাপের
AndroidManifest.xml
এন্ট্রিতেandroid:windowSoftInputMode="adjustResize"
সেট করুন। এই সেটিংটি আপনার অ্যাপটিকে সফ্টওয়্যার IME-এর আকার ইনসেট হিসাবে গ্রহণ করার অনুমতি দেয়, যেটি আপনি আপনার অ্যাপে IME প্রদর্শিত এবং অদৃশ্য হয়ে গেলে যথাযথভাবে সামগ্রী প্যাড করতে এবং লেআউট করতে ব্যবহার করতে পারেন৷<!-- in your AndroidManifest.xml file: --> <activity android:name=".ui.MainActivity" android:label="@string/app_name" android:windowSoftInputMode="adjustResize" android:theme="@style/Theme.MyApplication" android:exported="true">
এপিআই রচনা করুন
একবার আপনার কার্যকলাপ সমস্ত ইনসেট পরিচালনার নিয়ন্ত্রণ নিয়ে নিলে, আপনি কন্টেন্ট যাতে অস্পষ্ট না হয় এবং ইন্টারঅ্যাক্টেবল উপাদানগুলি সিস্টেম UI এর সাথে ওভারল্যাপ না হয় তা নিশ্চিত করতে আপনি কম্পোজ API ব্যবহার করতে পারেন। এই APIগুলি ইনসেট পরিবর্তনগুলির সাথে আপনার অ্যাপের লেআউটকেও সিঙ্ক্রোনাইজ করে৷
উদাহরণস্বরূপ, এটি আপনার সম্পূর্ণ অ্যাপের সামগ্রীতে ইনসেটগুলি প্রয়োগ করার সবচেয়ে মৌলিক পদ্ধতি:
override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) enableEdgeToEdge() setContent { Box(Modifier.safeDrawingPadding()) { // the rest of the app } } }
এই স্নিপেটটি অ্যাপের সম্পূর্ণ বিষয়বস্তুর চারপাশে প্যাডিং হিসাবে safeDrawing
উইন্ডো ইনসেটগুলিকে প্রয়োগ করে৷ যদিও এটি নিশ্চিত করে যে ইন্টারঅ্যাক্টেবল উপাদানগুলি সিস্টেম UI এর সাথে ওভারল্যাপ করে না, এর মানে হল যে কোনও অ্যাপই এজ-টু-এজ ইফেক্ট অর্জন করতে সিস্টেম UI এর পিছনে থাকবে না। সম্পূর্ণ উইন্ডোটির সম্পূর্ণ ব্যবহার করার জন্য, আপনাকে সূক্ষ্ম-টিউন করতে হবে যেখানে ইনসেটগুলি স্ক্রীন-বাই-স্ক্রিন বা উপাদান-দ্বারা-কম্পোনেন্ট ভিত্তিতে প্রয়োগ করা হয়।
এই সমস্ত ইনসেট প্রকারগুলি API 21 এ ব্যাকপোর্ট করা IME অ্যানিমেশনগুলির সাথে স্বয়ংক্রিয়ভাবে অ্যানিমেটেড হয়৷ এক্সটেনশনের মাধ্যমে, এই ইনসেটগুলি ব্যবহার করে আপনার সমস্ত লেআউটগুলিও ইনসেট মান পরিবর্তনের সাথে সাথে স্বয়ংক্রিয়ভাবে অ্যানিমেটেড হয়৷
আপনার কম্পোজযোগ্য লেআউটগুলি সামঞ্জস্য করতে এই ইনসেট প্রকারগুলি ব্যবহার করার দুটি প্রাথমিক উপায় রয়েছে: প্যাডিং সংশোধক এবং ইনসেট আকার সংশোধক৷
প্যাডিং মডিফায়ার
Modifier.windowInsetsPadding(windowInsets: WindowInsets)
প্রদত্ত উইন্ডো ইনসেটগুলিকে প্যাডিং হিসাবে প্রয়োগ করে, ঠিক Modifier.padding
এর মত কাজ করে। উদাহরণস্বরূপ, Modifier.windowInsetsPadding(WindowInsets.safeDrawing)
সমস্ত 4 দিকে প্যাডিং হিসাবে নিরাপদ অঙ্কন ইনসেটগুলি প্রয়োগ করে।
সবচেয়ে সাধারণ ইনসেট ধরনের জন্য বেশ কিছু অন্তর্নির্মিত ইউটিলিটি পদ্ধতি রয়েছে। Modifier.safeDrawingPadding()
হল এরকম একটি পদ্ধতি, যা Modifier.windowInsetsPadding(WindowInsets.safeDrawing)
এর সমতুল্য। অন্যান্য ইনসেট ধরনের জন্য অনুরূপ পরিবর্তনকারী আছে.
ইনসেট আকার সংশোধক
নিম্নলিখিত সংশোধকগুলি উপাদানের আকারকে ইনসেটগুলির আকার হিসাবে সেট করে উইন্ডো ইনসেটের পরিমাণ প্রয়োগ করে:
windowInsets এর প্রারম্ভিক দিকটি প্রস্থ হিসাবে প্রয়োগ করে (যেমন | |
প্রস্থ হিসাবে windowInsets এর শেষ দিক প্রয়োগ করে (যেমন | |
windowInsets এর উপরের দিকটি উচ্চতা হিসাবে প্রয়োগ করে (যেমন | |
| windowInsets-এর নীচের দিকটি উচ্চতা হিসাবে প্রয়োগ করে (যেমন |
এই সংশোধকগুলি বিশেষত একটি Spacer
আকার দেওয়ার জন্য দরকারী যা ইনসেটের স্থান নেয়:
LazyColumn( Modifier.imePadding() ) { // Other content item { Spacer( Modifier.windowInsetsBottomHeight( WindowInsets.systemBars ) ) } }
ইনসেট খরচ
ইনসেট প্যাডিং মডিফায়ার ( windowInsetsPadding
এবং safeDrawingPadding
এর মতো সহায়ক) স্বয়ংক্রিয়ভাবে প্যাডিং হিসাবে প্রয়োগ করা ইনসেটের অংশকে গ্রাস করে। কম্পোজিশন ট্রির গভীরে যাওয়ার সময়, নেস্টেড ইনসেট প্যাডিং মডিফায়ার এবং ইনসেট সাইজ মডিফায়াররা জানে যে ইনসেটগুলির কিছু অংশ ইতিমধ্যেই বাইরের ইনসেট প্যাডিং মডিফায়ার দ্বারা গ্রাস করা হয়েছে এবং ইনসেটগুলির একই অংশ একাধিকবার ব্যবহার করা এড়িয়ে চলার ফলে অত্যধিক অতিরিক্ত স্থান।
ইনসেট সাইজ মডিফায়ারও ইনসেটগুলির একই অংশ একাধিকবার ব্যবহার করা এড়িয়ে যায় যদি ইনসেটগুলি ইতিমধ্যেই ব্যবহার করা হয়ে থাকে। যাইহোক, যেহেতু তারা সরাসরি তাদের আকার পরিবর্তন করছে, তারা নিজেরাই ইনসেটগুলি ব্যবহার করে না।
ফলস্বরূপ, নেস্টিং প্যাডিং মডিফায়ারগুলি স্বয়ংক্রিয়ভাবে প্রতিটি কম্পোজেবলে প্রয়োগ করা প্যাডিংয়ের পরিমাণ পরিবর্তন করে।
আগের মতো একই LazyColumn
উদাহরণের দিকে তাকিয়ে, imePadding
সংশোধক দ্বারা LazyColumn
আকার পরিবর্তন করা হচ্ছে। LazyColumn
ভিতরে, শেষ আইটেমটি সিস্টেম বারের নীচের উচ্চতা হিসাবে মাপ করা হয়:
LazyColumn( Modifier.imePadding() ) { // Other content item { Spacer( Modifier.windowInsetsBottomHeight( WindowInsets.systemBars ) ) } }
যখন IME বন্ধ থাকে, imePadding()
সংশোধক কোনো প্যাডিং প্রয়োগ করে না, যেহেতু IME-এর কোনো উচ্চতা নেই। যেহেতু imePadding()
সংশোধক কোনো প্যাডিং প্রয়োগ করছে না, তাই কোনো ইনসেট ব্যবহার করা হচ্ছে না এবং Spacer
উচ্চতা হবে সিস্টেম বারের নিচের দিকের মাপ।
যখন IME খোলে, IME IME এর আকারের সাথে মেলে অ্যানিমেট ইনসেট করে এবং imePadding()
সংশোধক IME খোলার সাথে সাথে LazyColumn
আকার পরিবর্তন করতে নীচের প্যাডিং প্রয়োগ করা শুরু করে। যেহেতু imePadding()
সংশোধক নীচের প্যাডিং প্রয়োগ করা শুরু করে, এটি সেই পরিমাণ ইনসেটগুলিও গ্রহণ করতে শুরু করে। অতএব, Spacer
উচ্চতা কমতে শুরু করে, কারণ সিস্টেম বারগুলির জন্য ফাঁকের অংশটি ইতিমধ্যেই imePadding()
সংশোধক দ্বারা প্রয়োগ করা হয়েছে। একবার imePadding()
সংশোধক সিস্টেম বারের চেয়ে বেশি পরিমাণে নীচের প্যাডিং প্রয়োগ করলে, Spacer
উচ্চতা শূন্য হয়।
IME বন্ধ হয়ে গেলে, পরিবর্তনগুলি বিপরীতভাবে ঘটে: একবার imePadding()
সিস্টেম বারগুলির নীচের দিকের চেয়ে কম প্রয়োগ করার পরে Spacer
শূন্যের উচ্চতা থেকে প্রসারিত হতে শুরু করে, যতক্ষণ না শেষ পর্যন্ত Spacer
নীচের দিকের উচ্চতার সাথে মেলে। IME সম্পূর্ণরূপে অ্যানিমেটেড হয়ে গেলে সিস্টেম বার করে।
TextField
সহ এজ-টু-এজ অলস কলাম। এই আচরণটি সমস্ত windowInsetsPadding
সংশোধকদের মধ্যে যোগাযোগের মাধ্যমে সম্পন্ন হয়, এবং অন্য কয়েকটি উপায়ে প্রভাবিত হতে পারে।
Modifier.consumeWindowInsets(insets: WindowInsets)
এছাড়াও Modifier.windowInsetsPadding
এর মতো একইভাবে ইনসেটগুলি ব্যবহার করে, কিন্তু এটি প্যাডিং হিসাবে ব্যবহৃত ইনসেটগুলিকে প্রয়োগ করে না। এটি ইনসেট আকারের সংশোধকগুলির সাথে একত্রে কার্যকর, ভাইবোনদের বোঝাতে যে একটি নির্দিষ্ট পরিমাণ ইনসেট ইতিমধ্যেই ব্যবহার করা হয়েছে:
Column(Modifier.verticalScroll(rememberScrollState())) { Spacer(Modifier.windowInsetsTopHeight(WindowInsets.systemBars)) Column( Modifier.consumeWindowInsets( WindowInsets.systemBars.only(WindowInsetsSides.Vertical) ) ) { // content Spacer(Modifier.windowInsetsBottomHeight(WindowInsets.ime)) } Spacer(Modifier.windowInsetsBottomHeight(WindowInsets.systemBars)) }
Modifier.consumeWindowInsets(paddingValues: PaddingValues)
একটি WindowInsets
আর্গুমেন্ট সহ সংস্করণের সাথে খুব অনুরূপ আচরণ করে, কিন্তু ব্যবহার করার জন্য একটি নির্বিচারে PaddingValues
নেয়। এটি বাচ্চাদের জানানোর জন্য উপযোগী যখন প্যাডিং বা স্পেসিং ইনসেট প্যাডিং মডিফায়ারের পরিবর্তে অন্য কোনও প্রক্রিয়া দ্বারা প্রদান করা হয়, যেমন একটি সাধারণ Modifier.padding
বা নির্দিষ্ট উচ্চতা স্পেসার:
@OptIn(ExperimentalLayoutApi::class) Column(Modifier.padding(16.dp).consumeWindowInsets(PaddingValues(16.dp))) { // content Spacer(Modifier.windowInsetsBottomHeight(WindowInsets.ime)) }
যে ক্ষেত্রে কাঁচা উইন্ডো ইনসেটগুলি খরচ ছাড়াই প্রয়োজন হয়, সেক্ষেত্রে সরাসরি WindowInsets
মানগুলি ব্যবহার করুন, অথবা WindowInsets.asPaddingValues()
ব্যবহার করে ইনসেটগুলির একটি PaddingValues
ফেরত দিতে হবে যা ব্যবহার দ্বারা প্রভাবিত হয় না৷ যাইহোক, নীচের সতর্কতার কারণে, যেখানেই সম্ভব উইন্ডো ইনসেট প্যাডিং মডিফায়ার এবং উইন্ডো ইনসেট সাইজ মডিফায়ার ব্যবহার করতে পছন্দ করুন।
ইনসেট এবং জেটপ্যাক রচনা পর্যায়গুলি
কম্পোজ ইনসেটগুলিকে আপডেট এবং অ্যানিমেট করার জন্য অন্তর্নিহিত AndroidX কোর APIগুলি ব্যবহার করে, যা অন্তর্নিহিত প্ল্যাটফর্ম APIগুলি ইনসেটগুলি পরিচালনা করে। সেই প্ল্যাটফর্মের আচরণের কারণে, জেটপ্যাক কম্পোজের পর্যায়গুলির সাথে ইনসেটগুলির একটি বিশেষ সম্পর্ক রয়েছে।
ইনসেটগুলির মান কম্পোজিশন পর্বের পরে আপডেট করা হয়, কিন্তু লেআউট পর্বের আগে । এর মানে হল যে কম্পোজিশনে ইনসেটগুলির মান পড়া সাধারণত ইনসেটগুলির একটি মান ব্যবহার করে যা এক ফ্রেম দেরিতে হয়। এই পৃষ্ঠায় বর্ণিত অন্তর্নির্মিত সংশোধকগুলি বিন্যাস পর্ব পর্যন্ত ইনসেটগুলির মানগুলি ব্যবহার করে বিলম্ব করার জন্য তৈরি করা হয়েছে, যা নিশ্চিত করে যে ইনসেট মানগুলি আপডেট করা হয়েছে একই ফ্রেমে ব্যবহার করা হয়েছে৷
WindowInsets
সহ কীবোর্ড IME অ্যানিমেশন
আপনি একটি স্ক্রলিং কন্টেইনারে Modifier.imeNestedScroll()
প্রয়োগ করতে পারেন যাতে কন্টেইনারের নীচে স্ক্রোল করার সময় IME স্বয়ংক্রিয়ভাবে খুলতে এবং বন্ধ করতে পারে।
class WindowInsetsExampleActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) WindowCompat.setDecorFitsSystemWindows(window, false) setContent { MaterialTheme { MyScreen() } } } } @OptIn(ExperimentalLayoutApi::class) @Composable fun MyScreen() { Box { LazyColumn( modifier = Modifier .fillMaxSize() // fill the entire window .imePadding() // padding for the bottom for the IME .imeNestedScroll(), // scroll IME at the bottom content = { } ) FloatingActionButton( modifier = Modifier .align(Alignment.BottomEnd) .padding(16.dp) // normal 16dp of padding for FABs .navigationBarsPadding() // padding for navigation bar .imePadding(), // padding for when IME appears onClick = { } ) { Icon(imageVector = Icons.Filled.Add, contentDescription = "Add") } } }
![অ্যানিমেশন একটি কীবোর্ডের জন্য পথ তৈরি করতে উপরে এবং নীচে স্ক্রোল করা একটি UI উপাদান দেখাচ্ছে](https://developer.android.com/static/develop/ui/compose/images/interop-keyboard.gif?authuser=4&hl=bn)
উপাদান 3 উপাদান জন্য ইনসেট সমর্থন
ব্যবহারের সুবিধার জন্য, অনেকগুলি অন্তর্নির্মিত উপাদান 3 কম্পোজেবল ( androidx.compose.material3
) নিজেই ইনসেটগুলি পরিচালনা করে, কীভাবে উপাদানের বৈশিষ্ট্য অনুযায়ী আপনার অ্যাপে কম্পোজেবলগুলি স্থাপন করা হয় তার উপর ভিত্তি করে।
ইনসেট হ্যান্ডলিং composables
নীচে উপাদান উপাদানগুলির একটি তালিকা রয়েছে যা স্বয়ংক্রিয়ভাবে ইনসেটগুলি পরিচালনা করে৷
অ্যাপ বার
-
TopAppBar
/SmallTopAppBar
/CenterAlignedTopAppBar
/MediumTopAppBar
/LargeTopAppBar
: প্যাডিং হিসাবে সিস্টেম বারের উপরের এবং অনুভূমিক দিকগুলি প্রয়োগ করে যেহেতু এটি উইন্ডোর শীর্ষে ব্যবহৃত হয়৷ -
BottomAppBar
: প্যাডিং হিসাবে সিস্টেম বারের নীচে এবং অনুভূমিক দিকগুলি প্রয়োগ করে।
বিষয়বস্তু পাত্রে
-
ModalDrawerSheet
/DismissibleDrawerSheet
/PermanentDrawerSheet
(একটি মোডাল নেভিগেশন ড্রয়ারের ভিতরের সামগ্রী): বিষয়বস্তুতে উল্লম্ব এবং স্টার্ট ইনসেট প্রয়োগ করে। -
ModalBottomSheet
: নিচের ইনসেট প্রয়োগ করে। -
NavigationBar
: নীচে এবং অনুভূমিক ইনসেটগুলি প্রয়োগ করে। -
NavigationRail
: উল্লম্ব এবং স্টার্ট ইনসেট প্রয়োগ করে।
ভারা
ডিফল্টরূপে, Scaffold
আপনার ব্যবহার এবং ব্যবহার করার জন্য প্যারামিটার paddingValues
হিসাবে ইনসেট প্রদান করে। Scaffold
সামগ্রীতে ইনসেটগুলি প্রয়োগ করে না; এই দায়িত্ব আপনার। উদাহরণস্বরূপ, একটি Scaffold
ভিতরে একটি LazyColumn
সহ এই ইনসেটগুলি গ্রাস করতে:
Scaffold { innerPadding -> // innerPadding contains inset information for you to use and apply LazyColumn( // consume insets as scaffold doesn't do it by default modifier = Modifier.consumeWindowInsets(innerPadding), contentPadding = innerPadding ) { items(count = 100) { Box( Modifier .fillMaxWidth() .height(50.dp) .background(colors[it % colors.size]) ) } } }
ডিফল্ট ইনসেট ওভাররাইড করুন
আপনি কম্পোজেবলের আচরণ কনফিগার করতে কম্পোজেবলে পাস করা windowInsets
প্যারামিটার পরিবর্তন করতে পারেন। এই প্যারামিটারটি পরিবর্তে প্রয়োগ করার জন্য একটি ভিন্ন ধরনের উইন্ডো ইনসেট হতে পারে, অথবা একটি খালি উদাহরণ পাস করে নিষ্ক্রিয় করা যেতে পারে: WindowInsets(0, 0, 0, 0)
উদাহরণস্বরূপ, LargeTopAppBar
এ ইনসেট হ্যান্ডলিং অক্ষম করতে, windowInsets
প্যারামিটারটিকে একটি খালি উদাহরণে সেট করুন:
LargeTopAppBar( windowInsets = WindowInsets(0, 0, 0, 0), title = { Text("Hi") } )
ভিউ সিস্টেম ইনসেটগুলির সাথে ইন্টারপ করুন
যখন আপনার স্ক্রীনে একই ক্রমানুসারে ভিউ এবং কম্পোজ কোড উভয়ই থাকে তখন আপনাকে ডিফল্ট ইনসেট ওভাররাইড করতে হতে পারে। এই ক্ষেত্রে, আপনাকে স্পষ্ট হতে হবে যে কোনটি ইনসেটগুলি গ্রাস করবে এবং কোনটি তাদের উপেক্ষা করবে।
উদাহরণস্বরূপ, যদি আপনার বাইরের লেআউটটি একটি Android ভিউ লেআউট হয়, তাহলে আপনার ভিউ সিস্টেমের ইনসেটগুলি ব্যবহার করা উচিত এবং রচনার জন্য সেগুলিকে উপেক্ষা করা উচিত৷ বিকল্পভাবে, যদি আপনার বাইরের লেআউটটি কম্পোজেবল হয়, তাহলে আপনার কম্পোজের ইনসেটগুলি ব্যবহার করা উচিত এবং সেই অনুযায়ী AndroidView
কম্পোজেবল প্যাড করা উচিত।
ডিফল্টরূপে, প্রতিটি ComposeView
WindowInsetsCompat
স্তরে সমস্ত ইনসেট ব্যবহার করে। এই ডিফল্ট আচরণ পরিবর্তন করতে, ComposeView.consumeWindowInsets
সেট করুন false
।
সম্পদ
- এখন অ্যান্ড্রয়েডে — কোটলিন এবং জেটপ্যাক কম্পোজের সাথে সম্পূর্ণরূপে তৈরি একটি সম্পূর্ণ কার্যকরী অ্যান্ড্রয়েড অ্যাপ।
- অ্যান্ড্রয়েড 15-এ এজ-টু-এজ এনফোর্সমেন্টগুলি হ্যান্ডেল করুন — অ্যান্ড্রয়েড 15 এজ-টু-এজ এনফোর্সমেন্টের মধ্য দিয়ে চলা একটি কোডল্যাব
- আপনার অ্যান্ড্রয়েড অ্যাপ অভিজ্ঞতা উন্নত করার জন্য 3টি জিনিস: এজ টু এজ, প্রেডিকটিভ ব্যাক এবং গ্ল্যান্স — একটি YouTube ভিডিও যা Android 15 এজ-টু-এজ এনফোর্সমেন্টের সাথে কথা বলছে
- প্রান্ত থেকে প্রান্ত এবং ইনসেট | কম্পোজ টিপস — এজ-টু-এজ আঁকার জন্য ইনসেটগুলি কীভাবে পরিচালনা করতে হয় তা দেখানো একটি YouTube ভিডিও
আপনার জন্য প্রস্তাবিত
- দ্রষ্টব্য: জাভাস্ক্রিপ্ট বন্ধ থাকলে লিঙ্ক টেক্সট প্রদর্শিত হয়
- উপাদান উপাদান এবং বিন্যাস
- রচনা করার জন্য
CoordinatorLayout
স্থানান্তর করুন - অন্যান্য বিবেচনা