忘忧草视频在线播放免费观看,中文字幕人妻被公上司,1000个女人18毛片

作者 /Android 開發技術推廣工程師 Gurupreet Singh

首個穩定版 Compose Material 3 現已發布。借助此內容庫，您可以使用 Material Design 3 (新一代 Material Design) 構建 Jetpack Compose 界面。立即開始在應用中使用 Material Design 3 吧！

Compose Material 3https://developer.android.google.cn/reference/kotlin/androidx/compose/material3/package-summary
Material Design 3https://m3.material.io/

*文中交替使用的術語 "Material Design 3"、"Material 3" 和 "M3" 均指代同一內容。

Material 3 不僅包含更新后的主題和組件、動態配色等個性化功能，還旨在與最新的 Android 視覺風格和系統界面相得益彰。

△ 多個使用 Material Design 3 主題的應用

您可以將 Compose Material 3 依賴項添加到 build.gradle 文件中，即可開始在應用中使用 Material Design 3:

// 在模塊 build.gradle 中添加依賴項


執行“androidx.compose.material3$material3_version”

注意: 您可以前往 Compose Material 3 版本頁面了解最新的 M3 版本:

https://developer.android.google.cn/jetpack/androidx/releases/compose-material3

配色方案

Material 3 不僅提供更廣泛的、更細粒度的顏色自定義選項，還提供開箱即用的淺色和深色配色方案。借助 Material Theme Builder，您可以使用核心顏色生成自定義配色方案，并選擇導出 Compose 主題代碼。您可以閱讀更多關于配色方案及顏色角色的內容。

△用于導出 Material 3 配色方案的 Material Theme Builder

Material Theme Builderhttps://material.io/material-theme-builder
更多關于配色方案及顏色角色的內容https://m3.material.io/styles/color/the-color-system/key-colors-tones

動態配色

動態配色源自用戶的壁紙，可應用于應用和系統界面中。

動態配色

https://m3.material.io/styles/color/dynamic-color/overview

動態配色適用于 Android 12 (API 級別 31) 及更高版本的系統。如果系統支持動態配色，則可以設置動態 ColorScheme。如果不支持，您可以轉而使用自定義的深色或淺色 ColorScheme。

△Reply 示例: 動態壁紙主題 (左) 和默認應用主題 (右)

Reply 示例

https://github.com/android/compose-samples/tree/main/Reply

ColorScheme 類為構建器提供函數以創建動態和自定義的深色與淺色配色方案:

深色

https://developer.android.google.cn/reference/kotlin/androidx/compose/material3/package-summary#dynamiclightcolorscheme
淺色

https://developer.android.google.cn/reference/kotlin/androidx/compose/material3/package-summary#dynamicdarkcolorscheme

Theme.kt

// 動態配色適用于 Android 12 及更高版本的系統
val dynamicColor = Build.VERSION.SDK_INT >= Build.VERSION_CODES.S
val colorScheme = when {
  dynamicColor && darkTheme -> dynamicDarkColorScheme(LocalContext.current)
  dynamicColor && !darkTheme -> dynamicLightColorScheme(LocalContext.current)
  darkTheme -> darkColorScheme(...)
  else -> lightColorScheme(...)
}


