英文:
Android: Material Date Picker Custom Styling
问题
我正在在我的Android应用中使用Material-Component日期范围选择器，并希望自定义标题布局。我尝试在自定义样式中添加materialCalendarHeaderLayout项，但由于我是Android的新手，不确定如何正确使用它。
- 我想隐藏标题。
- 想要自定义年份和月份按钮。 (可选任务)
我使用themes.xml来修改日期选择器，使其以弹出窗口而不是全屏显示。
<resources xmlns:tools="http://schemas.android.com/tools">
<!-- 基本应用主题 -->
<style name="Theme.MyApp" parent="Theme.MaterialComponents.Light.NoActionBar">
<!-- 主要品牌颜色 -->
<item name="colorPrimary">@color/orange</item>
<item name="colorPrimaryVariant">@color/black</item>
<item name="colorOnPrimary">@color/black</item>
<!-- 次要品牌颜色 -->
<item name="colorSecondary">@color/orange</item>
<item name="colorSecondaryVariant">@color/black</item>
<item name="colorOnSecondary">@color/black</item>
<!-- 状态栏颜色 -->
<item name="android:statusBarColor">@color/black</item>
<!-- 日期范围选择器 -->
<item name="materialCalendarFullscreenTheme">@style/CustomThemeOverlay_MaterialCalendar_Fullscreen</item>
</style>
<!-- 弹出菜单主题 -->
<style name="PopupMenuBlackBackground" parent="ThemeOverlay.AppCompat.Dark">
<item name="android:popupMenuStyle">@style/PopupMenuBlackBackground.Menu</item>
<item name="android:fontFamily">@font/poppins_regular</item>
<item name="android:popupElevation">5dp</item>
<item name="android:radius">5dp</item>
</style>
<style name="PopupMenuBlackBackground.Menu" parent="Widget.AppCompat.PopupMenu">
<item name="android:popupBackground">@color/blackDark</item>
<item name="android:popupElevation">5dp</item>
<item name="android:radius">5dp</item>
</style>
<!-- 日期范围选择器全屏 -->
<style name="CustomThemeOverlay_MaterialCalendar_Fullscreen" parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="materialCalendarStyle">@style/Custom_MaterialCalendar.Fullscreen</item>
</style>
<style name="Custom_MaterialCalendar.Fullscreen" parent="@style/Widget.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="android:windowFullscreen">false</item>
</style>
</resources>
期望的日期范围选择器界面如下：
可以有人指导我如何实现这种自定义吗？对于任何帮助或建议，我将不胜感激。
提前感谢您的帮助。
英文:
I am using the Material-Component Date Range Picker in my Android app and I want to customize the header layout. I have tried adding the materialCalendarHeaderLayout item in my custom style, but I am not sure how to use it properly as I am new on the Android.
- I want to hide the header.
- Want a custom Year & Month button. (Optional task)
I used the themes.xml to modify the date picker to appear as a popup instead of fullscreen.
<resources xmlns:tools="http://schemas.android.com/tools">
<!-- Base application theme. -->
<style name="Theme.MyApp" parent="Theme.MaterialComponents.Light.NoActionBar">
<!-- Primary brand color. -->
<item name="colorPrimary">@color/orange</item>
<item name="colorPrimaryVariant">@color/black</item>
<item name="colorOnPrimary">@color/black</item>
<!-- Secondary brand color. -->
<item name="colorSecondary">@color/orange</item>
<item name="colorSecondaryVariant">@color/black</item>
<item name="colorOnSecondary">@color/black</item>
<!-- Status bar color. -->
<item name="android:statusBarColor">@color/black</item>
<!-- Date range picker -->
<item name="materialCalendarFullscreenTheme">@style/CustomThemeOverlay_MaterialCalendar_Fullscreen</item>
</style>
<!-- Popup Menu theme -->
<style name="PopupMenuBlackBackground" parent="ThemeOverlay.AppCompat.Dark">
<item name="android:popupMenuStyle">@style/PopupMenuBlackBackground.Menu</item>
<item name="android:fontFamily">@font/poppins_regular</item>
<item name="android:popupElevation">5dp</item>
<item name="android:radius">5dp</item>
</style>
<style name="PopupMenuBlackBackground.Menu" parent="Widget.AppCompat.PopupMenu">
<item name="android:popupBackground">@color/blackDark</item>
<item name="android:popupElevation">5dp</item>
<item name="android:radius">5dp</item>
</style>
<!-- Date range picker fullscreen -->
<style name="CustomThemeOverlay_MaterialCalendar_Fullscreen"
parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="materialCalendarStyle">@style/Custom_MaterialCalendar.Fullscreen</item>
</style>
<style name="Custom_MaterialCalendar.Fullscreen"
parent="@style/Widget.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="android:windowFullscreen">false</item>
</style>
</resources>
Expexted Date range picker:
Can someone guide me on how to achieve this customization? Any help or suggestions would be appreciated.
Thank you in advance.
答案1
得分: 3
不显示页眉布局，您可以使用以下代码：
<style name="App.MaterialCalendarTheme" parent="ThemeOverlay.Material3.MaterialCalendar">
<item name="materialCalendarHeaderLayout">@style/App.Material3.MaterialCalendar.HeaderLayout</item>
</style>
<style name="App.Material3.MaterialCalendar.HeaderLayout" parent="@style/Widget.Material3.MaterialCalendar.HeaderLayout">
<item name="android:visibility">gone</item>
</style>
英文:
To hide the header layout you can use:
<style name="App.MaterialCalendarTheme" parent="ThemeOverlay.Material3.MaterialCalendar">
<item name="materialCalendarHeaderLayout">@style/App.Material3.MaterialCalendar.HeaderLayout</item>
</style>
<style name="App.Material3.MaterialCalendar.HeaderLayout" parent="@style/Widget.Material3.MaterialCalendar.HeaderLayout">
<item name="android:visibility">gone</item>
</style>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论