перейти с MaterialComponents на Material 3, как использовать мои старые пользовательские цвета для новой версии материала

Question

перейти с MaterialComponents на Material 3, как использовать мои старые пользовательские цвета для новой версии материала

Я пытаюсь перенести свое текущее приложение изMaterialComponentsиспользовать новую версиюMaterial3Я хочу использовать свои старые цвета (пользовательские цвета) для панелей инструментов и панели навигации, но меня немного смущают многие атрибуты, которые изменились, и я не могу определить, какие атрибуты мне нужны для этого.

следующие мои старые цвета и темы, которые я использовал в своем приложении

цвета.xml

      <resources>
    <color name="purple_200">#FFBB86FC</color>
    <color name="purple_500">#FF6200EE</color>
    <color name="purple_700">#FF3700B3</color>
    <color name="teal_200">#FF03DAC5</color>
    <color name="teal_700">#FF018786</color>
    <color name="black">#FF000000</color>
    <color name="white">#FFFFFFFF</color>

    <color name="primaryColor">#1aae66</color>
    <color name="primaryLightColor">#5ee194</color>
    <color name="primaryDarkColor">#007d3a</color>

    <color name="secondaryColor">#1de9b6</color>
    <color name="secondaryLightColor">#6effe8</color>
    <color name="secondaryDarkColor">#00b686</color>

    <color name="primaryTextColor">@color/white</color>
    <color name="secondaryTextColor">#000000</color>


    <color name="lightGray">#F9F9F9</color>
    <color name="mediumGray">#D1D1D1</color>
    <color name="lightMediumGray">#80D1D1D1</color>
    <color name="gray">#A9000000</color>
    <color name="lighterGray">#ddd</color>
    <color name="darkGray">#4B4B4B</color>
    <color name="dark">#313C44</color>
    <color name="darker">#151B20</color>
    <color name="deepPurple">#4a148c</color>

    <color name="statusBarColor">@color/primaryDarkColor</color>
    <color name="contextualStatusBarColor">@color/darker</color>
    <color name="contextualActionBarColor">@color/dark</color>
    <color name="actionBarBackgroundColor">@color/primaryColor</color>
    <color name="buttonColor">@color/primaryColor</color>


    // Custom CardView Style
    <color name="strokeColor">@color/lightMediumGray</color>
    <color name="cardBackgroundColor">@color/white</color>
    <color name="cardBackgroundLightColor">#106200EA</color>
    <color name="titleColor">@color/darker</color>
    <color name="descriptionColor">@color/darkGray</color>
    <color name="backgroundColor">@color/lightGray</color>
    <color name="placeholderColor">@color/mediumGray</color>
    <color name="color_navigation_list_background">@color/white</color>

    <color name="favoritesIconColor">#F05D6E</color>
</resources>

цветная ночная версия

      <?xml version="1.0" encoding="utf-8"?>
<resources xmlns:tools="http://schemas.android.com/tools">

    <color name="primaryColor" tools:ignore="MissingDefaultResource">@color/darker</color>
    <color name="primaryLightColor" tools:ignore="MissingDefaultResource">@color/darkGray</color>
    <color name="primaryDarkColor" tools:ignore="MissingDefaultResource">@color/black</color>

    <color name="secondaryColor" tools:ignore="MissingDefaultResource">#4db6ac</color>
    <color name="secondaryLightColor" tools:ignore="MissingDefaultResource">#82e9de</color>
    <color name="secondaryDarkColor" tools:ignore="MissingDefaultResource">#00867d</color>

    <color name="primaryTextColor" tools:ignore="MissingDefaultResource">#ffffff</color>
    <color name="secondaryTextColor" tools:ignore="MissingDefaultResource">#000000</color>

    <color name="statusBarColor">@color/primaryDarkColor</color>
    <color name="actionBarBackgroundColor">@color/primaryColor</color>
    <color name="buttonColor">@color/deepPurple</color>


    // Custom CardView Style
    <color name="strokeColor">@color/mediumGray</color>
    <color name="cardBackgroundColor">@color/darker</color>
    <color name="cardBackgroundLightColor">#106200EA</color>
    <color name="titleColor">@color/mediumGray</color>
    <color name="descriptionColor">@color/mediumGray</color>
    <color name="backgroundColor">@color/dark</color>
    <color name="placeholderColor">@color/darker</color>
    <color name="color_navigation_list_background">@color/darker</color>
    <color name="favoritesIconColor">#F05D6E</color>


</resources>

