Leonardo Sibela
Leonardo Sibela

Reputation: 2189

Android - How to find the name I should use to override existing "?attr" styles?

I two buttons on one of my fragments:

<com.google.android.material.button.MaterialButtonToggleGroup
        android:id="@+id/hide_show_all_models_toggle_group"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginHorizontal="@dimen/size_small"
        android:layout_marginBottom="@dimen/size_medium"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:selectionRequired="true"
        app:singleSelection="true">

        <Button
            android:id="@+id/show_all_models_button"
            style="?attr/materialIconButtonOutlinedStyle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="end"
            android:paddingStart="@dimen/size_medium"
            android:paddingEnd="@dimen/size_large"
            android:text="@string/show_all"
            app:icon="@drawable/ic_show"
            app:rippleColor="#6b0000"
            tools:ignore="RtlSymmetry" />

        <Button
            android:id="@+id/hide_all_models_button"
            style="?attr/materialIconButtonOutlinedStyle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="start"
            android:paddingStart="@dimen/size_large"
            android:paddingEnd="@dimen/size_medium"
            android:text="@string/hide_all"
            app:colorSecondaryContainer="#D2070E"
            app:icon="@drawable/ic_hide"
            app:iconGravity="end"
            app:rippleColor="#6b0000"
            tools:ignore="RtlSymmetry" />

    </com.google.android.material.button.MaterialButtonToggleGroup>

However, I would like to style them, like choosing a diferente background, icon color and text color for the button that is selected.

I thought "Well... Let's try and override the materialIconButtonOutlinedStyle style!! But them, I had no idea what parent should I use on my style.

I thought it could be Widget.Material3.Button.OutlinedButton, so I tried the following:

<style name="App.Material3.Button.OutlinedButton" parent="Widget.Material3.Button.OutlinedButton">
    <item name="backgroundTint">@color/app_m3_text_button_background_color_selector</item>
</style>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="#D2070E"
        android:state_enabled="true" android:state_checked="true"/>
    <item android:color="?attr/colorContainer"/>
</selector>

But that messed with other colors on my button and the button itself. I think that App.Material3.Button.OutlinedButton actually translates to ?attr/materialButtonOutlinedStyle.

When I hold ctrl + click the ?attr/materialButtonOutlinedStyle, I got to the values.xml file from the Material library, but all I see is this:

...
    <attr format="reference" name="materialIconButtonFilledStyle"/>
    <attr format="reference" name="materialIconButtonFilledTonalStyle"/>
    <attr format="reference" name="materialIconButtonOutlinedStyle"/>
    <attr format="reference" name="materialIconButtonStyle"/>
...

That's not the frist time I intend to overried a theme that I'm using from attr, but I never know wheere I can find it's name to put on the parent atribute of my custom style tag.

Upvotes: 0

Views: 60

Answers (0)

Related Questions