কন্টেন্ট এজ-টু-এজ দেখায়

কম্পোজ পদ্ধতিটি চেষ্টা করুন
অ্যান্ড্রয়েডের জন্য Jetpack Compose হলো প্রস্তাবিত UI টুলকিট। Compose-এ কীভাবে এজ-টু-এজ নিয়ে কাজ করতে হয় তা শিখুন।

অ্যান্ড্রয়েড ১৫ বা তার উচ্চতর সংস্করণে চালিত কোনো ডিভাইসে আপনি যখন এসডিকে ৩৫ বা তার উচ্চতর সংস্করণ টার্গেট করেন, তখন আপনার অ্যাপটি প্রান্ত থেকে প্রান্ত পর্যন্ত প্রদর্শিত হয়। উইন্ডোটি সিস্টেম বারের পিছনে প্রদর্শিত হয়ে ডিসপ্লের সম্পূর্ণ প্রস্থ এবং উচ্চতা জুড়ে বিস্তৃত হয়। সিস্টেম বারের মধ্যে রয়েছে স্ট্যাটাস বার, ক্যাপশন বার এবং নেভিগেশন বার।

অনেক অ্যাপে একটি টপ অ্যাপ বার থাকে। টপ অ্যাপ বারটি স্ক্রিনের উপরের প্রান্ত পর্যন্ত বিস্তৃত হয়ে স্ট্যাটাস বারের পিছনে প্রদর্শিত হওয়া উচিত। ঐচ্ছিকভাবে, কন্টেন্ট স্ক্রল করার সময় টপ অ্যাপ বারটি স্ট্যাটাস বারের উচ্চতায় সংকুচিত হতে পারে।

অনেক অ্যাপে একটি বটম অ্যাপ বার বা বটম নেভিগেশন বারও থাকে। এই বারগুলোও স্ক্রিনের নিচের প্রান্ত পর্যন্ত প্রসারিত হওয়া উচিত এবং নেভিগেশন বারের পিছনে প্রদর্শিত হওয়া উচিত। অন্যথায়, অ্যাপগুলোতে নেভিগেশন বারের পিছনে স্ক্রলিং কন্টেন্ট দেখানো উচিত।

চিত্র ১. প্রান্ত থেকে প্রান্ত পর্যন্ত বিন্যাসে সিস্টেম বারসমূহ।

আপনার অ্যাপে এজ-টু-এজ লেআউট প্রয়োগ করার সময় নিম্নলিখিত বিষয়গুলো মনে রাখবেন:

  1. প্রান্ত থেকে প্রান্ত পর্যন্ত ডিসপ্লে সক্রিয় করুন
  2. বিভিন্ন ফর্ম ফ্যাক্টরে ব্যবহারকারীর অভিজ্ঞতা অপ্টিমাইজ করতে অ্যাডাপ্টিভ লেআউট প্রয়োগ করুন।
  3. যেকোনো দৃশ্যমান ওভারল্যাপ সামলান।
  4. সিস্টেম বারের পিছনে স্ক্রিম দেখানোর বিষয়টি বিবেচনা করুন।
স্ট্যাটাস বারের পেছনের ছবির একটি উদাহরণ
চিত্র ২. স্ট্যাটাস বারের পেছনের চিত্রাবলীর উদাহরণ।

এজ-টু-এজ ডিসপ্লে সক্ষম করুন

আপনার অ্যাপটি যদি SDK 35 বা তার পরবর্তী সংস্করণকে টার্গেট করে, তাহলে Android 15 বা তার পরবর্তী সংস্করণের ডিভাইসগুলোর জন্য এজ-টু-এজ স্বয়ংক্রিয়ভাবে সক্রিয় হয়ে যাবে।

পূর্ববর্তী অ্যান্ড্রয়েড সংস্করণগুলিতে এজ-টু-এজ সক্রিয় করতে, আপনার ActivityonCreate এ ম্যানুয়ালি enableEdgeToEdge কল করুন।

কোটলিন

 override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         WindowCompat.enableEdgeToEdge(window)
        ...
      }

জাভা

 @Override
      protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        WindowCompat.enableEdgeToEdge(getWindow());
        ...
      }

