প্যারালাক্স স্ক্রলিং এমন একটি কৌশল যেখানে ব্যাকগ্রাউন্ড কন্টেন্ট এবং ফোরগ্রাউন্ড কন্টেন্ট বিভিন্ন গতিতে স্ক্রোল করে। আপনি আপনার অ্যাপের UI উন্নত করতে এই কৌশলটি প্রয়োগ করতে পারেন, আপনার ব্যবহারকারী স্ক্রোল করার সাথে সাথে আরও গতিশীল অভিজ্ঞতা তৈরি করতে পারেন।
সংস্করণ সামঞ্জস্য
এই বাস্তবায়নের জন্য আপনার প্রজেক্ট minSDK এপিআই লেভেল 21 বা তার উপরে সেট করা প্রয়োজন।
নির্ভরতা
একটি প্যারালাক্স প্রভাব তৈরি করুন
প্যারালাক্স প্রভাব অর্জনের জন্য, আপনি স্ক্রলিং মানের একটি ভগ্নাংশ কম্পোজেবল থেকে কম্পোজেবলে প্রয়োগ করুন যার জন্য প্যারালাক্স প্রভাব প্রয়োজন। নিম্নলিখিত স্নিপেট দুটি নেস্টেড ভিজ্যুয়াল উপাদান নেয়—একটি চিত্র এবং পাঠ্যের একটি ব্লক—এবং বিভিন্ন গতিতে একই দিকে স্ক্রোল করে:
@Composable fun ParallaxEffect() { fun Modifier.parallaxLayoutModifier(scrollState: ScrollState, rate: Int) = layout { measurable, constraints -> val placeable = measurable.measure(constraints) val height = if (rate > 0) scrollState.value / rate else scrollState.value layout(placeable.width, placeable.height) { placeable.place(0, height) } } val scrollState = rememberScrollState() Column( modifier = Modifier .fillMaxWidth() .verticalScroll(scrollState), ) { Image( painterResource(id = R.drawable.cupcake), contentDescription = "Android logo", contentScale = ContentScale.Fit, // Reduce scrolling rate by half. modifier = Modifier.parallaxLayoutModifier(scrollState, 2) ) Text( text = stringResource(R.string.detail_placeholder), modifier = Modifier .background(Color.White) .padding(horizontal = 8.dp), ) } }
কোড সম্পর্কে মূল পয়েন্ট
- কম্পোজেবল স্ক্রোল করার হার সামঞ্জস্য করতে একটি কাস্টম
layout
মডিফায়ার তৈরি করে। -
Image
Text
চেয়ে ধীর গতিতে স্ক্রোল করে, একটি প্যারালাক্স প্রভাব তৈরি করে কারণ দুটি কম্পোজেবল বিভিন্ন হারে উল্লম্বভাবে অনুবাদ করে।
ফলাফল
এই নির্দেশিকা ধারণকারী সংগ্রহ
এই নির্দেশিকাটি এই কিউরেট করা কুইক গাইড সংগ্রহের অংশ যা বৃহত্তর অ্যান্ড্রয়েড উন্নয়ন লক্ষ্যগুলি কভার করে: