web-dev-qa-db-ja.com

マテリアルデザインAndroidでTimePickerをカスタマイズする方法は？

セレクターの色やTimePickerの他の部分を変更できません。これまでのところ、ヘッダーの色と背景を変更することはできますが、内側の円とテキストの色を変更することはできません。

カスタムテーマの変更 リンク 。

私のコード：

<TimePicker
    Android:id="@+id/tp"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:timePickerMode="clock"
    Android:headerBackground="#565466"
    Android:amPmBackgroundColor="#500126"
    Android:numbersBackgroundColor="#57e326"
    Android:numbersTextColor="#995394"
    Android:numbersSelectorColor="#675543"
    Android:textColorSecondary="#897530"
    Android:textColorPrimary="#359875"
/>
androidandroid-themeandroid-timepicker
9
jason

基本モード

あなたがしなければならないのはあなたの活動のテーマであなたのアクセントの色を設定することです：

<item name="colorAccent">#3333cc</item>

これにより、すべての色が設定されるため、スタイリングを台無しにすることはありません。

（これは、TimePickerにamPmBackgroundColorのような値を直接設定するべきではないことも意味します。Androidがあなたに代わって行います。）

アドバンストモード

可能なすべての値を個別に指定する場合は、次のようにします。

まず、アクティビティのテーマでこれを定義します。

<item name="Android:timePickerStyle">@style/Theme.MyTheme.TimePicker</item>

次に、適切なスタイルを作成します。

<style name="Theme.MyTheme.TimePicker" parent="Android:Widget.Material.Light.TimePicker">
    <item name="Android:timePickerMode">clock</item>
    <item name="Android:headerBackground">#ff555555</item>
    <item name="Android:numbersTextColor">?android:attr/textColorPrimaryActivated</item>
    <item name="Android:numbersInnerTextColor">?android:attr/textColorSecondaryActivated</item>
    <item name="Android:numbersSelectorColor">?android:attr/colorControlActivated</item>
    <item name="Android:numbersBackgroundColor">#ff555555</item>
    <item name="Android:amPmTextColor">?android:attr/textColorSecondary</item>
</style>

numbersInnerTextColorはAPIレベル23からのみ利用可能であり、他のスタイル（headerTextColorなど）は設定できないことに注意してください（または少なくとも私はそれを機能させることができませんでした）。

TimePickerは含まれているアクティビティと同じ色である必要があるため、「詳細」モードを使用しないことをお勧めします。そうしないと、UXに悪影響を与える可能性があります。

18
Gergely Kőrössy

TimePickerマテリアルスタイル：

カスタムカラーを使用したTimePickerDialogマテリアルスタイル

<style name="MyTimePickerDialogStyle" parent="@style/ThemeOverlay.AppCompat.Dialog.Alert">
<item name="showTitle">false</item>
<item name="colorControlActivated">#ffd600</item>
<item name="colorAccent">#b71c1c</item>
<item name="Android:textColorPrimary">#43a047</item>
<item name="Android:textColorSecondary">#f44336</item>
</style>

TimePickerウィジェットスタイル

<style name="MyTimePickerWidgetStyle" parent="@Android:style/Widget.Material.TimePicker">
    <item name="Android:headerBackground">#ffe082</item>
    <item name="Android:numbersTextColor">#b71c1c</item>
    <item name="Android:numbersInnerTextColor">#f44336</item>
    <item name="Android:numbersSelectorColor">#33691e</item>
    <item name="Android:numbersBackgroundColor">#ef9a9a</item>
    <item name="Android:amPmTextColor">#9c27b0</item>
</style>

TimePickerの詳細については、 http://www.zoftino.com/Android-timepicker-example を参照してください。

3
Arnav Rao