您的应用磁贴应在各种尺寸的 Wear OS 设备上都能良好运行，充分利用可用空间，并在较小的屏幕上也保持美观。本指南提供了一些实现此用户体验的建议。
要了解有关自适应布局设计原则的更多信息，请阅读设计指南。
使用 ProtoLayout 构建响应式布局
ProtoLayout Material 库提供了预定义的布局，可帮助您构建磁贴。这些布局已设计为适应屏幕尺寸。
请参考Figma 设计布局，其中演示了可用的规范布局以及如何使用它们构建您的设计。
我们建议对于大多数用例，将PrimaryLayout 或EdgeContentLayout 作为顶级布局。例如，使用setResponsiveContentInsetEnabled设置响应式行为。
PrimaryLayout.Builder(deviceParameters)
.setResponsiveContentInsetEnabled(true)
.setContent(
// ...
)
.build()
通过断点提供差异化体验
ProtoLayout Material 库中的布局已经是响应式的，并负责正确的元素放置和可见性。但是，在某些情况下，您可能需要更改可见元素的数量以获得最佳效果。例如，您可能希望在较小的显示屏上显示 3 个按钮，在较大的显示屏上显示 5 个按钮。
要实现这种差异化体验，请使用 *屏幕尺寸断点*。要在屏幕尺寸超过 225 dp 时显示不同的布局。
PrimaryLayout.Builder(deviceParameters)
.setResponsiveContentInsetEnabled(true)
.setContent(
MultiButtonLayout.Builder()
.addButtonContent(button1)
.addButtonContent(button2)
.addButtonContent(button3)
.apply {
if (deviceParameters.screenHeightDp >= 225) {
addButtonContent(button4)
addButtonContent(button5)
}
}
.build()
)
.setPrimaryLabelTextContent(label)
.setPrimaryChipContent(compactChip)
.build()
设计指南 演示了其他机会。
使用预览在不同屏幕尺寸上测试磁贴
务必在不同屏幕尺寸上测试您的布局。使用 Tile 预览注释，以及TilePreviewHelper 和TilePreviewData 类。
@Preview(device = WearDevices.LARGE_ROUND)
fun smallPreview(context: Context) = TilePreviewData(
onTileRequest = { request ->
TilePreviewHelper.singleTimelineEntryTileBuilder(
buildLayout()
).build()
}
)
这使您可以在 Android Studio 中直接预览 Tile 布局。之前的断点 示例演示了当屏幕空间允许时，预览时如何显示其他按钮。
显示断点效果的小屏幕和大屏幕
有关完整示例，请参阅 GitHub 上的媒体磁贴示例。