Android 深色模式:高程不改变表面颜色
Android Dark Mode: Elevation Not Changing Surface Color
我正在按照 google 的优秀 blog post 为我的应用制作深色主题,但我没有看到任何关于如何在我的视图上获得海拔效果的参考资料(按钮、应用程序栏等)来工作。例如,当我将我的应用程序主题设置为
<style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
并像这样制作一个按钮或卡片:
<Button
android:id="@+id/keypadOne"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@color/surface"
android:elevation="01dp"
android:text="@string/one"
android:textColor="@color/onSurface"
android:textSize="36sp" />
我希望看到使对象看起来更亮的效果,因为深色主题中使用的半透明白色覆盖层暗示高度或比背景更靠近光源。相反,我的按钮、操作栏等与背景颜色相同,因此不可见。
我的问题是:
- 我必须手动实现此提升功能还是由 Material 库提供?
- 如果我让 Android 10+ 自动运行此功能,我是否必须实施手动解决方案以实现版本 9 及更早版本的向后兼容性?
我找到了 solution。为了在 CardView 的高度上实现叠加着色效果,您必须使用包含此功能的 Material 库的特殊对象:MaterialCardView。使用此 CardView 后,将其设置为
app:cardElevation
属性,用于更改 google 博客 post 中我在上面链接的深色模式中提到的白色覆盖层。
例如,我的 CardView 现在看起来像这样:
<com.google.android.material.card.MaterialCardView
android:id="@+id/testCard"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="18dp" app:cardCornerRadius="4dp" />
请注意,此特殊高度属性仅适用于 MaterialCardView,尽管工具栏等其他视图具有 Material 版本。
首先确保您使用的是 material 组件库主题和 DayNight
变体
<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
这应该会自动更改 AppBarLayout
、Toolbar
和 MaterialCardView
的表面颜色,但如果您想根据其他视图的海拔高度设置此自动表面颜色更改,请设置您的
android:background="?attr/colorSurface"
或在 MaterialCardView
的情况下使用此 app:cardBackgroundColor="?attr/colorSurface"
并使用
应用海拔
android:elevation="4dp"
或在某些情况下没有 android 命名空间 elevation="4dp"
或在 MaterialCardView
的情况下使用此 app:cardElevation="4dp"
我正在按照 google 的优秀 blog post 为我的应用制作深色主题,但我没有看到任何关于如何在我的视图上获得海拔效果的参考资料(按钮、应用程序栏等)来工作。例如,当我将我的应用程序主题设置为
<style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
并像这样制作一个按钮或卡片:
<Button
android:id="@+id/keypadOne"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@color/surface"
android:elevation="01dp"
android:text="@string/one"
android:textColor="@color/onSurface"
android:textSize="36sp" />
我希望看到使对象看起来更亮的效果,因为深色主题中使用的半透明白色覆盖层暗示高度或比背景更靠近光源。相反,我的按钮、操作栏等与背景颜色相同,因此不可见。
我的问题是:
- 我必须手动实现此提升功能还是由 Material 库提供?
- 如果我让 Android 10+ 自动运行此功能,我是否必须实施手动解决方案以实现版本 9 及更早版本的向后兼容性?
我找到了 solution。为了在 CardView 的高度上实现叠加着色效果,您必须使用包含此功能的 Material 库的特殊对象:MaterialCardView。使用此 CardView 后,将其设置为
app:cardElevation
属性,用于更改 google 博客 post 中我在上面链接的深色模式中提到的白色覆盖层。
例如,我的 CardView 现在看起来像这样:
<com.google.android.material.card.MaterialCardView
android:id="@+id/testCard"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="18dp" app:cardCornerRadius="4dp" />
请注意,此特殊高度属性仅适用于 MaterialCardView,尽管工具栏等其他视图具有 Material 版本。
首先确保您使用的是 material 组件库主题和 DayNight
变体
<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
这应该会自动更改 AppBarLayout
、Toolbar
和 MaterialCardView
的表面颜色,但如果您想根据其他视图的海拔高度设置此自动表面颜色更改,请设置您的
android:background="?attr/colorSurface"
或在 MaterialCardView
的情况下使用此 app:cardBackgroundColor="?attr/colorSurface"
并使用
android:elevation="4dp"
或在某些情况下没有 android 命名空间 elevation="4dp"
或在 MaterialCardView
的情况下使用此 app:cardElevation="4dp"