সাধারণ ভাগ করা উপাদান ব্যবহারের ক্ষেত্রে
সেভ করা পৃষ্ঠা গুছিয়ে রাখতে 'সংগ্রহ' ব্যবহার করুন
আপনার পছন্দ অনুযায়ী কন্টেন্ট সেভ করুন ও সঠিক বিভাগে রাখুন।
ভাগ করা উপাদানগুলি অ্যানিমেট করার সময়, কিছু নির্দিষ্ট ব্যবহারের ক্ষেত্রে নির্দিষ্ট সুপারিশ রয়েছে।
অ্যাসিঙ্ক্রোনাস ছবি
অ্যাসিঙ্ক্রোনাসভাবে একটি ইমেজ লোড করার জন্য একটি লাইব্রেরি ব্যবহার করা সাধারণ, যেমন Coil এর AsyncImage composable ব্যবহার করার সময়। এটি দুটি কম্পোজেবলের মধ্যে নির্বিঘ্নে কাজ করার জন্য, শেয়ার্ড এলিমেন্ট কী থেকে প্রাপ্ত একটি স্ট্রিংয়ের মতো একই কীতে placeholderMemoryCacheKey() এবং memoryCacheKey() সেট করার সুপারিশ করা হয়েছে, যেমন ক্যাশে কীটি মিলে যাওয়া শেয়ার করা উপাদানগুলির জন্য একই। নতুন ছবি লোড না হওয়া পর্যন্ত নতুন ভাগ করা উপাদানটি তার ম্যাচের ক্যাশে স্থানধারক হিসেবে ব্যবহার করবে।
AsyncImage জন্য সাধারণ ব্যবহার নিম্নরূপ:
AsyncImage(
model = ImageRequest.Builder(LocalContext.current)
.data("your-image-url")
.crossfade(true)
.placeholderMemoryCacheKey("image-key") // same key as shared element key
.memoryCacheKey("image-key") // same key as shared element key
.build(),
placeholder = null,
contentDescription = null,
modifier = Modifier
.size(120.dp)
.sharedBounds(
rememberSharedContentState(
key = "image-key"
),
animatedVisibilityScope = this
)
) পাঠ্য
fontSize পরিবর্তন অ্যানিমেট করতে, Modifier.sharedBounds() , resizeMode = ScaleToBounds() ব্যবহার করুন। এই রূপান্তরটি আকার পরিবর্তনকে তুলনামূলকভাবে তরল করে তোলে। একটি নির্দিষ্ট ফন্ট ওজন বা শৈলী অ্যানিমেট করতে contentScale প্যারামিটারটি টুইক করা যেতে পারে।
Text(
text = "This is an example of how to share text",
modifier = Modifier
.wrapContentWidth()
.sharedBounds(
rememberSharedContentState(
key = "shared Text"
),
animatedVisibilityScope = this,
enter = fadeIn(),
exit = fadeOut(),
resizeMode = SharedTransitionScope.ResizeMode.ScaleToBounds()
)
) TextAlign পরিবর্তনগুলি ডিফল্টরূপে অ্যানিমেট করা হয় না । পরিবর্তে, ভাগ করা ট্রানজিশনের জন্য বিভিন্ন TextAlign ব্যবহার করে Modifier.wrapContentSize() বা Modifier.wrapContentWidth() ব্যবহার করুন।
এই পৃষ্ঠার কন্টেন্ট ও কোডের নমুনাগুলি Content License-এ বর্ণিত লাইসেন্সের অধীনস্থ। Java এবং OpenJDK হল Oracle এবং/অথবা তার অ্যাফিলিয়েট সংস্থার রেজিস্টার্ড ট্রেডমার্ক।
2025-08-28 UTC-তে শেষবার আপডেট করা হয়েছে।
[[["সহজে বোঝা যায়","easyToUnderstand","thumb-up"],["আমার সমস্যার সমাধান হয়েছে","solvedMyProblem","thumb-up"],["অন্যান্য","otherUp","thumb-up"]],[["এতে আমার প্রয়োজনীয় তথ্য নেই","missingTheInformationINeed","thumb-down"],["খুব জটিল / অনেক ধাপ","tooComplicatedTooManySteps","thumb-down"],["পুরনো","outOfDate","thumb-down"],["অনুবাদ সংক্রান্ত সমস্যা","translationIssue","thumb-down"],["নমুনা / কোড সংক্রান্ত সমস্যা","samplesCodeIssue","thumb-down"],["অন্যান্য","otherDown","thumb-down"]],["2025-08-28 UTC-তে শেষবার আপডেট করা হয়েছে।"],[],[],null,["When animating shared elements, there are some particular use cases that have\nspecific recommendations.\n\nAsynchronous images\n\nIt's common to use a library to load up an image asynchronously, such as when\nusing [Coil's `AsyncImage` composable](https://coil-kt.github.io/coil/compose/).\nFor it to work seamlessly between two composables, its recommended to set the\n`placeholderMemoryCacheKey()` and `memoryCacheKey()` to the same key as a string\nderived from the shared element key, such that the cache key is the same for the\nmatched shared elements. The new shared element will be using its match's cache\nas the placeholder until it loads the new image.\n\nThe typical usage for `AsyncImage` is as follows:\n\n\n```kotlin\nAsyncImage(\n model = ImageRequest.Builder(LocalContext.current)\n .data(\"your-image-url\")\n .crossfade(true)\n .placeholderMemoryCacheKey(\"image-key\") // same key as shared element key\n .memoryCacheKey(\"image-key\") // same key as shared element key\n .build(),\n placeholder = null,\n contentDescription = null,\n modifier = Modifier\n .size(120.dp)\n .sharedBounds(\n rememberSharedContentState(\n key = \"image-key\"\n ),\n animatedVisibilityScope = this\n )\n)https://github.com/android/snippets/blob/7a0ebbee11495f628cf9d574f6b6069c2867232a/compose/snippets/src/main/java/com/example/compose/snippets/animations/sharedelement/SharedElementCommonUseCaseSnippets.kt#L47-L64\n```\n\n\u003cbr /\u003e\n\nText\n\nTo animate `fontSize` changes, use `Modifier.sharedBounds()`, `resizeMode =\nScaleToBounds()`. This transition makes the size\nchange relatively fluid. The `contentScale` parameter can be tweaked to animate\na specific font weight or style.\n\n\n```kotlin\nText(\n text = \"This is an example of how to share text\",\n modifier = Modifier\n .wrapContentWidth()\n .sharedBounds(\n rememberSharedContentState(\n key = \"shared Text\"\n ),\n animatedVisibilityScope = this,\n enter = fadeIn(),\n exit = fadeOut(),\n resizeMode = SharedTransitionScope.ResizeMode.ScaleToBounds()\n )\n)https://github.com/android/snippets/blob/7a0ebbee11495f628cf9d574f6b6069c2867232a/compose/snippets/src/main/java/com/example/compose/snippets/animations/sharedelement/SharedElementCommonUseCaseSnippets.kt#L84-L97\n```\n\n\u003cbr /\u003e\n\n`TextAlign` changes are **not** animated by default. Instead, use\n`Modifier.wrapContentSize()` or `Modifier.wrapContentWidth()` over using different\n`TextAlign` for shared transitions."]]
