আপনার নেভিগেশন কোড এনক্যাপসুলেট করুন

আপনার গ্রাফ তৈরি করতে Kotlin DSL ব্যবহার করার সময়, একটি একক ফাইলে গন্তব্য এবং নেভিগেশন ইভেন্টগুলি বজায় রাখা কঠিন হতে পারে। এটি বিশেষভাবে সত্য যদি আপনার একাধিক স্বাধীন বৈশিষ্ট্য থাকে।

গন্তব্য নির্যাস

আপনার গন্তব্যগুলিকে NavGraphBuilder এক্সটেনশন ফাংশনে স্থানান্তর করা উচিত। তারা তাদের সংজ্ঞায়িত রুট কাছাকাছি বসবাস করা উচিত, এবং তারা প্রদর্শিত পর্দা. উদাহরণস্বরূপ, নিম্নলিখিত অ্যাপ-লেভেল কোডটি বিবেচনা করুন যা একটি গন্তব্য তৈরি করে যা পরিচিতিগুলির একটি তালিকা দেখায়:

// MyApp.kt

@Serializable
object Contacts

@Composable
fun MyApp() {
  ...
  NavHost(navController, startDestination = Contacts) {
    composable<Contacts> { ContactsScreen( /* ... */ ) }
  }
}

আপনাকে একটি পৃথক ফাইলে নেভিগেশন-নির্দিষ্ট কোড সরানো উচিত:

// ContactsNavigation.kt

@Serializable
object Contacts

fun NavGraphBuilder.contactsDestination() {
    composable<Contacts> { ContactsScreen( /* ... */ ) }
}

// MyApp.kt

@Composable
fun MyApp() {
  ...
  NavHost(navController, startDestination = Contacts) {
     contactsDestination()
  }
}

রুট এবং গন্তব্য সংজ্ঞা এখন মূল অ্যাপ থেকে আলাদা এবং আপনি সেগুলি স্বাধীনভাবে আপডেট করতে পারেন। মূল অ্যাপটি শুধুমাত্র একটি এক্সটেনশন ফাংশনের উপর নির্ভরশীল। এই ক্ষেত্রে, সেটি হল NavGraphBuilder.contactsDestination() ।

NavGraphBuilder এক্সটেনশন ফাংশন একটি স্টেটলেস স্ক্রিন-লেভেল কম্পোজেবল ফাংশন এবং নেভিগেশন-নির্দিষ্ট লজিকের মধ্যে সেতু তৈরি করে। এই স্তরটি রাজ্যটি কোথা থেকে আসে এবং আপনি কীভাবে ইভেন্টগুলি পরিচালনা করেন তা নির্ধারণ করতে পারে।

উদাহরণ

নিম্নলিখিত স্নিপেট একটি পরিচিতির বিশদ প্রদর্শনের জন্য একটি নতুন গন্তব্যের পরিচয় দেয় এবং পরিচিতির বিবরণ প্রদর্শনের জন্য একটি নেভিগেশন ইভেন্ট প্রকাশ করতে বিদ্যমান যোগাযোগ তালিকার গন্তব্য আপডেট করে।

এখানে স্ক্রিনগুলির একটি সাধারণ সেট রয়েছে যা তাদের নিজস্ব মডিউলের internal হতে পারে, যাতে অন্য মডিউলগুলি তাদের অ্যাক্সেস করতে না পারে:

// ContactScreens.kt

// Displays a list of contacts
@Composable
internal fun ContactsScreen(
  uiState: ContactsUiState,
  onNavigateToContactDetails: (contactId: String) -> Unit
) { ... }

// Displays the details for an individual contact
@Composable
internal fun ContactDetailsScreen(contact: ContactDetails) { ... }

গন্তব্য তৈরি করুন

নিম্নলিখিত NavGraphBuilder এক্সটেনশন ফাংশন একটি গন্তব্য তৈরি করে যা ConversationScreen কম্পোজযোগ্য দেখায়। উপরন্তু, এটি এখন একটি ViewModel সাথে স্ক্রীনকে সংযুক্ত করে যা স্ক্রীন UI অবস্থা প্রদান করে এবং স্ক্রীন-সম্পর্কিত ব্যবসায়িক যুক্তি পরিচালনা করে।