MaterialTheme(
  colorScheme = colorScheme,
  typography = typography,
  shapes = shapes
) {
  // M3 應用內容

Material 組件

Compose Material 3 API 包含大量全新和經過優化的 Material 組件，且我們計劃在未來的版本中添加更多組件。許多 Material 組件 (如 Card、RadioButton 和 CheckBox) 已不再是實驗性組件；這些組件的 API 十分穩定，可以在沒有 ExperimentalMaterial3Api 注釋的情況使用。

M3 Switch 組件采用全新界面，支持符合無障礙性的最小觸摸目標尺寸、顏色映射，以及不同的 Switch 滑塊圖標選項。該界面增加了觸摸目標的尺寸，同時增加了用戶互動時的滑塊尺寸，從而為用戶提供反饋: 滑塊正在與之互動。

△Material 3 Switch 滑塊互動

Switch(
      checked = isChecked,
      onCheckedChange = { /*...*/ },
      thumbContent = {
          Icon(
              imageVector = Icons.Default.Check,
              contentDescription = stringResource(id = R.string.switch_check)
          )
      },
)

抽屜式導航欄組件現在提供封裝容器表，以便單獨更改內容的顏色、形狀和高度。

抽屜式導航欄組件	內容
ModalNavigationDrawer	ModalDrawerSheet
PermanentNavigationDrawer	PermanentDrawerSheet
DismissableNavigationDrawer	DismissableDrawerSheet

△ModalNavigationDrawer

其中內容封裝在 ModalDrawerSheet 中

ModalNavigationDrawer {
    ModalDrawerSheet(
        drawerShape = MaterialTheme.shapes.small,
        drawerContainerColor = MaterialTheme.colorScheme.primaryContainer,
        drawerContentColor = MaterialTheme.colorScheme.onPrimaryContainer,
        drawerTonalElevation = 4.dp,
    ) {
        DESTINATIONS.forEach { destination ->
            NavigationDrawerItem(
                selected = selectedDestination == destination.route,
                onClick = { ... },
                icon = { ... },
                label = { ... }
            )
        }
    }
}

除現有的應用欄外，我們還推出了全新的CenterAlignedTopAppBar。該欄可用于應用的主要根網頁: 您可以借助主頁和操作圖標顯示應用名稱或頁面標題。

CenterAlignedTopAppBar(
          title = {
              Text(stringResources(R.string.top_stories))
          },
          scrollBehavior = scrollBehavior,
          navigationIcon =  { /* Navigation Icon */},
          actions = { /* App bar actions */}
)

您可以前往Compose Material 3 API 參考文檔概覽，查看 M3 最新組件和布局。也歡迎您關注版本發布頁面，即時獲取全新的和更新后的 API。

Compose Material 3 API 參考文檔概覽

https://developer.android.google.cn/reference/kotlin/androidx/compose/material3/package-summary#overview
版本發布頁面

https://developer.android.google.cn/jetpack/androidx/releases/compose-material3

排版

Material 3 將排版的命名及分組簡化為:

顯示
大標題
小標題
正文
標簽

每項內容都有大、中、小三種字體大小可供選擇，總計 15 種文本樣式。 Typography構造函數為每種樣式提供默認值，因此您無需設置您不想自定義的參數:

val typography = Typography(
  titleLarge = TextStyle(
      fontWeight = FontWeight.SemiBold,
      fontSize = 22.sp,
      lineHeight = 28.sp,
      letterSpacing = 0.sp
  ),
  titleMedium = TextStyle(
      fontWeight = FontWeight.SemiBold,
      fontSize = 16.sp,
      lineHeight = 24.sp,
      letterSpacing = 0.15.sp
  ),
  ...
}

如需自定義排版，您可以更改 TextStyle 和字體相關的屬性 (如 fontFamily 和 letterSpacing)。

bodyLarge = TextStyle(
  fontWeight = FontWeight.Normal,
  fontFamily = FontFamily.SansSerif,
  fontStyle = FontStyle.Italic,
  fontSize = 16.sp,
  lineHeight = 24.sp,
  letterSpacing = 0.15.sp,
  baselineShift = BaselineShift.Subscript
)

TextStylehttps://developer.android.google.cn/reference/kotlin/androidx/compose/ui/text/TextStyle
字體相關https://developer.android.google.cn/reference/kotlin/androidx/compose/ui/text/font/package-summary

形狀

Material 3 形狀比例定義了容器邊角的樣式，提供從方形到正圓形的一系列不同角度。

不同的形狀大小如下:

超小號
小號
中號
大號
超大號

△將 Material Design 3 的不同形狀作為默認值用于不同組件每種形狀都有一個默認值，但您可以進行覆蓋:

val shapes = Shapes(
  extraSmall = RoundedCornerShape(4.dp),
  small = RoundedCornerShape(8.dp),
  medium = RoundedCornerShape(12.dp),
  large = RoundedCornerShape(16.dp),
  extraLarge = RoundedCornerShape(28.dp)
)

您可以前往官方網站，閱讀更多關于應用形狀的內容:

https://m3.material.io/styles/shape/overview

窗口大小類

Jetpack Compose 和 Material 3 提供了幫助您的應用實現自適應的窗口大小工件。如需開始使用，您可以將 Compose Material 3 窗口大小類依賴項添加到您的 build.gradle 文件中:

// 在模塊 build.gradle 中添加依賴項


implementation "androidx.compose.material3$material3_version"

窗口大小類將大小劃分到標準大小的存儲分區中，這些存儲分區是旨在針對大部分特殊情況優化應用的斷點。

△用于將設備劃分到不同大小的存儲分區中的 WindowWidthSize 類

您可以查看 Reply Compose 示例，詳細了解自適應應用和窗口大小類的實現:

https://github.com/android/compose-samples/tree/main/Reply

窗口邊襯區支持

M3 組件 (如頂部應用欄、抽屜式導航欄、普通導航欄和側邊欄) 包含對窗口邊襯區的內置支持。無論是單獨使用還是與 Scaffold 配合使用，這些組件都能自動處理由狀態欄、導航欄和系統界面的其他部分確定的邊襯區。 Scaffold 現在支持 contentWindowInsets 參數，該參數有助于為 Scaffold 內容確定邊襯區。只有當 topBar 或 bottomBar 無法在 Scaffold 中使用時，您才需要考慮使用 Scaffold 邊襯區，因為這些組件會以組件級別處理邊襯區。

Scaffold(
    contentWindowInsets = WindowInsets(16.dp)
) {
    // Scaffold content
}

資源

隨著 Compose Material 3 迎來穩定版本，現在是全面了解該內容庫并準備好在應用中使用的絕佳時機。您可以查看下方資源，即刻開始使用。

完整的 Material 3 和 Compose 示例 Reply:
https://github.com/android/compose-samples/tree/main/Reply
開始將 Material 3 添加至您應用的指南:https://developer.android.google.cn/jetpack/compose/themes/material3
Material 2 升級至 Material 3 的遷移指南:
https://developer.android.google.cn/jetpack/compose/themes/material2-material3
Jetpack Compose 示例 GitHub 代碼庫，您可以在其中找到各種使用 Material 3 的最新示例:

https://github.com/android/compose-samples
StackOverflow中的 Compose 社區:

https://stackoverflow.com/questions/tagged/material-desig
Kotlin Slack 群組
http://slack.kotlinlang.org/
您可以在錯誤追蹤器，將發現的問題分享給我們并追蹤功能請求:
https://issuetracker.google.com/issues/new?component=742043