Develop Reference

Android MaterialButton padding between drawableLeft icon and text

As the topic said, with materialButton, I want to set up the distance between drawableLeft icon and text, I do not want to use icon, just drawableLeft
By default, the drawableleft icon is far away from text, I want to make them closer, but I cannot use icon and icon gravity. If I use icon and icon gravity, it will not show because of the style I use, but if I change the style, then there will be another problem: there will be shadow below the button. I do not want the shadow, so I have to use the style.
What I want is a MaterialButton, grey background, left icon, centre is text, icon and text is closed, MaterialButton is round corner, no shadow below the MaterialButton. Here is the code so far:
<?xml version="1.0" encoding="utf-8"?>
<com.google.android.material.button.MaterialButton
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/btnShortCut"
style="#style/Button"
android:layout_width="wrap_content"
android:layout_height="36dp"
android:orientation="vertical"
android:layout_marginRight="10dp"
app:backgroundTint="#color/background"
app:cornerRadius="#dimen/cornerM"
app:strokeColor="#color/primaryGrey"
app:strokeWidth="0.5dp"
android:padding="5dp"
android:textColor="#color/secondaryText"
android:textSize="#dimen/fontBody" >
</com.google.android.material.button.MaterialButton>
<style name="Button" parent="Widget.MaterialComponents.Button.UnelevatedButton">
<item name="android:textAllCaps">false</item>
<item name="android:insetTop">0dp</item>
<item name="android:insetBottom">0dp</item>
<item name="android:gravity">center</item>
<item name="android:padding">0dp</item>
</style>

Is it necessary for you to use a material button? Have you considered using a FrameLayout with a textview overlapped on it?
In your example it would look something like this, but with some edits since I'm not sure exactly how you want it to look.
<FrameLayout
android:id="#+id/btnShortCut"
android:layout_width="wrap_content"
android:layout_height="36dp"
android:layout_marginRight="10dp"
android:orientation="vertical"
android:gravity="center"
app:cornerRadius="#dimen/cornerM"
app:strokeColor="#color/primaryGrey"
app:strokeWidth="0.5dp"
android:padding="5dp">
<TextView
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="15dp"
android:layout_marginEnd="15dp"
android:drawableStart="#drawable/<your icon here>"
android:drawablePadding="15dp"
android:textColor="#color/secondaryText"
android:textSize="#dimen/fontBody"/>
</FrameLayout>

RadioButton is leaving black checked circle after unchecking

My RadioButtons in my RadioGroup are leaving a black checked circle after I uncheck them or click on another RadioButton in the group. How do I prevent this from happening?
<RadioGroup
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RadioButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Test"
android:textAlignment="textStart"
android:layoutDirection="rtl"
android:layout_gravity="start"
android:background="?android:selectableItemBackground"/>
<RadioButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAlignment="textStart"
android:layoutDirection="rtl"
android:layout_gravity="start"
android:background="?android:selectableItemBackground"/>
</RadioGroup>
Happens on my API 19 real device, not my API 27
Edit:_________________________________________________
Have tried using a custom selector which doesn't work
<RadioGroup
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/qrmenu_toolbar"
android:orientation="vertical">
<RadioButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Resume"
android:layoutDirection="rtl"
android:layout_gravity="start"
android:drawablePadding="12dp"
android:paddingStart="16dp"
android:paddingTop="12dp"
android:paddingEnd="16dp"
android:paddingBottom="12dp"
app:drawableLeftCompat="#drawable/ic_resume"
android:button="#drawable/radiobutton_selector"
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/radio_checked" android:state_checked="true" />
<item android:drawable="#drawable/radio_unchecked" android:state_checked="false" />
</selector>
Theme:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorBlack</item>
<item name="colorPrimaryDark">#color/colorBlack</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
Bump still can't find a solution
Edit:______________________________________
Have also tried using custom radio buttons.. still doesn't work:
<RadioButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:button="#drawable/custom_radio_button"/>
Custom RadioButton:
<?xml version="1.0" encoding="utf-8" ?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:drawable="#drawable/ic_radio_button_checked"/>
<item android:state_checked="false" android:drawable="#drawable/ic_radiobutton_unchecked"/>
</selector>

Remove the background from the radio button
android:background="?android:selectableItemBackground"
and use
android:button="#drawable/radiobutton_selector"
Here is an example of a custom radio button in Android. please look into this.
Maybe this help for you.
http://www.apnatutorials.com/android/android-radiobutton-customization-and-usage.php?categoryId=2&subCategoryId=62&myPath=android/android-radiobutton-customization-and-usage.php

