Tetap teratur dengan koleksi
Simpan dan kategorikan konten berdasarkan preferensi Anda.
Mulai Kartu 1.2, Anda dapat melakukan streaming pembaruan data platform menggunakan
ekspresi dinamis. Kemudian, Anda dapat mengaitkan pembaruan ini dengan animasi
di kartu Anda. Aplikasi Anda mendapatkan pembaruan untuk nilai ini setiap detik.
Dengan menggunakan ekspresi dinamis, Anda tidak perlu me-refresh seluruh kartu saat
kontennya berubah. Untuk membuat pengalaman yang lebih menarik di kartu, animasikan
objek dinamis tersebut.
Mengaitkan ekspresi dinamis dengan sumber data
Namespace androidx.wear.protolayout dan androidx.wear.protolayout.material
berisi banyak class yang kolomnya menerima ekspresi dinamis.
Beberapa contohnya meliputi:
Untuk menggunakan ekspresi dinamis sebagai kemungkinan nilai untuk elemen dalam kartu Anda, gunakan
jenis properti dinamis *Prop yang sesuai pada elemen dan teruskan sumber
data ke metode setDynamicValue() class builder
jenis properti dinamis.
Kartu mendukung jenis properti dinamis ini:
Untuk dimensi linear, yang diukur dalam piksel yang tidak bergantung pada tampilan, gunakan
DimensionBuilders.DpProp.
Saat menggunakan ekspresi dinamis yang memengaruhi dimensi fisik—nilai apa pun dalam
kartu kecuali warna—Anda juga harus menentukan kumpulan batasan terkait, seperti
format string. Batasan ini memungkinkan perender sistem menentukan
jumlah ruang maksimum yang dapat menempati nilai dalam kartu Anda. Biasanya, Anda
akan menentukan batasan ini pada tingkat elemen, bukan pada tingkat ekspresi
dinamis, dengan memanggil metode yang dimulai dengan setLayoutConstraintsForDynamic*.
Cuplikan kode berikut menunjukkan cara menampilkan pembaruan pada detak jantung menggunakan 3
digit, dengan nilai penggantian --:
Menggunakan sejumlah kecil ekspresi dalam satu kartu
Wear OS menetapkan batas jumlah ekspresi yang dapat dimiliki
satu kartu. Jika kartu berisi terlalu banyak ekspresi dinamis total, nilai dinamis
akan diabaikan, dan sistem akan kembali ke nilai statis yang Anda berikan ke
jenis properti dinamis masing-masing.
Menggabungkan data dinamis ke dalam objek status
Anda dapat menggabungkan kumpulan pembaruan terbaru dari sumber data ke dalam status,
yang akan diteruskan ke kartu untuk rendering nilai.
Untuk menggunakan informasi status di kartu Anda, selesaikan langkah-langkah berikut:
Tetapkan kumpulan kunci yang mewakili berbagai nilai dari status kartu
Anda. Contoh ini membuat kunci untuk asupan air dan catatan:
Dalam penerapan onTileRequest(), panggil setState() dan tetapkan
pemetaan awal dari setiap kunci ke nilai data dinamis tertentu:
Kotlin
overridefunonTileRequest(requestParams:TileRequest):ListenableFuture<Tile>{valstate=State.Builder().addKeyToValueMapping(KEY_WATER_INTAKE,DynamicDataBuilders.DynamicDataValue.fromInt(200)).addKeyToValueMapping(KEY_NOTE,DynamicDataBuilders.DynamicDataValue.fromString("Note about day")).build()// ...returnFutures.immediateFuture(Tile.Builder()// Set resources, timeline, and other tile properties..setState(state).build())
Java
@OverrideprotectedListenableFuture<Tile>onTileRequest(ListenableFuture<Tile>{Statestate=newState.Builder().addKeyToValueMapping(KEY_WATER_INTAKE,DynamicDataBuilders.DynamicDataValue.fromInt(200)).addKeyToValueMapping(KEY_NOTE,DynamicDataBuilders.DynamicDataValue.fromString("Note about day")).build();// ...returnFutures.immediateFuture(Tile.Builder()// Set resources, timeline, and other tile properties..setState(state).build());}
Saat Anda membuat tata letak, di tempat yang diinginkan untuk menampilkan data ini
dari status, gunakan objek jenis Dynamic*. Anda juga dapat memanggil animate() untuk
menampilkan animasi dari nilai sebelumnya ke nilai saat ini:
Kotlin
DynamicInt32.from(KEY_WATER_INTAKE).animate()
Java
DynamicInt32.from(KEY_WATER_INTAKE).animate();
Jika diperlukan, Anda juga dapat memperbarui status dengan nilai baru. Status ini dapat
menjadi bagian dari LoadAction kartu.
Dalam contoh ini, nilai asupan air diperbarui menjadi 400:
Konten dan contoh kode di halaman ini tunduk kepada lisensi yang dijelaskan dalam Lisensi Konten. Java dan OpenJDK adalah merek dagang atau merek dagang terdaftar dari Oracle dan/atau afiliasinya.
Terakhir diperbarui pada 2025-08-30 UTC.
[[["Mudah dipahami","easyToUnderstand","thumb-up"],["Memecahkan masalah saya","solvedMyProblem","thumb-up"],["Lainnya","otherUp","thumb-up"]],[["Informasi yang saya butuhkan tidak ada","missingTheInformationINeed","thumb-down"],["Terlalu rumit/langkahnya terlalu banyak","tooComplicatedTooManySteps","thumb-down"],["Sudah usang","outOfDate","thumb-down"],["Masalah terjemahan","translationIssue","thumb-down"],["Masalah kode / contoh","samplesCodeIssue","thumb-down"],["Lainnya","otherDown","thumb-down"]],["Terakhir diperbarui pada 2025-08-30 UTC."],[],[],null,["Starting in Tiles 1.2, you can stream platform data updates using\n[dynamic expressions](/training/wearables/data/dynamic). You can then associate these updates with animations\nin your tiles. Your app gets updates to this value every second.\n\nUsing dynamic expressions, you don't need to refresh the entire tile when its\ncontent changes. To create a more engaging experience in your tiles, animate\nthose dynamic objects.\n\nAssociate dynamic expressions with data sources\n\nThe `androidx.wear.protolayout` and `androidx.wear.protolayout.material`\nnamespaces contain many classes whose fields accept dynamic expressions.\nSeveral examples include the following:\n\n- Several length values, including the [length of an `Arc` object](/reference/androidx/wear/protolayout/LayoutElementBuilders.ArcLine#getLength()) and the [length of a `CircularProgressIndicator`](/reference/androidx/wear/protolayout/material/CircularProgressIndicator#getProgress()) object.\n- Any color, such as the [content color of a `Button` object](/reference/androidx/wear/protolayout/material/ButtonColors#getContentColor()).\n- Many string values, including the [content of a `Text` object](/reference/androidx/wear/protolayout/material/Text#getText()), the [content of a `LayoutElementsBuilders.Text` object](/reference/androidx/wear/protolayout/LayoutElementBuilders.Text#getText()), and the [content\n description of a `CircularProgressIndicator` object](/reference/androidx/wear/protolayout/material/CircularProgressIndicator#getContentDescription()).\n\nTo use a dynamic expression as a possible value for an element in your tile, use\nthe element's corresponding `*Prop` dynamic property type and pass in the data\nsource to the dynamic property type's builder class's `setDynamicValue()`\nmethod.\n\nTiles support these dynamic property types:\n\n- For linear dimensions, measured in display-independent pixels, use [`DimensionBuilders.DpProp`](/reference/androidx/wear/tiles/DimensionBuilders.DpProp).\n- For angular dimensions, measured in degrees, use [`DimensionBuilders.DegreesProp`](/reference/androidx/wear/tiles/DimensionBuilders.DegreesProp).\n- For string values, use [`TypeBuilders.StringProp`](/reference/androidx/wear/protolayout/TypeBuilders.StringProp).\n- For color values, use [`ColorBuilders.ColorProp`](/reference/androidx/wear/protolayout/ColorBuilders.ColorProp).\n- For floating-point values, use [`TypeBuilders.FloatProp`](/reference/androidx/wear/protolayout/TypeBuilders.FloatProp).\n\nWhen you use a dynamic expression that affects physical dimensions---any value in\na tile except for color---you must also specify a set of related constraints, such\nas a string format. These constraints allow the system renderer to determine the\nmaximum amount of space that a value could occupy within your tile. Usually, you\nspecify these constraints at the element level, not at the dynamic expression\nlevel, by calling a method that starts with `setLayoutConstraintsForDynamic*`.\n| **Note:** The Material components set these layout constraints automatically.\n\nThe following code snippet shows how to display updates to a heart rate using 3\ndigits, with a fallback value of `--`: \n\n```kotlin\noverride fun onTileRequest(requestParams: RequestBuilders.TileRequest) =\n Futures.immediateFuture(\n Tile.Builder()\n .setResourcesVersion(RESOURCES_VERSION)\n .setFreshnessIntervalMillis(60 * 60 * 1000) // 60 minutes\n .setTileTimeline(\n Timeline.fromLayoutElement(\n Text.Builder(\n this,\n TypeBuilders.StringProp.Builder(\"--\")\n .setDynamicValue(\n PlatformHealthSources.heartRateBpm()\n .format()\n .concat(DynamicBuilders.DynamicString.constant(\" bpm\"))\n )\n .build(),\n TypeBuilders.StringLayoutConstraint.Builder(\"000\").build(),\n )\n .build()\n )\n )\n .build()\n )https://github.com/android/snippets/blob/f95ab59fad80aeaf5d6a90bab8a01a126f20f44e/wear/src/main/java/com/example/wear/snippets/tile/Tile.kt#L178-L200\n```\n\nUse a small number of expressions within a single tile\n\nWear OS [places a limit](/training/wearables/data/dynamic#use-limited-number-per-screen) on the number of expressions that a single tile can\nhave. If a tile contains too many total dynamic expressions, dynamic values are\nignored, and the system falls back to the static values that you provide to the\nrespective dynamic property types.\n\nConsolidate dynamic data into a state object\n\nYou can consolidate the latest set of updates from data sources into a *state*,\nwhich you pass over to your tile for value rendering.\n\nTo use state information in your tiles, complete these steps:\n\n1. Establish a set of keys that represent the different values of your tile's\n state. This example creates keys for water intake and a note:\n\n Kotlin \n\n ```kotlin\n companion object {\n val KEY_WATER_INTAKE = AppDataKey\u003cDynamicInt32\u003e(\"water_intake\")\n val KEY_NOTE = AppDataKey\u003cDynamicString\u003e(\"note\")\n }\n ```\n\n Java \n\n ```java\n private static final AppDataKey\u003cDynamicInt32\u003e KEY_WATER_INTAKE =\n new AppDataKey\u003cDynamicInt32\u003e(\"water_intake\");\n private static final AppDataKey\u003cDynamicString\u003e KEY_NOTE =\n new AppDataKey\u003cDynamicString\u003e(\"note\");\n ```\n2. In your implementation of `onTileRequest()`, call `setState()` and establish\n initial mappings from each key to a particular dynamic data value:\n\n Kotlin \n\n ```kotlin\n override fun onTileRequest(requestParams: TileRequest):\n ListenableFuture\u003cTile\u003e {\n val state = State.Builder()\n .addKeyToValueMapping(KEY_WATER_INTAKE,\n DynamicDataBuilders.DynamicDataValue.fromInt(200))\n .addKeyToValueMapping(KEY_NOTE,\n DynamicDataBuilders.DynamicDataValue.fromString(\"Note about day\"))\n .build()\n // ...\n\n return Futures.immediateFuture(Tile.Builder()\n // Set resources, timeline, and other tile properties.\n .setState(state)\n .build()\n )\n ```\n\n Java \n\n ```java\n @Override\n protected ListenableFuture\u003cTile\u003e onTileRequest(\n ListenableFuture\u003cTile\u003e {\n State state = new State.Builder()\n .addKeyToValueMapping(KEY_WATER_INTAKE,\n DynamicDataBuilders.DynamicDataValue.fromInt(200))\n .addKeyToValueMapping(KEY_NOTE,\n DynamicDataBuilders.DynamicDataValue.fromString(\"Note about day\"))\n .build();\n // ...\n\n return Futures.immediateFuture(Tile.Builder()\n // Set resources, timeline, and other tile properties.\n .setState(state)\n .build()\n );\n }\n ```\n3. When you create your layout, in a place where you want to show this data\n from state, use a `Dynamic*` type object. You can also call `animate()` to\n show an animation from the previous value to the current value:\n\n Kotlin \n\n ```kotlin\n DynamicInt32.from(KEY_WATER_INTAKE).animate()\n ```\n\n Java \n\n ```java\n DynamicInt32.from(KEY_WATER_INTAKE).animate();\n ```\n4. When needed, you can also update the state with new values. This can be\n part of a tile's [`LoadAction`](/reference/androidx/wear/protolayout/ActionBuilders.LoadAction).\n\n In this example, the water intake value is updated to `400`: \n\n Kotlin \n\n ```kotlin\n val loadAction = LoadAction.Builder()\n .setRequestState(\n State.Builder()\n .addKeyToValueMapping(\n KEY_WATER_INTAKE,\n DynamicDataBuilders.DynamicDataValue.fromInt(400)\n )\n .build()\n )\n .build()\n ```\n\n Java \n\n ```java\n LoadAction loadAction = new LoadAction.Builder()\n .setRequestState(\n new State.Builder()\n .addKeyToValueMapping(\n KEY_WATER_INTAKE,\n DynamicDataBuilders.DynamicDataValue.fromInt(400)\n ).build()\n ).build();\n ```\n\nRecommended for you\n\n- Note: link text is displayed when JavaScript is off\n- [Migrate to ProtoLayout namespaces](/training/wearables/tiles/migrate-to-protolayout)\n- [Get started with tiles](/training/wearables/tiles/get_started)\n- [Other considerations](/develop/ui/compose/migrate/other-considerations)"]]