এই নির্দেশিকাটি ব্যাখ্যা করে কিভাবে কম্পোজে একটি ডায়নামিক টপ অ্যাপ বার তৈরি করতে হয় যা তালিকা থেকে আইটেম নির্বাচন করার সময় তার বিকল্পগুলি পরিবর্তন করে। আপনি নির্বাচনের অবস্থার উপর ভিত্তি করে টপ অ্যাপ বারের শিরোনাম এবং ক্রিয়াগুলি পরিবর্তন করতে পারেন।
ডায়নামিক টপ অ্যাপ বার আচরণ বাস্তবায়ন করুন
এই কোডটি উপরের অ্যাপ বারের জন্য একটি কম্পোজেবল ফাংশন সংজ্ঞায়িত করে যা আইটেম নির্বাচনের উপর ভিত্তি করে পরিবর্তিত হয়:
@Composable fun AppBarSelectionActions( selectedItems: Set<Int>, modifier: Modifier = Modifier, ) { val hasSelection = selectedItems.isNotEmpty() val topBarText = if (hasSelection) { "Selected ${selectedItems.size} items" } else { "List of items" } TopAppBar( title = { Text(topBarText) }, colors = TopAppBarDefaults.topAppBarColors( containerColor = MaterialTheme.colorScheme.primaryContainer, titleContentColor = MaterialTheme.colorScheme.primary, ), actions = { if (hasSelection) { IconButton(onClick = { /* click action */ }) { Icon( imageVector = Icons.Filled.Share, contentDescription = "Share items" ) } } }, modifier = modifier ) }
কোড সম্পর্কে গুরুত্বপূর্ণ বিষয়সমূহ
-  AppBarSelectionActionsনির্বাচিত আইটেম সূচীর একটিSetগ্রহণ করে।
-  আপনি কোন আইটেম নির্বাচন করেছেন কিনা তার উপর নির্ভর করে topBarTextপরিবর্তিত হয়।-  যখন আপনি আইটেম নির্বাচন করেন, তখন নির্বাচিত আইটেমের সংখ্যা বর্ণনা করে টেক্সট TopAppBarএ প্রদর্শিত হয়।
-  যদি আপনি কোনও আইটেম নির্বাচন না করেন, topBarTextহল "আইটেমের তালিকা"।
 
-  যখন আপনি আইটেম নির্বাচন করেন, তখন নির্বাচিত আইটেমের সংখ্যা বর্ণনা করে টেক্সট 
-  actionsব্লকটি উপরের অ্যাপ বারে আপনার প্রদর্শিত অ্যাকশনগুলিকে সংজ্ঞায়িত করে। যদিhasSelectionসত্য হয়, তাহলে টেক্সটের পরে একটি শেয়ার আইকন প্রদর্শিত হবে।
-  আইকনে ক্লিক করলে IconButtonএরonClickল্যাম্বডা শেয়ার অ্যাকশন পরিচালনা করে।
ফলাফল

নির্বাচনযোগ্য তালিকাকে গতিশীল শীর্ষ অ্যাপ বারে একীভূত করুন
এই উদাহরণটি দেখায় কিভাবে একটি ডাইনামিক টপ অ্যাপ বারে একটি নির্বাচনযোগ্য তালিকা যোগ করতে হয়:
@Composable private fun AppBarMultiSelectionExample( modifier: Modifier = Modifier, ) { val listItems by remember { mutableStateOf(listOf(1, 2, 3, 4, 5, 6)) } var selectedItems by rememberSaveable { mutableStateOf(setOf<Int>()) } Scaffold( modifier = modifier, topBar = { AppBarSelectionActions(selectedItems) } ) { innerPadding -> LazyColumn(contentPadding = innerPadding) { itemsIndexed(listItems) { _, index -> val isItemSelected = selectedItems.contains(index) ListItemSelectable( selected = isItemSelected, Modifier .combinedClickable( interactionSource = remember { MutableInteractionSource() }, indication = null, onClick = { /* click action */ }, onLongClick = { if (isItemSelected) selectedItems -= index else selectedItems += index } ) ) } } } }
কোড সম্পর্কে গুরুত্বপূর্ণ বিষয়সমূহ
- আপনি কতগুলি তালিকা আইটেম নির্বাচন করেছেন তার উপর ভিত্তি করে উপরের বারটি আপডেট হয়।
-  selectedItemsনির্বাচিত আইটেম সূচীর সেট ধারণ করে।
-  AppBarMultiSelectionExampleস্ক্রিন গঠনের জন্য একটিScaffoldব্যবহার করে।-  topBar = { AppBarSelectionActions(selectedItems) }AppBarSelectionActionsকম্পোজেবলকে শীর্ষ অ্যাপ বার হিসেবে সেট করে।AppBarSelectionActionsselectedItemsঅবস্থা গ্রহণ করে।
 
-  
-  LazyColumnআইটেমগুলিকে একটি উল্লম্ব তালিকায় প্রদর্শন করে, শুধুমাত্র স্ক্রিনে দৃশ্যমান আইটেমগুলিকে রেন্ডার করে।
-  ListItemSelectableএকটি নির্বাচনযোগ্য তালিকা আইটেম প্রতিনিধিত্ব করে।-  combinedClickableআইটেম নির্বাচনের জন্য ক্লিক এবং লং-ক্লিক উভয় হ্যান্ডলিং করার সুযোগ দেয়। একটি ক্লিক একটি ক্রিয়া সম্পাদন করে, অন্যদিকে একটি আইটেমে দীর্ঘ-ক্লিক করলে তার নির্বাচনের অবস্থা টগল হয়।
 
-  
ফলাফল