নেভিগেশন ইভেন্টগুলি, যেমন যোগাযোগের বিশদ গন্তব্যে নেভিগেট করা, ViewModel দ্বারা পরিচালনা না করে কলারের কাছে প্রকাশ করা হয়৷

// ContactsNavigation.kt

@Serializable
object Contacts

// Adds contacts destination to `this` NavGraphBuilder
fun NavGraphBuilder.contactsDestination(
  // Navigation events are exposed to the caller to be handled at a higher level
  onNavigateToContactDetails: (contactId: String) -> Unit
) {
  composable<Contacts> {
    // The ViewModel as a screen level state holder produces the screen
    // UI state and handles business logic for the ConversationScreen
    val viewModel: ContactsViewModel = hiltViewModel()
    val uiState = viewModel.uiState.collectAsStateWithLifecycle()
    ContactsScreen(
      uiState,
      onNavigateToContactDetails
    )
  }
}

আপনি একটি গন্তব্য তৈরি করতে একই পদ্ধতি ব্যবহার করতে পারেন যা ContactDetailsScreen প্রদর্শন করে। এই ক্ষেত্রে, একটি ভিউ মডেল থেকে UI অবস্থা পাওয়ার পরিবর্তে, আপনি সরাসরি NavBackStackEntry থেকে এটি পেতে পারেন।

// ContactsNavigation.kt

@Serializable
internal data class ContactDetails(val id: String)

fun NavGraphBuilder.contactDetailsScreen() {
  composable<ContactDetails> { navBackStackEntry ->
    ContactDetailsScreen(contact = navBackStackEntry.toRoute())
  }
}

নেভিগেশন ইভেন্ট এনক্যাপসুলেট করুন

আপনি যেভাবে গন্তব্যগুলিকে এনক্যাপসুলেট করেন, একইভাবে আপনি অপ্রয়োজনীয়ভাবে রুটের প্রকারগুলি প্রকাশ না করার জন্য নেভিগেশন ইভেন্টগুলিকে এনক্যাপসুলেট করতে পারেন৷ NavController এ এক্সটেনশন ফাংশন তৈরি করে এটি করুন।

// ContactsNavigation.kt

fun NavController.navigateToContactDetails(id: String) {
  navigate(route = ContactDetails(id = id))
}

এটা একসাথে আনুন

পরিচিতিগুলি প্রদর্শনের জন্য নেভিগেশন কোডটি এখন অ্যাপের নেভিগেশন গ্রাফ থেকে পরিষ্কারভাবে আলাদা করা হয়েছে। অ্যাপটির প্রয়োজন:

• গন্তব্য তৈরি করতে NavGraphBuilder এক্সটেনশন ফাংশন কল করুন
• নেভিগেশন ইভেন্টগুলির জন্য NavController এক্সটেনশন ফাংশন কল করে সেই গন্তব্যগুলিকে সংযুক্ত করুন৷

// MyApp.kt

@Composable
fun MyApp() {
  ...
  NavHost(navController, startDestination = Contacts) {
     contactsDestination(onNavigateToContactDetails = { contactId ->
        navController.navigateToContactDetails(id = contactId)
     })
     contactDetailsDestination()
  }
}

সংক্ষেপে

• একটি পৃথক ফাইলে স্থাপন করে আপনার নেভিগেশন কোড স্ক্রীনের একটি সম্পর্কিত সেটের জন্য এনক্যাপসুলেট করুন
• NavGraphBuilder এ এক্সটেনশন ফাংশন তৈরি করে গন্তব্য প্রকাশ করুন
• NavController এ এক্সটেনশন ফাংশন তৈরি করে নেভিগেশন ইভেন্টগুলি প্রকাশ করুন
• স্ক্রীন এবং রুটের প্রকারগুলি ব্যক্তিগত রাখতে internal ব্যবহার করুন