Use MaterialRadioButton from support library(com.google.android.material). The problem may occur because of different implementation of RadioButton depending on API version in conjunction with themes and selectors. Usage of MaterialRadioButton will unify behaviour across the API versions.
Here is a small give for this component.
'com.google.android.material:material:1.0.0' dependency should be imported to the project and one of Material themes used for the app.
Hope it will help.

You have to use buttonTint for this.
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/radioButton"
android:buttonTint="#color/your_color"/>
Your radioButton should be like this. However this does not work before api 21
There is a solution here for before API 21 devices
Change Circle color of radio button

android - Change color of floating label in TextInputLayout

I try to use the TextInputLayout, I success changing the color of the floating label by following this post, using android:theme="#style/TextLabel" makes floating label color change. However, it only works for Android version 5.0 and above.
For lower version of Android, I use app:hintTextAppearance="#style/TextAppearance.AppCompat". Here is my code:
<style name="EditTextHint" parent="TextAppearance.AppCompat">
<item name="android:textColor">#bbbbc9</item>
<item name="android:textColorHint">#bbbbc9</item>
<item name="android:textSize">11.5sp</item>
</style>
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:hintTextAppearance="#style/EditTextHint">
<EditText
android:id="#+id/fet_input_left"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:paddingTop="7.5dp"
android:textColor="#595968"
android:textSize="14sp" />
</android.support.design.widget.TextInputLayout>
The problem is that the color of floating label only change to #bbbbc9 when user tab on the EditText. If user tab on the other EditText, the color is changed to default. Here is the picture:
Correct Color: bbbbc9
Error Colorlt: default color
If you have any suggestions, please let me know. Any ideas would be appreciated.
Thank you in advance!

After doing "on the fly", I try to add android:textColorHint="#bbbbc9" in TextInputLayout and it works. Here is the full code:
<style name="EditTextHint" parent="TextAppearance.AppCompat">
<item name="android:textColor">#bbbbc9</item>
<item name="android:textColorHint">#bbbbc9</item>
<item name="android:textSize">11.5sp</item>
</style>
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColotHint="#bbbbc9"
app:hintTextAppearance="#style/EditTextHint">
<EditText
android:id="#+id/fet_input_left"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:paddingTop="7.5dp"
android:textColor="#595968"
android:textSize="14sp" />
</android.support.design.widget.TextInputLayout>

Do you have open two style.xml? one is style.xml while another is style-21.xml ?
in style-21.xml, it is used for android-21 / android 5.0 or above
original one is for lower support

This worked for me;
Make a custom style as;
<style name="TextFloatLabelAppearance" parent="TextAppearance.Design.Hint">
<!-- Floating label appearance here -->
<item name="android:textColor">#color/colorLightGrey</item>
</style>
And use ;
<android.support.design.widget.TextInputLayout
android:id="#+id/store_til"
app:hintTextAppearance="#style/TextFloatLabelAppearance"
android:textColorHint="#color/colorWhite"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<AutoCompleteTextView
android:id="#+id/editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#color/colorWhite"
android:hint="#string/your_string">
</AutoCompleteTextView>
This is what I did to change the floating text to a custom color.

Using <include> in android.support.v7.widget.GridLayout not displaying correctly

I'm trying to use <include> to include ImageButtons inside a android.support.v7.widget.GridLayout. The problem is, if I don't specify all the attributes explicitly on my <include> elements, they don't display properly. In other words, the include is pointless since I have to redeclare all the attributes on every <include> element.
dialpad_button.xml
<?xml version="1.0" encoding="utf-8"?>
<ImageButton
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:grid="http://schemas.android.com/apk/res-auto"
android:layout_width="0dp"
android:layout_height="0dp"
grid:layout_columnWeight="1"
grid:layout_rowWeight="1"
grid:layout_gravity="fill"
android:layout_margin="5dp"
android:scaleType="centerInside"/>
dialpad_view.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:grid="http://schemas.android.com/apk/res-auto"
android:id="#+id/dialpad_grid_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
grid:alignmentMode="alignBounds"
grid:columnCount="2"
grid:rowCount="1">
<include
android:id="#+id/dialpad_view_btn1"
android:src="#drawable/dialpad_1"
layout="#layout/dialpad_button" />
<include
android:id="#+id/dialpad_view_btn2"
android:src="#drawable/dialpad_2"
layout="#layout/dialpad_button" />
</android.support.v7.widget.GridLayout>
If I declare all the attributes directly on the <include>s, here's what it looks like in XML:
<include
layout="#layout/dialpad_button"
android:id="#+id/dialpad_view_btn1"
android:src="#drawable/dialpad_1"
android:layout_width="0dp"
android:layout_height="0dp"
grid:layout_columnWeight="1"
grid:layout_rowWeight="1"
grid:layout_gravity="fill"
android:layout_margin="5dp"
android:scaleType="centerInside" />
As you can see in the comparison image below, the buttons now scale properly but the images are nowhere to be seen.
And if I change the <include>s to ImageButton, things work as expected.
<ImageButton
android:id="#+id/dialpad_view_btn1"
android:src="#drawable/dialpad_1"
android:layout_width="0dp"
android:layout_height="0dp"
grid:layout_columnWeight="1"
grid:layout_rowWeight="1"
grid:layout_gravity="fill"
android:layout_margin="5dp"
android:scaleType="centerInside" />
Is there a workaround to this?
Since I'm going to have 12 near-identical buttons in my dialpad, I'd really like to clean the XML up by including a "template" and only modifying the necessary attributes for each button (i.e. src and id).
EDIT
Trying to use styles, as suggested in one answer, did not work. None of the views that I applied the styles to get displayed. What's even more strange, even if I just apply the style to one of the views in the GridLayout, only the last view gets displayed (I've shortened down the sample code here to only two views for readability, in reality I have twelve).
Here's the style I tried using:
<?xml version="1.0" encoding="utf-8"?>
<resources
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:grid="http://schemas.android.com/apk/res-auto" >
<style name="dialPadButtonStyle">
<item name="android:layout_width">0dp</item>
<item name="android:layout_height">0dp</item>
<item name="grid:layout_columnWeight">1</item>
<item name="grid:layout_rowWeight">1</item>
<item name="grid:layout_gravity">fill</item>
<item name="android:layout_margin">5dp</item>
<item name="android:scaleType">centerInside</item>
<item name="android:background">#android:color/transparent</item>
</style>
</resources>

