Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Style defined in material button is not comprehending with the AppTheme

I chnaged the Apptheme attributes according to the new material guidelines, due to this my material button which I have used in all my project lost their theme colors.

I have tried making custom styles by making the defaults its parent and making them change their primary and secondary colors.

XML file for Button

<com.google.android.material.button.MaterialButton
    android:id="@+id/bs_create_business"
    style="@style/Widget.MaterialComponents.Button.OutlinedButton"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="left|center_vertical"
    android:text="@string/create_business"
    android:textAllCaps="true"
    app:backgroundTint="@color/browser_actions_bg_grey" />

styles.xml

    <style name="AppTheme"parent="Theme.MaterialComponents.Light.NoActionBar">
        <item name="colorPrimary">@color/foopprimary_500</item>
        <item name="colorPrimaryDark">@color/foopprimary_900</item>
        <item name="colorAccent">@color/foopsecondary_500</item>
        <itemname="android:windowBackground">@android:color/white</item>
        <item name="fontFamily">@string/default_font</item>

        <item name="colorSecondary">@color/foopsecondary_500</item>
        <item name="colorOnSecondary">@color/foopprimary_500</item>
    </style>

My output is coming like this : enter image description here

like image 993
kunal manocha Avatar asked Sep 11 '19 05:09

kunal manocha


1 Answers

To change the colors in the Widget.MaterialComponents.Button.OutlinedButton style just use something lke:

  <style name="MyButton" parent="Widget.MaterialComponents.Button.OutlinedButton" >
    <!-- Border color -->
    <item name="strokeColor">@color/stroke_color_selector</item>
    <!-- Text color -->
    <item name="android:textColor">@color/text_color_selector</item>
    <!-- Background color -->
    <item name="backgroundTint">@color/text_btn_bg_color_selector</item>
  </style>

enter image description here

The default value for the selector are:

StrokeColor:

  <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="?attr/colorPrimary" android:state_checked="true"/>
    <item android:alpha="0.12" android:color="?attr/colorOnSurface" android:state_checked="false"/>
  </selector>

TextColor:

  <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="1.00" android:color="?attr/colorPrimary" android:state_checkable="true" android:state_checked="true" android:state_enabled="true"/>
    <item android:alpha="0.60" android:color="?attr/colorOnSurface" android:state_checkable="true" android:state_checked="false" android:state_enabled="true"/>
    <item android:alpha="1.00" android:color="?attr/colorPrimary" android:state_enabled="true"/>
    <item android:alpha="0.38" android:color="?attr/colorOnSurface"/>
  </selector>

Background:

  <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="0.08" android:color="?attr/colorPrimary" android:state_checked="true"/>
    <item android:color="@android:color/transparent" android:state_checked="false"/>
  </selector>
like image 181
Gabriele Mariotti Avatar answered Nov 04 '22 17:11

Gabriele Mariotti