একটি নির্দেশিত পদক্ষেপ যোগ করুন

কম্পোজ দিয়ে আরও ভালোভাবে তৈরি করুন

জেটপ্যাক কম্পোজ ব্যবহার করে অ্যান্ড্রয়েড টিভি ওএস-এর জন্য ন্যূনতম কোডে সুন্দর ইউআই তৈরি করুন।

টিভির জন্য সুর রচনা করুন →

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

অপ্রচলিত androidx.leanback লাইব্রেরিটি একাধিক ধাপের ব্যবহারকারী টাস্ক বাস্তবায়নের জন্য ক্লাস সরবরাহ করে। এই পৃষ্ঠায় আলোচনা করা হয়েছে কিভাবে GuidedStepSupportFragment ক্লাস ব্যবহার করে একজন ব্যবহারকারীকে একটি কাজ সম্পন্ন করার জন্য ধারাবাহিক সিদ্ধান্তের মাধ্যমে পথ দেখানো যায় GuidedStepSupportFragment

একটি ধাপের জন্য বিস্তারিত বিবরণ দিন

একটি GuidedStepSupportFragment একাধিক ধাপের একটি একক ধাপকে উপস্থাপন করে। দৃশ্যত, এটি ওই ধাপটির জন্য সম্ভাব্য ক্রিয়া বা সিদ্ধান্তের একটি তালিকা সহ একটি নির্দেশিকা প্রদান করে।

চিত্র ১. একটি নির্দেশিত ধাপের উদাহরণ।

আপনার একাধিক ধাপের টাস্কের প্রতিটি ধাপের জন্য, GuidedStepSupportFragment এক্সটেন্ড করুন এবং ধাপটি সম্পর্কে প্রাসঙ্গিক তথ্য ও ব্যবহারকারী যে কাজগুলো করতে পারে, তা প্রদান করুন। onCreateGuidance() ওভাররাইড করুন এবং একটি নতুন GuidanceStylist.Guidance রিটার্ন করুন, যাতে প্রাসঙ্গিক তথ্য থাকবে, যেমন ধাপের শিরোনাম, বিবরণ এবং আইকন, যেমনটি নিম্নলিখিত উদাহরণে দেখানো হয়েছে:

override fun onCreateGuidance(savedInstanceState: Bundle?): GuidanceStylist.Guidance {
    return GuidanceStylist.Guidance(
            getString(R.string.guidedstep_first_title),
            getString(R.string.guidedstep_first_description),
            getString(R.string.guidedstep_first_breadcrumb),
            activity.getDrawable(R.drawable.guidedstep_main_icon_1)
    )
}

@Override
public GuidanceStylist.Guidance onCreateGuidance(Bundle savedInstanceState) {
    String title = getString(R.string.guidedstep_first_title);
    String breadcrumb = getString(R.string.guidedstep_first_breadcrumb);
    String description = getString(R.string.guidedstep_first_description);
    Drawable icon = getActivity().getDrawable(R.drawable.guidedstep_main_icon_1);
    return new GuidanceStylist.Guidance(title, description, breadcrumb, icon);
}

আপনার অ্যাক্টিভিটির onCreate() মেথডে GuidedStepSupportFragment.add() কল করে আপনার GuidedStepSupportFragment সাবক্লাসটি কাঙ্ক্ষিত অ্যাক্টিভিটিতে যোগ করুন।

আপনার অ্যাক্টিভিটিতে যদি শুধুমাত্র GuidedStepSupportFragment অবজেক্ট থাকে, তাহলে প্রথম GuidedStepSupportFragment যোগ করার জন্য add() এর পরিবর্তে GuidedStepSupportFragment.addAsRoot() ব্যবহার করুন। addAsRoot() ব্যবহার করলে এটি নিশ্চিত করা যায় যে, প্রথম GuidedStepSupportFragment দেখার সময় ব্যবহারকারী যদি টিভি রিমোটের ব্যাক বাটন চাপেন, তাহলে GuidedStepSupportFragment এবং এর প্যারেন্ট অ্যাক্টিভিটি উভয়ই বন্ধ হয়ে যাবে।

দ্রষ্টব্য: GuidedStepSupportFragment অবজেক্টগুলো প্রোগ্রাম্যাটিকভাবে যোগ করুন, আপনার লেআউট XML ফাইলে নয়।

ব্যবহারকারীর কার্যকলাপ তৈরি এবং পরিচালনা করুন