ডিফল্টরূপে, enableEdgeToEdge() সিস্টেম বারগুলিকে স্বচ্ছ করে তোলে, তবে ৩-বাটন নেভিগেশন মোডে নেভিগেশন বারে একটি অস্বচ্ছ স্ক্রিম দেখা যায়। সিস্টেম আইকন এবং স্ক্রিমের রঙ সিস্টেমের লাইট বা ডার্ক থিমের উপর ভিত্তি করে সামঞ্জস্য করা হয়।

` enableEdgeToEdge() ফাংশন ব্যবহার না করে আপনার অ্যাপে এজ-টু-এজ ডিসপ্লে চালু করতে, `ম্যানুয়ালি এজ-টু-এজ ডিসপ্লে সেট আপ করুন` দেখুন।

ইনসেট ব্যবহার করে ওভারল্যাপ সামলান।

আপনার অ্যাপের কিছু ভিউ সিস্টেম বারের পিছনে প্রদর্শিত হতে পারে, যেমনটি চিত্র ৩-এ দেখানো হয়েছে।

আপনি ইনসেট-এর মাধ্যমে ওভারল্যাপের সমাধান করতে পারেন, যা নির্দিষ্ট করে দেয় স্ক্রিনের কোন অংশগুলো নেভিগেশন বার বা স্ট্যাটাস বারের মতো সিস্টেম UI-এর সাথে ছেদ করে। ছেদ করার অর্থ হতে পারে কন্টেন্টের উপরে প্রদর্শিত হওয়া, তবে এটি আপনার অ্যাপকে সিস্টেম জেসচার সম্পর্কেও জানাতে পারে।

আপনার অ্যাপটিকে প্রান্ত থেকে প্রান্ত পর্যন্ত প্রদর্শন করার জন্য যে ধরনের ইনসেটগুলো প্রযোজ্য, সেগুলো হলো:

  • সিস্টেম বার ইনসেট: এমন ভিউয়ের জন্য সর্বোত্তম যা ট্যাপ করা যায় এবং যা সিস্টেম বার দ্বারা দৃশ্যত আবৃত হওয়া উচিত নয়।

  • ডিসপ্লে কাটআউট ইনসেট: ডিভাইসের আকৃতির কারণে যেসব জায়গায় স্ক্রিন কাটআউট থাকার সম্ভাবনা থাকে, সেগুলোর জন্য।

  • সিস্টেম জেসচার ইনসেট: সিস্টেম দ্বারা ব্যবহৃত জেসচার-ন্যাভিগেশনাল এলাকাগুলোর জন্য, যা আপনার অ্যাপের চেয়ে অগ্রাধিকার পায়।

সিস্টেম বার ইনসেট

সিস্টেম বার ইনসেট হলো সবচেয়ে বেশি ব্যবহৃত ইনসেটের ধরন। এগুলো আপনার অ্যাপের উপরে Z-অক্ষ বরাবর সেই এলাকাকে বোঝায় যেখানে সিস্টেম UI প্রদর্শিত হয়। আপনার অ্যাপের ট্যাপযোগ্য ভিউগুলোকে সরানো বা প্যাড করার জন্য এগুলো সবচেয়ে ভালো, যেগুলো সিস্টেম বারের কারণে দৃশ্যত আড়াল হওয়া উচিত নয়।

উদাহরণস্বরূপ, চিত্র ৩-এর ফ্লোটিং অ্যাকশন বাটনটি (FAB) নেভিগেশন বারের কারণে আংশিকভাবে ঢাকা পড়েছে:

এজ-টু-এজ বাস্তবায়নের একটি উদাহরণ, কিন্তু নেভ বারটি FAB-কে ঢেকে ফেলছে।
চিত্র ৩। এজ-টু-এজ লেআউটে একটি FAB-এর উপর অবস্থিত নেভিগেশন বার।

জেসচার মোড বা বাটন মোড, উভয় ক্ষেত্রেই এই ধরনের দৃশ্যমান ওভারল্যাপ এড়াতে, আপনি getInsets(int) এর সাথে WindowInsetsCompat.Type.systemBars() ব্যবহার করে ভিউটির মার্জিন বাড়াতে পারেন।

নিম্নলিখিত কোড উদাহরণটি দেখায় কিভাবে সিস্টেম বার ইনসেট প্রয়োগ করতে হয়:

কোটলিন

ViewCompat.setOnApplyWindowInsetsListener(fab) { v, windowInsets ->
  val insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
  // Apply the insets as a margin to the view. This solution sets
  // only the bottom, left, and right dimensions, but you can apply whichever
  // insets are appropriate to your layout. You can also update the view padding
  // if that's more appropriate.
  v.updateLayoutParams<MarginLayoutParams> {
      leftMargin = insets.left
      bottomMargin = insets.bottom
      rightMargin = insets.right
  }

  // Return CONSUMED if you don't want the window insets to keep passing
  // down to descendant views.
  WindowInsetsCompat.CONSUMED
}

জাভা

ViewCompat.setOnApplyWindowInsetsListener(fab, (v, windowInsets) -> {
  Insets insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars());
  // Apply the insets as a margin to the view. This solution sets only the
  // bottom, left, and right dimensions, but you can apply whichever insets are
  // appropriate to your layout. You can also update the view padding if that's
  // more appropriate.
  MarginLayoutParams mlp = (MarginLayoutParams) v.getLayoutParams();
  mlp.leftMargin = insets.left;
  mlp.bottomMargin = insets.bottom;
  mlp.rightMargin = insets.right;
  v.setLayoutParams(mlp);

  // Return CONSUMED if you don't want the window insets to keep passing
  // down to descendant views.
    return WindowInsetsCompat.CONSUMED;
});

যদি আপনি চিত্র ৩-এ দেখানো উদাহরণটিতে এই সমাধানটি প্রয়োগ করেন, তাহলে বাটন মোডে কোনো দৃশ্যমান ওভারল্যাপ থাকে না, যেমনটি চিত্র ৪-এ দেখানো হয়েছে:

একটি স্বচ্ছ নেভ বার যা FAB-কে ঢেকে রাখে না
চিত্র ৪. বাটন মোডে দৃশ্যগত উপরিপাতনের সমাধান।

জেসচার নেভিগেশন মোডের ক্ষেত্রেও একই কথা প্রযোজ্য, যেমনটি চিত্র ৫-এ দেখানো হয়েছে:

জেসচার নেভিগেশন সহ এজ-টু-এজ
চিত্র ৫. জেসচার নেভিগেশন মোডে ভিজ্যুয়াল ওভারল্যাপের সমাধান।

ডিসপ্লে কাটআউট ইনসেট

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

উদাহরণস্বরূপ, অনেক অ্যাপ স্ক্রিনে আইটেমের একটি তালিকা দেখানো হয়। ডিসপ্লে কাটআউট বা সিস্টেম বার দিয়ে তালিকার আইটেমগুলো ঢেকে ফেলবেন না।

কোটলিন

ViewCompat.setOnApplyWindowInsetsListener(binding.recyclerView) { v, insets ->
  val bars = insets.getInsets(
    WindowInsetsCompat.Type.systemBars()
      or WindowInsetsCompat.Type.displayCutout()
  )
  v.updatePadding(
    left = bars.left,
    top = bars.top,
    right = bars.right,
    bottom = bars.bottom,
  )
  WindowInsetsCompat.CONSUMED
}

জাভা

ViewCompat.setOnApplyWindowInsetsListener(mBinding.recyclerView, (v, insets) -> {
  Insets bars = insets.getInsets(
    WindowInsetsCompat.Type.systemBars()
    | WindowInsetsCompat.Type.displayCutout()
  );
  v.setPadding(bars.left, bars.top, bars.right, bars.bottom);
  return WindowInsetsCompat.CONSUMED;
});

সিস্টেম বার এবং ডিসপ্লে কাটআউট টাইপগুলোর লজিক্যাল অর নিয়ে WindowInsetsCompat এর মান নির্ধারণ করুন।

RecyclerView তে clipToPadding সেট করুন, যাতে প্যাডিংটি তালিকার আইটেমগুলোর সাথে স্ক্রল করে। এর ফলে, ব্যবহারকারী স্ক্রল করার সময় আইটেমগুলো সিস্টেম বারের পেছনে চলে যায়, যেমনটি নিচের উদাহরণে দেখানো হয়েছে।

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recycler_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipToPadding="false"
    app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager" />

সিস্টেম অঙ্গভঙ্গি ইনসেট

সিস্টেম জেসচার ইনসেটগুলো উইন্ডোর সেইসব এলাকাকে নির্দেশ করে, যেখানে আপনার অ্যাপের চেয়ে সিস্টেম জেসচার অগ্রাধিকার পায়। চিত্র ৬-এ এই এলাকাগুলো কমলা রঙে দেখানো হয়েছে:

সিস্টেম জেসচার ইনসেটের একটি উদাহরণ
চিত্র ৬. সিস্টেম জেসচার ইনসেট।

সিস্টেম বার ইনসেটগুলোর মতোই, আপনি getInsets(int) এর সাথে WindowInsetsCompat.Type.systemGestures() ব্যবহার করে সিস্টেম জেসচার ইনসেটগুলোর ওভারল্যাপ এড়াতে পারেন।

সোয়াইপযোগ্য ভিউগুলিকে প্রান্ত থেকে দূরে সরাতে বা প্যাড করতে এই ইনসেটগুলি ব্যবহার করুন। এর সাধারণ ব্যবহারগুলির মধ্যে রয়েছে বটম শীট , গেমে সোয়াইপ করা এবং ViewPager2 ব্যবহার করে তৈরি ক্যারোসেল।

অ্যান্ড্রয়েড ১০ বা তার পরবর্তী সংস্করণে, সিস্টেম জেসচার ইনসেটগুলোতে হোম জেসচারের জন্য একটি নিচের ইনসেট এবং ব্যাক জেসচারের জন্য একটি বাম ও ডান ইনসেট থাকে:

সিস্টেম জেসচার ইনসেট পরিমাপের একটি উদাহরণ
চিত্র ৭. সিস্টেম জেসচার ইনসেট পরিমাপসমূহ।

নিম্নলিখিত কোড উদাহরণটি দেখায় কিভাবে সিস্টেম জেসচার ইনসেট প্রয়োগ করতে হয়:

কোটলিন

ViewCompat.setOnApplyWindowInsetsListener(view) { view, windowInsets ->
    val insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemGestures())
    // Apply the insets as padding to the view. Here, set all the dimensions
    // as appropriate to your layout. You can also update the view's margin if
    // more appropriate.
    view.updatePadding(insets.left, insets.top, insets.right, insets.bottom)

    // Return CONSUMED if you don't want the window insets to keep passing down
    // to descendant views.
    WindowInsetsCompat.CONSUMED
}

জাভা

ViewCompat.setOnApplyWindowInsetsListener(view, (v, windowInsets) -> {
    Insets insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemGestures());
    // Apply the insets as padding to the view. Here, set all the dimensions
    // as appropriate to your layout. You can also update the view's margin if
    // more appropriate.
    view.setPadding(insets.left, insets.top, insets.right, insets.bottom);

    // Return CONSUMED if you don't want the window insets to keep passing down
    // to descendant views.
    return WindowInsetsCompat.CONSUMED;
});

উপাদান উপাদান

অনেক ভিউ-ভিত্তিক অ্যান্ড্রয়েড ম্যাটেরিয়াল কম্পোনেন্ট (com.google.android.material) স্বয়ংক্রিয়ভাবে ইনসেট পরিচালনা করে, যার মধ্যে রয়েছে BottomAppBar , BottomNavigationView , NavigationRailView এবং NavigationView

তবে, AppBarLayout স্বয়ংক্রিয়ভাবে ইনসেট পরিচালনা করে না। টপ ইনসেট পরিচালনা করতে android:fitsSystemWindows="true" যোগ করুন।

Compose-এ Material Components ব্যবহার করে কীভাবে ইনসেট পরিচালনা করতে হয় তা পড়ুন।

পশ্চাৎমুখী সামঞ্জস্যপূর্ণ ইনসেট প্রেরণ

চাইল্ড ভিউতে ইনসেট ডিসপ্যাচ হওয়া বন্ধ করতে এবং অতিরিক্ত প্যাডিং এড়াতে, আপনি WindowInsetsCompat.CONSUMED কনস্ট্যান্ট ব্যবহার করে ইনসেট কনজিউম করতে পারেন। তবে, Android 10 চালিত ডিভাইসগুলিতে (API লেভেল 29 এবং তার আগের সংস্করণ), WindowInsetsCompat.CONSUMED কল করার পর সিবলিং ভিউতে ইনসেট ডিসপ্যাচ হয় না, যার ফলে অনাকাঙ্ক্ষিত ভিজ্যুয়াল ওভারল্যাপ হতে পারে।

ভাঙা ইনসেট ডিসপ্যাচিং উদাহরণ
চিত্র ৮. ত্রুটিপূর্ণ ইনসেট ডিসপ্যাচিং-এর উদাহরণ। অ্যান্ড্রয়েড ১০ (এপিআই লেভেল ২৯) এবং তার পূর্ববর্তী সংস্করণগুলিতে, ভিউগ্রুপ ১ ইনসেট গ্রহণ করার পর তা পার্শ্ববর্তী ভিউগুলিতে ডিসপ্যাচ হয় না, যার ফলে টেক্সটভিউ ২ সিস্টেম নেভিগেশন বারের সাথে ওভারল্যাপ করে। তবে, অ্যান্ড্রয়েড ১১ (এপিআই লেভেল ৩০) এবং তার পরবর্তী সংস্করণগুলিতে, প্রত্যাশা অনুযায়ী ইনসেটগুলি পার্শ্ববর্তী ভিউগুলিতে ডিসপ্যাচ হয়।

সকল সমর্থিত অ্যান্ড্রয়েড সংস্করণের জন্য সিibling-দের কাছে ইনসেট পাঠানো নিশ্চিত করতে, ইনসেট ব্যবহার করার আগে ViewGroupCompat#installCompatInsetsDispatch ব্যবহার করুন, যা AndroidX Core এবং Core-ktx 1.16.0-alpha01 ও তার পরবর্তী সংস্করণগুলিতে উপলব্ধ।

কোটলিন

// Use the i.d. assigned to your layout's root view, e.g. R.id.main
val rootView = findViewById(R.id.main)
// Call before consuming insets
ViewGroupCompat.installCompatInsetsDispatch(rootView)

জাভা

// Use the i.d. assigned to your layout's root view, e.g. R.id.main
LinearLayout rootView = findViewById(R.id.main);
// Call before consuming insets
ViewGroupCompat.installCompatInsetsDispatch(rootView);
স্থির ইনসেট ডিসপ্যাচিং উদাহরণ
চিত্র ৯। ViewGroupCompat#installCompatInsetsDispatch কল করার পর ইনসেট ডিসপ্যাচিং ঠিক করা হয়েছে।

ইমারসিভ মোড

কিছু কন্টেন্ট ফুল স্ক্রিনে সবচেয়ে ভালোভাবে উপভোগ করা যায়, যা ব্যবহারকারীকে আরও বেশি ইমারসিভ অভিজ্ঞতা দেয়। আপনি WindowInsetsController এবং WindowInsetsControllerCompat লাইব্রেরিগুলো ব্যবহার করে সিস্টেম বারগুলো লুকিয়ে ইমারসিভ মোড চালু করতে পারেন:

কোটলিন

val windowInsetsController =
      WindowCompat.getInsetsController(window, window.decorView)

// Hide the system bars.
windowInsetsController.hide(Type.systemBars())

// Show the system bars.
windowInsetsController.show(Type.systemBars())

জাভা

Window window = getWindow();
WindowInsetsControllerCompat windowInsetsController =
      WindowCompat.getInsetsController(window, window.getDecorView());
if (windowInsetsController == null) {
    return;
  }
// Hide the system bars.
windowInsetsController.hide(WindowInsetsCompat.Type.systemBars());

// Show the system bars.
windowInsetsController.show(WindowInsetsCompat.Type.systemBars());

এই ফিচারটি বাস্তবায়ন করার বিষয়ে আরও তথ্যের জন্য ‘ইমারসিভ মোডের জন্য সিস্টেম বার লুকান’ অংশটি দেখুন।

সিস্টেম বার আইকন

enableEdgeToEdge কল করলে ডিভাইসের থিম পরিবর্তন হলে সিস্টেম বারের আইকনগুলোর রঙ আপডেট হয়।

এজ-টু-এজ করার সময়, আপনার অ্যাপের ব্যাকগ্রাউন্ডের সাথে বৈসাদৃশ্য তৈরি করার জন্য সিস্টেম বার আইকনের রঙ ম্যানুয়ালি আপডেট করার প্রয়োজন হতে পারে। উদাহরণস্বরূপ, হালকা রঙের স্ট্যাটাস বার আইকন তৈরি করতে:

কোটলিন

WindowCompat.getInsetsController(window, window.decorView)
    .isAppearanceLightStatusBars = false

জাভা

WindowCompat.getInsetsController(window, window.getDecorView())
    .setAppearanceLightStatusBars(false);

সিস্টেম বার সুরক্ষা

আপনার অ্যাপটি SDK 35 বা তার উচ্চতর সংস্করণকে টার্গেট করলে, এজ-টু-এজ ইন্টিগ্রেশন বাধ্যতামূলক হয়ে যায় । সিস্টেম স্ট্যাটাস বার এবং জেসচার নেভিগেশন বারগুলো স্বচ্ছ থাকে, কিন্তু তিন-বাটনের নেভিগেশন বারটি অর্ধস্বচ্ছ হয়। এটিকে পূর্ববর্তী সংস্করণের সাথে সামঞ্জস্যপূর্ণ করতে enableEdgeToEdge কল করুন।

তবে, সিস্টেমের ডিফল্ট সেটিংস সব ক্ষেত্রে কাজ নাও করতে পারে। স্বচ্ছ নাকি অর্ধস্বচ্ছ সিস্টেম বার ব্যবহার করবেন, তা নির্ধারণ করতে অ্যান্ড্রয়েড সিস্টেম বার ডিজাইন নির্দেশিকা এবং এজ-টু-এজ ডিজাইন দেখুন।

স্বচ্ছ সিস্টেম বার তৈরি করুন

অ্যান্ড্রয়েড ১৫ (এসডিকে ৩৫) বা তার উচ্চতর সংস্করণকে টার্গেট করে অথবা পূর্ববর্তী সংস্করণগুলোর জন্য ডিফল্ট আর্গুমেন্টসহ enableEdgeToEdge() কল করে একটি স্বচ্ছ স্ট্যাটাস বার তৈরি করুন।

অ্যান্ড্রয়েড ১৫ বা তার উচ্চতর সংস্করণ টার্গেট করে অথবা পূর্ববর্তী সংস্করণগুলির জন্য ডিফল্ট আর্গুমেন্ট সহ enableEdgeToEdge() কল করে একটি স্বচ্ছ জেসচার নেভিগেশন বার তৈরি করুন। তিন-বাটন নেভিগেশন বারের জন্য, Window.setNavigationBarContrastEnforced কে false সেট করুন, অন্যথায় একটি স্বচ্ছ স্ক্রিম প্রয়োগ করা হবে।

স্বচ্ছ সিস্টেম বার তৈরি করুন

একটি স্বচ্ছ স্ট্যাটাস বার তৈরি করতে, নিম্নলিখিতগুলি করুন:

  1. আপনার androidx-core ডিপেন্ডেন্সি 1.16.0-beta01 বা উচ্চতর সংস্করণে আপডেট করুন।
  2. আপনার XML লেআউটটিকে androidx.core.view.insets.ProtectionLayout এর মধ্যে রাখুন এবং একটি ID নির্ধারণ করুন।
  3. প্রোগ্রাম্যাটিকভাবে ProtectionLayout অ্যাক্সেস করে সুরক্ষা সেট করুন, এর জন্য স্ট্যাটাস বারের দিক এবং একটি GradientProtection নির্দিষ্ট করে দিন।

<androidx.core.view.insets.ProtectionLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/list_protection"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ScrollView
        android:id="@+id/item_list"
        android:clipToPadding="false"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <!--items-->

    </ScrollView>

</androidx.core.view.insets.ProtectionLayout>

findViewById<ProtectionLayout>(R.id.list_protection)
    .setProtections(
        listOf(
            GradientProtection(
                WindowInsetsCompat.Side.TOP,
                // Ideally, this is the pane's background color
                paneBackgroundColor
            )
        )
    )

নিশ্চিত করুন যে GradientProtection এ পাস করা ColorInt কন্টেন্টের ব্যাকগ্রাউন্ডের সাথে মেলে। উদাহরণস্বরূপ, একটি ফোল্ডেবলে প্রদর্শিত লিস্ট-ডিটেইল লেআউটে লিস্ট প্যানেল এবং ডিটেইল প্যানেলের জন্য ভিন্ন ভিন্ন রঙের GradientProtections থাকতে পারে।

চিত্র ১. বিভিন্ন রঙের ক্রমিক সুরক্ষা।

একটি স্বচ্ছ জেসচার নেভিগেশন বার তৈরি করবেন না। একটি স্বচ্ছ তিন-বোতামের নেভিগেশন বার তৈরি করতে নিম্নলিখিতগুলির মধ্যে একটি করুন:

  • আপনার লেআউটটি যদি ইতিমধ্যেই একটি ProtectionView মধ্যে থাকে, তাহলে আপনি setProtections মেথডে একটি অতিরিক্ত ColorProtection বা GradientProtection পাস করতে পারেন। এটি করার আগে, নিশ্চিত করুন যে window.isNavigationBarContrastEnforced = false
  • অন্যথায়, window.isNavigationBarContrastEnforced = true সেট করুন।

অন্যান্য টিপস

ইনসেটগুলি পরিচালনা করার সময় অতিরিক্ত পরামর্শ।

স্ক্রোলিং কন্টেন্টকে প্রান্ত থেকে প্রান্ত পর্যন্ত বিস্তৃত করুন

আপনার RecyclerView বা NestedScrollView তে তালিকার শেষ আইটেমটি যেন সিস্টেম বার দ্বারা আবৃত না হয়, তা নিশ্চিত করতে ইনসেট হ্যান্ডেল করুন এবং clipToPadding false সেট করুন।

নিচের ভিডিওটিতে একটি RecyclerView দেখানো হয়েছে যার এজ-টু-এজ ডিসপ্লে নিষ্ক্রিয় (বামে) এবং সক্রিয় (ডানে) অবস্থায় রয়েছে:

কোডের নমুনার জন্য "RecyclerView দিয়ে ডাইনামিক লিস্ট তৈরি করুন" সেকশনের কোড স্নিপেটগুলো দেখুন।

পূর্ণ-স্ক্রিন ডায়ালগগুলিকে প্রান্ত থেকে প্রান্ত পর্যন্ত বিস্তৃত করুন

ফুল-স্ক্রিন ডায়ালগকে প্রান্ত থেকে প্রান্ত পর্যন্ত বিস্তৃত করতে, ডায়ালগটিতে enableEdgeToEdge কল করুন।

কোটলিন

class MyAlertDialogFragment : DialogFragment() {
    override fun onStart(){
        super.onStart()
        dialog?.window?.let { WindowCompat.enableEdgeToEdge(it) }
    }
    ...
}

জাভা

public class MyAlertDialogFragment extends DialogFragment {
    @Override
    public void onStart() {
        super.onStart();
        Dialog dialog = getDialog();
        if (dialog != null) {
            Window window = dialog.getWindow();
            if (window != null) {
                WindowCompat.enableEdgeToEdge(window);
            }
        }
    }
    ...
}

অতিরিক্ত সম্পদ

এক প্রান্ত থেকে অন্য প্রান্তে যাওয়ার বিষয়ে আরও তথ্যের জন্য নিম্নলিখিত তথ্যসূত্রগুলি দেখুন।

ব্লগ

ডিজাইন

অন্যান্য নথিপত্র

ভিডিও