Compose 中的設計系統
透過集合功能整理內容
你可以依據偏好儲存及分類內容。
Jetpack Compose 可協助您輕鬆實作設計系統,並透過主題設定和元件等功能,為應用程式提供一致的外觀和風格。
以下頁面詳細說明如何設計及實作設計系統:
範例
您可以透過下列範例查看 Jetpack Compose 中的設計系統:
為您推薦
這個頁面中的內容和程式碼範例均受《內容授權》中的授權所規範。Java 與 OpenJDK 是 Oracle 和/或其關係企業的商標或註冊商標。
上次更新時間:2025-08-21 (世界標準時間)。
[null,null,["上次更新時間:2025-08-21 (世界標準時間)。"],[],[],null,["# Design systems in Compose\n\nJetpack Compose makes it easy to implement a design system and give your\napp a consistent look and feel with theming, components, and more.\n\nThe following pages provide details on how to design and implement your design\nsystem:\n\n- [Material Design 3](/develop/ui/compose/designsystems/material3): Learn how to use [Google's design system](https://m3.material.io/) to build your product in Compose.\n- [Migrating from Material 2 to Material 3](/develop/ui/compose/designsystems/material2-material3): Learn how to migrate your app from Material Design 2 to Material Design 3 in Compose.\n- [Custom design systems](/develop/ui/compose/designsystems/custom): Learn how to implement a custom design system in Compose, and how to adapt existing Material Design composables to handle this.\n- [Anatomy of a theme](/develop/ui/compose/designsystems/anatomy): Learn about the lower-level constructs and APIs used by `MaterialTheme` and custom design systems.\n- [Migrating XML themes to Compose](/develop/ui/compose/designsystems/views-to-compose): Learn how to migrate your View-based XML themes to Compose.\n\n### Samples\n\nThe following samples demonstrate design systems in Jetpack Compose:\n\nRecommended for you\n-------------------\n\n- Note: link text is displayed when JavaScript is off\n- [Material Design 2 in Compose](/develop/ui/compose/designsystems/material)\n- [Custom design systems in Compose](/develop/ui/compose/designsystems/custom)\n- [Anatomy of a theme in Compose](/develop/ui/compose/designsystems/anatomy)"]]