Maybe you can use a style to declare the common attributes and then set it for every button.
<style name="dialPadButtonStyle">
<item name="android:layout_width">0dp</item>
<item name="android:layout_height">0dp</item>
<item name="android:layout_columnWeight">1</item>
<item name="android:layout_rowWeight">1</item>
<item name="android:layout_margin">5dp</item>
<item name="android:src">#android:drawable/ic_menu_camera</item>
</style>
I also added: columnCount to 3 and rowCount to 4 for GridLayout and added 12 ImageButtons with that style. The final result is this:

Android Switch button color not changing in 4.0.4

I have used Switch button, everything works fine when the app run it on 4.2 and above, but the text color not at all changed to white in 4.0.4 i have tried all possible solution
My Switch :
<Switch
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_below="#+id/facilityassetdescription"
android:layout_centerHorizontal="true"
android:layout_marginTop="7dp"
android:background="#drawable/offbuttonbg"
android:textColor="#style/toggle_text"
android:textOff="OFF"
android:textOn="ON"
android:thumb="#drawable/switchselector" />
My style file
<style name="toggle_text">
<item name="android:textColor">#color/toggle</item>
</style>
res/color/toggle_text.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="#ffffff"/>
<!-- Default State -->
<item android:color="#ffffff"/>
</selector>
Kindly give any idea to get rid of this problem

You can use Switch-Compat intend of Switch using support v7
library.Try new concept
my.xml
<android.support.v7.widget.SwitchCompat
android:id="#+id/sc_push"
style="#style/switchStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:theme="#style/switchStyle"
app:theme="#style/switchStyle" />
style.xml
<style name="switchStyle">
<item name="colorControlActivated">#color/red</item>
<item name="android:colorForeground">#color/gray</item>
</style>
Best of luck

Use below style:
<style name="toggle_text" parent="#android:style/TextAppearance.Small">
<item name="android:textColor">#color/toggle</item>
</style>
And, In xml file for switch mention android:switchTextAppearance attribute instead of using android:textColor:
<Switch
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_below="#+id/facilityassetdescription"
android:layout_centerHorizontal="true"
android:layout_marginTop="7dp"
android:background="#drawable/offbuttonbg"
android:switchTextAppearance="#style/toggle_text"
android:textOff="OFF"
android:textOn="ON"
android:thumb="#drawable/switchselector" />

Use support 7 SwitchCompat
and put <item name="colorSwitchThumbNormal">#E21D1D</item> in your style
and <item name="colorSwitchThumbNormal">#E21D1D</item> in your theme
<android.support.v7.widget.SwitchCompat
android:id="#+id/switch_options"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:padding="5dp"
app:showText="false" >
</android.support.v7.widget.SwitchCompat>
Gud Luck!!

for anyone if the above answers did not work try this..
<androidx.appcompat.widget.SwitchCompat
android:id="#+id/switch_is_in_stock"
style="#style/proximaNovaNormalColorBlack.size14"
android:layout_width="0dp"
android:layout_height="0dp"
android:maxLines="1"
android:padding="4dp"
android:textColor="#color/switch_thumb_selector"/>
answer is on this xml line -> android:textColor="#color/switch_thumb_selector"