CODEWITHSUNDEEP
androidandroid-styles
toffor
toffor

Reputation: 1299

Android override predefined parent style

I use one of the predefined styles for MaterialButton.

<com.google.android.material.button.MaterialButton
        style="@style/Widget.MaterialComponents.Button.OutlinedButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Approve" />

And this is the style predefined style which i used.

 </style>
    <style name="Widget.MaterialComponents.Button.OutlinedButton" parent="Widget.MaterialComponents.Button.TextButton">
    <item name="android:paddingLeft">@dimen/mtrl_btn_padding_left</item>
    <item name="android:paddingRight">@dimen/mtrl_btn_padding_right</item>
    <item name="strokeColor">@color/mtrl_btn_stroke_color_selector</item>
    <item name="strokeWidth">@dimen/mtrl_btn_stroke_size</item>
  </style>

And this is parent style of Widget.MaterialComponents.Button.OutlinedButton

 <style name="Widget.MaterialComponents.Button.TextButton" parent="Widget.MaterialComponents.Button.UnelevatedButton">
    <item name="android:textColor">@color/mtrl_text_btn_text_color_selector</item>
    <item name="android:paddingLeft">@dimen/mtrl_btn_text_btn_padding_left</item>
    <item name="android:paddingRight">@dimen/mtrl_btn_text_btn_padding_right</item>
    <item name="iconTint">@color/mtrl_text_btn_text_color_selector</item>
    <item name="iconPadding">@dimen/mtrl_btn_text_btn_icon_padding</item>
    <item name="backgroundTint">@color/mtrl_btn_text_btn_bg_color_selector</item>
    <item name="rippleColor">@color/mtrl_btn_text_btn_ripple_color</item>
  </style>

Now i tried to override one of the attributes of Widget.MaterialComponents.Button.TextButton in my styles.xml 

 <style name="Widget.MaterialComponents.Button.TextButton">
        <item name="android:textColor">@color/colorAccent</item>
 </style>

I wonder whether this is the right approach or not to override a predefined style and will style Widget.MaterialComponents.Button.OutlinedButton use @color/colorAccent as text color. I think its working but i can not be sure is there any side effect of this approach or is there a better way ?

Upvotes: 0

Views: 1129

Answers (1)

Ashok
Ashok

Reputation: 2706

You can use one of the following:

<style name="MyCustomStyle" parent="Widget.MaterialComponents.Button.OutlinedButton">
    <item name="android:textColor">@color/colorAccent</item>
</style>

<style name="Widget.MaterialComponents.Button.OutlinedButton.MyCustomStyle">
    <item name="android:textColor">@color/colorAccent</item>
</style>

With these approach, you would inherit all the properties of your parent style and you would be declare only those properties that you like to change/override.

And use this style in your layout file as follow:

<com.google.android.material.button.MaterialButton
        style="@style/MyCustomStyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Approve" />

or 

<com.google.android.material.button.MaterialButton
        style="@style/Widget.MaterialComponents.Button.OutlinedButton.MyCustomStyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Approve" />

Upvotes: 1

Related Questions