onCreateActions() ওভাররাইড করে ব্যবহারকারীর অ্যাকশন যোগ করুন। আপনার ওভাররাইডে, প্রতিটি অ্যাকশন আইটেমের জন্য একটি নতুন GuidedAction যোগ করুন এবং অ্যাকশন স্ট্রিং, বিবরণ ও আইডি প্রদান করুন। নতুন অ্যাকশন যোগ করতে GuidedAction.Builder ব্যবহার করুন।

override fun onCreateActions(actions: MutableList<GuidedAction>, savedInstanceState: Bundle?) {
    super.onCreateActions(actions, savedInstanceState)

    // Add "Continue" user action for this step
    actions.add(GuidedAction.Builder()
            .id(CONTINUE)
            .title(getString(R.string.guidedstep_continue))
            .description(getString(R.string.guidedstep_letsdoit))
            .hasNext(true)
            .build())
    ...

@Override
public void onCreateActions(List<GuidedAction> actions, Bundle savedInstanceState) {
    // Add "Continue" user action for this step
    actions.add(new GuidedAction.Builder()
           .id(CONTINUE)
           .title(getString(R.string.guidedstep_continue))
           .description(getString(R.string.guidedstep_letsdoit))
           .hasNext(true)
           .build());
...

অ্যাকশন শুধু এক-লাইন নির্বাচনের মধ্যেই সীমাবদ্ধ নয়। নিচে আরও কিছু ধরনের অ্যাকশন দেওয়া হলো যা আপনি তৈরি করতে পারেন:

• ব্যবহারকারীর পছন্দ সম্পর্কে অতিরিক্ত তথ্য প্রদানের জন্য infoOnly(true) সেট করে একটি তথ্য লেবেল অ্যাকশন যোগ করুন। যখন infoOnly true হয়, ব্যবহারকারীরা অ্যাকশনটি নির্বাচন করতে পারে না।
• editable(true) সেট করে একটি সম্পাদনাযোগ্য টেক্সট অ্যাকশন যোগ করুন। যখন editable true হয়, তখন ব্যবহারকারী রিমোট বা সংযুক্ত কীবোর্ড ব্যবহার করে একটি নির্বাচিত অ্যাকশনে টেক্সট লিখতে পারেন। ব্যবহারকারীর লেখা পরিবর্তিত টেক্সটটি পাওয়ার জন্য onGuidedActionEditedAndProceed() ওভাররাইড করুন। ব্যবহারকারী কখন ইনপুট বাতিল করেন তা জানার জন্য আপনি onGuidedActionEditCanceled() ওভাররাইড করতে পারেন।
• একটি সাধারণ ID ভ্যালু সহ checkSetId() ব্যবহার করে অ্যাকশনগুলোকে একটি সেটে গ্রুপ করুন, যা চেকযোগ্য রেডিও বাটনের মতো কাজ করবে। একই চেক-সেট ID সহ একই তালিকার সমস্ত অ্যাকশনকে লিঙ্ক করা বলে গণ্য করা হয়। যখন ব্যবহারকারী সেই সেটের মধ্যে থাকা কোনো একটি অ্যাকশন নির্বাচন করেন, তখন সেই অ্যাকশনটি চেক করা হয় এবং অন্য সব অ্যাকশন আনচেক করা হয়ে যায়।
• onCreateActions() ফাংশনে GuidedDatePickerAction.Builder এর পরিবর্তে GuidedAction.Builder ব্যবহার করে একটি ডেট-পিকার অ্যাকশন যোগ করুন। ব্যবহারকারীর প্রবেশ করানো পরিবর্তিত তারিখের মানটি পাওয়ার জন্য onGuidedActionEditedAndProceed() ফাংশনটি ওভাররাইড করুন।
• এমন একটি অ্যাকশন যোগ করুন যা সাবঅ্যাকশন ব্যবহার করে ব্যবহারকারীকে পছন্দের একটি বর্ধিত তালিকা থেকে বেছে নেওয়ার সুযোগ দেয়। সাবঅ্যাকশন সম্পর্কে 'সাবঅ্যাকশন যোগ করুন' বিভাগে বর্ণনা করা হয়েছে।
• এমন একটি বাটন অ্যাকশন যোগ করুন যা অ্যাকশন তালিকার ডানদিকে প্রদর্শিত হয় এবং সহজে ব্যবহারযোগ্য। বাটন অ্যাকশনগুলো ‘বাটন অ্যাকশন যোগ করুন’ বিভাগে বর্ণনা করা হয়েছে।

আপনি hasNext(true) সেট করে একটি ভিজ্যুয়াল ইন্ডিকেটরও যোগ করতে পারেন, যা নির্দেশ করে যে কোনো অ্যাকশন নির্বাচন করলে একটি নতুন ধাপে যাওয়া হবে।

আপনি যে সমস্ত বিভিন্ন বৈশিষ্ট্য সেট করতে পারেন, সেগুলির জন্য GuidedAction দেখুন।

অ্যাকশনগুলিতে সাড়া দিতে, onGuidedActionClicked() ওভাররাইড করুন এবং পাস করা GuidedAction টি প্রসেস করুন। GuidedAction.getId() পরীক্ষা করে নির্বাচিত অ্যাকশনটি শনাক্ত করুন।

উপক্রিয়া যোগ করুন

কিছু কাজের জন্য ব্যবহারকারীকে অতিরিক্ত কিছু বিকল্প দেওয়ার প্রয়োজন হতে পারে। একটি GuidedAction সাবঅ্যাকশনগুলোর একটি তালিকা নির্দিষ্ট করতে পারে, যা চাইল্ড অ্যাকশনগুলোর একটি মেনু হিসেবে প্রদর্শিত হয়।

চিত্র ২. নির্দেশিত ধাপের উপ-ক্রিয়াসমূহ।

সাবঅ্যাকশন তালিকায় সাধারণ অ্যাকশন বা রেডিও বাটন অ্যাকশন থাকতে পারে, কিন্তু ডেট-পিকার বা সম্পাদনাযোগ্য টেক্সট অ্যাকশন থাকতে পারে না। এছাড়াও, একটি সাবঅ্যাকশনের নিজস্ব সাবঅ্যাকশনের সেট থাকতে পারে না, কারণ সিস্টেমটি একাধিক স্তরের সাবঅ্যাকশন সমর্থন করে না।

সাবঅ্যাকশন যোগ করতে, প্রথমে সাবঅ্যাকশন হিসেবে কাজ করে এমন GuidedAction অবজেক্টের একটি তালিকা তৈরি ও পূরণ করুন, যেমনটি নিম্নলিখিত উদাহরণে দেখানো হয়েছে:

subActions.add(GuidedAction.Builder()
        .id(SUBACTION1)
        .title(getString(R.string.guidedstep_subaction1_title))
        .description(getString(R.string.guidedstep_subaction1_desc))
        .build())
...

List<GuidedAction> subActions = new ArrayList<GuidedAction>();
subActions.add(new GuidedAction.Builder()
       .id(SUBACTION1)
       .title(getString(R.string.guidedstep_subaction1_title))
       .description(getString(R.string.guidedstep_subaction1_desc))
       .build());
...

onCreateActions() -এর মধ্যে একটি শীর্ষ-স্তরের GuidedAction তৈরি করুন, যা নির্বাচিত হলে সাব-অ্যাকশনগুলির তালিকা প্রদর্শন করবে:

    ...
    actions.add(GuidedAction.Builder()
            .id(SUBACTIONS)
            .title(getString(R.string.guidedstep_subactions_title))
            .description(getString(R.string.guidedstep_subactions_desc))
            .subActions(subActions)
            .build())
    ...

@Override
public void onCreateActions(List<GuidedAction> actions, Bundle savedInstanceState) {
...
    actions.add(new GuidedAction.Builder()
           .id(SUBACTIONS)
           .title(getString(R.string.guidedstep_subactions_title))
           .description(getString(R.string.guidedstep_subactions_desc))
           .subActions(subActions)
           .build());
...
}

অবশেষে, onSubGuidedActionClicked() ওভাররাইড করে সাবঅ্যাকশন নির্বাচনগুলিতে সাড়া দিন:

override fun onSubGuidedActionClicked(action: GuidedAction): Boolean {
    // Check for which action was clicked and handle as needed
    when(action.id) {
        SUBACTION1 -> {
            // Subaction 1 selected
        }
    }
    // Return true to collapse the subactions menu or
    // false to keep the menu expanded
    return true
}

@Override
public boolean onSubGuidedActionClicked(GuidedAction action) {
   // Check for which action was clicked and handle as needed
   if (action.getId() == SUBACTION1) {
       // Subaction 1 selected
   }
   // Return true to collapse the subactions menu or
   // false to keep the menu expanded
   return true;
}

বাটনের অ্যাকশন যোগ করুন

আপনার নির্দেশিত ধাপে যদি কাজের একটি দীর্ঘ তালিকা থাকে, তাহলে ব্যবহারকারীদের সবচেয়ে বেশি ব্যবহৃত কাজগুলো খুঁজে পেতে তালিকাটি স্ক্রল করতে হতে পারে। কাজের তালিকা থেকে বহুল ব্যবহৃত কাজগুলোকে আলাদা করতে বাটন অ্যাকশন ব্যবহার করুন। বাটন অ্যাকশনগুলো কাজের তালিকার পাশেই প্রদর্শিত হয় এবং সেগুলোতে সহজে যাওয়া যায়।

চিত্র ৩. নির্দেশিত স্টেপ বাটনের ক্রিয়াকলাপসমূহ।

বাটন অ্যাকশনগুলো সাধারণ অ্যাকশনের মতোই তৈরি ও পরিচালনা করা হয়, তবে এক্ষেত্রে onCreateActions onCreateButtonActions() onCreateActions() ফাংশনে বাটন অ্যাকশন তৈরি করতে হয়। onGuidedActionClicked() ফাংশনে বাটন অ্যাকশনগুলোতে সাড়া দিতে হয়।

ধাপগুলোর মধ্যে নেভিগেশনের মতো সাধারণ কাজের জন্য বাটন অ্যাকশন ব্যবহার করুন। ডেট-পিকার অ্যাকশন বা অন্যান্য সম্পাদনাযোগ্য অ্যাকশন বাটন অ্যাকশন হিসেবে ব্যবহার করবেন না। এছাড়াও, বাটন অ্যাকশনের কোনো সাব-অ্যাকশন থাকতে পারে না।

দলবদ্ধভাবে নির্দেশিত পদক্ষেপগুলোকে একটি নির্দেশিত অনুক্রমে সাজানো।

একটি GuidedStepSupportFragment একটি একক ধাপকে উপস্থাপন করে। ধাপগুলির একটি ক্রমিক অনুক্রম তৈরি করতে, একাধিক GuidedStepSupportFragment অবজেক্টকে একসাথে গ্রুপ করুন এবং GuidedStepSupportFragment.add() ব্যবহার করে অনুক্রমের পরবর্তী ধাপটিকে ফ্র্যাগমেন্ট স্ট্যাকে যুক্ত করুন।

override fun onGuidedActionClicked(action: GuidedAction) {
    val fm = fragmentManager
    when(action.id) {
        CONTINUE -> GuidedStepSupportFragment.add(fm, SecondStepFragment())
    }
}

@Override
public void onGuidedActionClicked(GuidedAction action) {
    FragmentManager fm = getFragmentManager();
    if (action.getId() == CONTINUE) {
       GuidedStepSupportFragment.add(fm, new SecondStepFragment());
    }
...

যদি ব্যবহারকারী টিভি রিমোটের ব্যাক বাটন চাপেন, তাহলে ডিভাইসটি ফ্র্যাগমেন্ট স্ট্যাকে থাকা পূর্ববর্তী GuidedStepSupportFragment টি দেখায়। যদি আপনি পূর্ববর্তী ধাপে ফিরে যাওয়ার জন্য আপনার নিজস্ব GuidedAction প্রদান করেন, তাহলে আপনি getFragmentManager().popBackStack() কল করে ব্যাক আচরণটি প্রয়োগ করতে পারেন। যদি ব্যবহারকারীকে অনুক্রমের আরও আগের কোনো ধাপে ফিরিয়ে আনার প্রয়োজন হয়, তাহলে ফ্র্যাগমেন্ট স্ট্যাকের একটি নির্দিষ্ট GuidedStepSupportFragment এ ফিরে যেতে popBackStackToGuidedStepSupportFragment() ব্যবহার করুন।

যখন ব্যবহারকারী অনুক্রমের শেষ ধাপটি সম্পন্ন করেন, তখন বর্তমান স্ট্যাক থেকে সমস্ত GuidedStepSupportFragment ইনস্ট্যান্স মুছে ফেলতে এবং মূল প্যারেন্ট অ্যাক্টিভিটিতে ফিরে যেতে finishGuidedStepSupportFragments() ব্যবহার করুন। যদি প্রথম GuidedStepSupportFragment টি addAsRoot() ব্যবহার করে যোগ করা হয়, তাহলে finishGuidedStepSupportFragments() কল করলে প্যারেন্ট অ্যাক্টিভিটিও বন্ধ হয়ে যায়।

ধাপ উপস্থাপনা কাস্টমাইজ করুন

GuidedStepSupportFragment ক্লাসটি কাস্টম থিম ব্যবহার করতে পারে, যা টাইটেল টেক্সট ফরম্যাটিং বা স্টেপ ট্রানজিশন অ্যানিমেশনের মতো উপস্থাপনার বিভিন্ন দিক নিয়ন্ত্রণ করে। কাস্টম থিমগুলোকে অবশ্যই Theme_Leanback_GuidedStep থেকে ইনহেরিট করতে হবে এবং GuidanceStylist ও GuidedActionsStylist এ সংজ্ঞায়িত অ্যাট্রিবিউটগুলোর জন্য ওভাররাইডিং ভ্যালু প্রদান করতে পারে।

আপনার GuidedStepSupportFragment এ একটি কাস্টম থিম প্রয়োগ করতে, নিম্নলিখিতগুলির মধ্যে একটি করুন:

• অ্যান্ড্রয়েড ম্যানিফেস্টে অ্যাক্টিভিটি এলিমেন্টে android:theme অ্যাট্রিবিউট সেট করে প্যারেন্ট অ্যাক্টিভিটিতে থিমটি প্রয়োগ করুন। এই অ্যাট্রিবিউটটি সেট করলে থিমটি সমস্ত চাইল্ড ভিউতে প্রয়োগ হয় এবং যদি প্যারেন্ট অ্যাক্টিভিটিতে শুধুমাত্র GuidedStepSupportFragment অবজেক্ট থাকে, তবে একটি কাস্টম থিম প্রয়োগ করার এটিই সবচেয়ে সহজ উপায়।
• যদি আপনার অ্যাক্টিভিটিতে আগে থেকেই একটি কাস্টম থিম ব্যবহৃত হয় এবং আপনি অ্যাক্টিভিটির অন্যান্য ভিউতে GuidedStepSupportFragment স্টাইলগুলো প্রয়োগ করতে না চান, তাহলে আপনার বিদ্যমান কাস্টম অ্যাক্টিভিটি থিমে LeanbackGuidedStepTheme_guidedStepTheme অ্যাট্রিবিউটটি যোগ করুন। এই অ্যাট্রিবিউটটি সেই কাস্টম থিমটিকে নির্দেশ করে, যা শুধুমাত্র আপনার অ্যাক্টিভিটির GuidedStepSupportFragment অবজেক্টগুলো ব্যবহার করে।
• যদি আপনি একই সামগ্রিক বহু-ধাপের কাজের অংশ হিসেবে বিভিন্ন অ্যাক্টিভিটিতে GuidedStepSupportFragment অবজেক্ট ব্যবহার করেন এবং সমস্ত ধাপে একটি সামঞ্জস্যপূর্ণ ভিজ্যুয়াল থিম ব্যবহার করতে চান, তাহলে GuidedStepSupportFragment.onProvideTheme() ওভাররাইড করুন এবং আপনার কাস্টম থিমটি রিটার্ন করুন।

কীভাবে স্টাইল এবং থিম যোগ করতে হয় সে সম্পর্কে আরও তথ্যের জন্য, স্টাইল এবং থিম দেখুন।

GuidedStepSupportFragment ক্লাসটি থিম অ্যাট্রিবিউটগুলো অ্যাক্সেস ও প্রয়োগ করার জন্য বিশেষ স্টাইলিস্ট ক্লাস ব্যবহার করে। GuidanceStylist ক্লাসটি বাম দিকের গাইডেন্স ভিউ-এর উপস্থাপনা নিয়ন্ত্রণ করতে থিমের তথ্য ব্যবহার করে, অন্যদিকে GuidedActionsStylist ক্লাসটি ডান দিকের অ্যাকশন ভিউ-এর উপস্থাপনা নিয়ন্ত্রণ করতে থিমের তথ্য ব্যবহার করে।

থিম কাস্টমাইজেশনের বাইরে আপনার স্টেপগুলোর ভিজ্যুয়াল স্টাইল কাস্টমাইজ করতে, GuidanceStylist বা GuidedActionsStylist সাবক্লাস করুন এবং GuidedStepSupportFragment.onCreateGuidanceStylist() বা GuidedStepSupportFragment.onCreateActionsStylist() -এ আপনার সাবক্লাসটি রিটার্ন করুন। এই সাবক্লাসগুলোতে আপনি কী কী কাস্টমাইজ করতে পারবেন, সে সম্পর্কে বিস্তারিত জানতে GuidanceStylist এবং GuidedActionsStylist এর ডকুমেন্টেশন দেখুন।