свет темы

      <resources>
    <!-- Base application theme. -->
    <style name="Theme.MyApp" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
        <!-- Primary brand color. -->
        <item name="colorPrimary">@color/primaryColor</item>
        <item name="colorPrimaryVariant">@color/primaryDarkColor</item>
        <item name="colorOnPrimary">@color/primaryTextColor</item>
        <!-- Secondary brand color. -->
        <item name="colorSecondary">@color/secondaryColor</item>
        <item name="colorSecondaryVariant">@color/secondaryDarkColor</item>
        <item name="colorOnSecondary">@color/secondaryTextColor</item>

        <!-- Status bar color. -->
        <item name="android:statusBarColor">@color/statusBarColor</item>
        <!-- Customize your theme here. -->
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        <item name="windowActionModeOverlay">true</item>
        <item name="actionModeBackground">@color/contextualActionBarColor</item>

        <item name="android:windowAnimationStyle">@style/WindowAnimationTransition</item>


    </style>

    <style name="WindowAnimationTransition">
        <item name="android:windowEnterAnimation">@android:anim/fade_in</item>
        <item name="android:windowExitAnimation">@android:anim/fade_out</item>
    </style>


    <style name="EmptyViewStyle">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">match_parent</item>
        <item name="android:gravity">center</item>
        <item name="android:textSize">@dimen/_18ssp</item>
        <item name="android:visibility">gone</item>
    </style>

    <style name="CustomActionBarStyle" parent="Widget.MaterialComponents.ActionBar.Primary">
        <item name="background">@color/primaryColor</item>
        <item name="android:textColorPrimary">@color/white</item>
        <item name="android:textColorSecondary">@color/white</item>

    </style>

    <style name="ThemeOverlay.AppCompat.navTheme">
        <!-- Color of text and icon when SELECTED -->
        <item name="colorPrimary">@color/primaryColor</item>

        <item name="background">@color/white</item>

        <!-- Background color when SELECTED -->
        <item name="colorControlHighlight">@color/mediumGray</item>

    </style>

    <style name="progressBarBlue" parent="@style/Theme.AppCompat">
        <item name="colorAccent">@color/secondaryColor</item>
    </style>

    <style name="Divider">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">1dp</item>
        <item name="android:background">?android:attr/listDivider</item>
    </style>


    <style name="PostTitle">
        <item name="android:textSize">18sp</item>
        <item name="android:textColor">@color/titleColor</item>
        <item name="android:textStyle">bold</item>
    </style>

    <style name="PostBody">
        <item name="android:textSize">15sp</item>
        <!--        <item name="android:textColor">@color/descriptionColor</item>-->
    </style>

    <style name="roundedImageViewRounded">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSize">50%</item>
    </style>


</resources>

тематическая ночь

      <resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.MyApp" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
        <!-- Primary brand color. -->
        <item name="colorPrimary">@color/primaryColor</item>
        <item name="colorPrimaryVariant">@color/primaryDarkColor</item>
        <item name="colorOnPrimary">@color/primaryTextColor</item>
        <!-- Secondary brand color. -->
        <item name="colorSecondary">@color/secondaryColor</item>
        <item name="colorSecondaryVariant">@color/secondaryDarkColor</item>
        <item name="colorOnSecondary">@color/secondaryTextColor</item>
        <!-- Status bar color. -->
        <item name="android:statusBarColor" tools:targetApi="l">@color/statusBarColor</item>
        <!-- Customize your theme here. -->
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        <item name="windowActionModeOverlay">true</item>
        <item name="actionModeBackground">@color/contextualActionBarColor</item>

        <item name="android:windowAnimationStyle">@style/WindowAnimationTransition</item>

    </style>

    `
    <style name="CustomActionBarStyle" parent="Widget.MaterialComponents.ActionBar.Primary">
        <item name="background">@color/actionBarBackgroundColor</item>

        <item name="android:textColorPrimary">@color/white</item>

        <item name="android:textColorSecondary">@color/white</item>
    </style>

    <style name="ThemeOverlay.AppCompat.navTheme">

        <!-- Color of text and icon when SELECTED -->
        <item name="colorPrimary">@color/white</item>

        <!-- Background color when SELECTED -->
        <item name="colorControlHighlight">@color/mediumGray</item>

    </style>

    <style name="progressBarBlue" parent="@style/Theme.AppCompat">
        <item name="colorAccent">@color/secondaryColor</item>
    </style>

    <style name="Divider">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">1dp</item>
        <item name="android:background">?android:attr/listDivider</item>
    </style>


    <style name="PostTitle">
        <item name="android:textSize">18sp</item>
        <item name="android:textColor">@color/titleColor</item>
        <item name="android:textStyle">bold</item>
    </style>

    <style name="PostBody">
        <item name="android:textSize">15sp</item>
        <item name="android:textColor">@color/descriptionColor</item>
    </style>


</resources>

Изменения, которые я сделал, изменили родителя в каждом элементе наparent="Theme.Material3.Light">и parent="Theme.Material3.Dark">но я вижу, что новая тема не использует мои старые цвета, например, выбранный элемент в ящике, элемент был черным, а фон отмеченного состояния зеленый, теперь он фиолетовый, а панели инструментов были основным зеленым цветом, теперь он белый с опцией фон меню светло-зеленый

пример замены ящика

1

android android-layout navigation-drawer material-components-android material3

Источник

Sundus el Siddiqui 26 сен '22 в 19:44

1 ответ

Другие вопросы по тегам android android-layout navigation-drawer material-components-android material3

user14734532 29 сен '22 в 10:14 2022-09-29 10:14 · Answer 1 · 2022-09-29 10:14

Это потому, что когда вы использовали Материал 2, ваш навигационный ящик имеет цвет индикатора активного элемента, установленный какcolorPrimaryно когда вы изменили его на Материал 3, теперь он используетcolorSecondaryContainerдля активного индикатора.

Материал 2: Навигационный ящик | Атрибуты наложения текста

Материал 3: Навигационный ящик | Атрибуты элемента

Вы можете прочитать документы для получения информации о цвете и изменить его в соответствии со своими предпочтениями.