how to set materialButton icon to the center - android

I am using supportLibrary = "28.0.0-beta01" version.
Here is my code in .xml file:
<android.support.design.button.MaterialButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:icon="#drawable/ic_my_orders"
app:iconGravity="textStart"
android:gravity="center"/>
To my code icon of the drawable locating left side of the button. I want to set button to the center.
I want to achieve this result
Edit
I don't need to any custom views or hard coded things. If this is a bug (app:iconGravity), I will wait next release.
EDIT
The bug fixed in the version 28.0.0-rc01,just change the version.

The code snippet you have in your original question is correct. This has been identified as a bug and will be fixed in the upcoming release.

With the Material Components library just use the app:iconGravity="textStart" attribute:
<com.google.android.material.button.MaterialButton
style="#style/Widget.MaterialComponents.Button.Icon"
app:icon="#drawable/..."
app:iconGravity="textStart"
../>
If you want to cut the corners use the app:shapeAppearanceOverlay attribute:
<com.google.android.material.button.MaterialButton
style="#style/Widget.MaterialComponents.Button.Icon"
app:icon="#drawable/..."
app:iconGravity="textStart"
app:shapeAppearanceOverlay="#style/Button.Cut"
../>
with:
<style name="Button.Cut" parent="">
<item name="cornerFamily">cut</item>
<item name="cornerSize">4dp</item>
</style>

You can use width to wrap_content so it matches your text. And layout_gravity instead of gravity to set the button its own gravity (and not its childs).
<android.support.design.button.MaterialButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:icon="#drawable/ic_my_orders"
app:iconGravity="textStart"
android:layout_gravity="center"/>

UPDATED
Try this code to set left padding of button to make it center.
<android.support.design.button.MaterialButton
android:id="#+id/material_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:gravity="center_vertical|start"
android:text="CENTER"
android:textColor="#android:color/white"
app:icon="#drawable/ic_location_on_accent_24dp"
app:layout_constraintBottom_toBottomOf="parent" />
JAVA
final MaterialButton button = root_view.findViewById(R.id.material_button);
button.post(new Runnable() {
#Override
public void run() {
int width = button.getWidth();
button.measure(0,0);
int paddingleft = (width - button.getMeasuredWidth() + 50)/2; //50 drawable width
button.setPadding(paddingleft,0,0,0);
}
});
OUTPUT

Related

How to center align text in Extended Floating Action Button?

I want to center align the text in the extended floating action button but I'm not able to do that. As you can see in the image below the text is not centrally aligned.
Here's is the code for extended floating action button:
<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
android:id="#+id/compress_start_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:text="S"
app:backgroundTint="?android:colorAccent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:textColor="#color/textColorPrimaryDark"
app:layout_constraintStart_toStartOf="parent"
android:textAlignment="center"
/>
Am I doing anything wrong? Any help will be appreciated.
Please add these two lines in your ExtendedFloatingActionButton
android:paddingStart="0dp"
android:paddingEnd="0dp
use like this
<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
android:layout_width="48dp"
android:layout_height="48dp"
android:gravity="center"
android:paddingStart="0dp"
android:paddingEnd="0dp"
android:text="#string/ic_lin_camera" />
When using an ExtendedFloatingActionButton for text only, in your layout xml for the fab you can use
style="#style/Widget.MaterialComponents.ExtendedFloatingActionButton"
or extend the above style via
<style name="extended_fab_text_only" parent="Widget.MaterialComponents.ExtendedFloatingActionButton">
<item name="android:textAppearance">#style/myTextAppearance</item>
</style>
and you that as the style of your fab in your layout xml
style="#style/extended_fab_text_only"
Documentation: https://material.io/components/buttons-floating-action-button/android#extended-fabs
Under Extended FABs > Styles:
Text-only when extended
style Widget.MaterialComponents.ExtendedFloatingActionButton

Change color of "hint"

How can i change the color of "hint" in my code?
Because with a dark background, i can't see the text and the place where i need to write...
Thank you so much for your help !
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="Veuillez taper son prénom ici"
android:textSize="15dp"
android:layout_gravity="center" />
in a <LinearLayout> android:background="#color/colorBlack"/>
In your XML code you can add android:textColorHint :
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="Veuillez taper son prénom ici"
android:textSize="15dp"
android:textColorHint="#ff0000"
android:layout_gravity="center" />
OR you can change the hint color programmatically :
edittext.setHintTextColor(Color.RED);
Add id to EditText to identify tag.
.xml file
<EditText
android:id="#+id/ET_hint"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="Veuillez taper son prénom ici"
android:textSize="15dp"
android:layout_gravity="center" />
.java file
EditText et_hint = findViewById(R.id.ET_hint);
et_hint.setHintTextColor(getResources().getColor(R.color.white));
Use android:textColorHint="#ff0000" in your xml or edittext.setHintTextColor(Color.BLUE); to set hint color in your Java program grammatically.
if you are using the Material design library. Currently, I am using the version
implementation 'com.google.android.material:material:1.3.0-alpha01'
if you are using the Material design library. Currently, I am using the version
implementation 'com.google.android.material:material:1.3.0-alpha01'
1 - Set color when TextInputLayout is resting.
<item name="android:textColorHint">#color/your_color_hint</item>
2 - Set color when TextInputLayout is floating/focused/tapped.
<item name="hintTextColor">#color/your_color_floating_hint</item>
3 - Set color of the line under TextInputLayout.
<item name="boxStrokeColor">#color/TextViewColor_line</item>
4 - Set color of the error under TextInputLayout.
<item name="boxStrokeErrorColor">#color/colorPrimary</item>

Why does MaterialButton text not containing full space?

See:
Code:
<RelativeLayout
android:id="#+id/circle_card_payment"
android:layout_width="40dp"
android:layout_height="40dp">
<com.google.android.material.button.MaterialButton
android:id="#+id/logo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:backgroundTint="#color/colorBlack"
android:insetLeft="0dp"
android:insetTop="0dp"
android:insetRight="0dp"
android:insetBottom="0dp"
android:text="W"
android:textColor="#FFFFFF"
android:textSize="16sp"
app:shapeAppearanceOverlay="#style/ShapeAppearanceOverlay_ButtonCircle50"
app:strokeWidth="0dp" />
</RelativeLayout>
style.xml
<style name="ShapeAppearanceOverlay_ButtonCircle50">
<item name="cornerFamily">rounded</item>
<item name="cornerSize">20dp</item>
</style>
For confirmation that material button is containing full space, I sat material button color to black. and inside text color is white.
Can anybody give me the exact solution according to my situation? Please note that you should not increase the relative layout size from 40 to 50 dp, I know that can solve the problem, but logo size will be bigger and that is not appropriate.
Please note, I must need to wrap this button in any root layout. That is mandatory. Like right now my material button is inside Relative layout.
Why does MaterialButton text not containing full space?
The problem is with the material button because by default material buttons have padding. you remove or override that padding by setting padding attribute in the xml itself, this should solve the problem.
just add android:padding = "0dp" to solve this. or as Ricardo.A suggest in comment set in the style <item name="android:padding">0dp</item>
<RelativeLayout
android:id="#+id/circle_card_payment"
android:layout_width="40dp"
android:layout_height="40dp">
<com.google.android.material.button.MaterialButton
android:id="#+id/logo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:backgroundTint="#323232"
android:insetLeft="0dp"
android:insetTop="0dp"
android:insetRight="0dp"
android:padding="0dp"
android:insetBottom="0dp"
android:text="W"
android:textColor="#FFFFFF"
android:textSize="16sp"
app:shapeAppearanceOverlay="#style/ShapeAppearanceOverlay_ButtonCircle50"
app:strokeWidth="0dp" />
</RelativeLayout>
Result with default padding.
and Result with overriding padding to 0dp
Hope this helps, Happy Coding!!

AndroidX Setting Background Color on Button has NO Effect

I usually set the background color on a button simply in XML using android:background or programatically using setBackgroundColor but now with the AndroidX library (i assume...), these has no effect on the button color
it seems that setting android:backgroundTint is working but this works only for APIs 21 and above
how can i achieve this ?
example:
Shouldnt this produce a layout with a red backgrounded button...
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button android:layout_width="wrap_content" android:layout_height="wrap_content"
android:background="#af2222"/>
</LinearLayout>
I use this in android x instead of <Button and background color will changes
<androidx.appcompat.widget.AppCompatButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:background="#color/colorAccent"
android:text="Done"
/>
You need to add style to your button tag as if you are using Androidx with material design.
style="#style/Widget.MaterialComponents.Button"
This style will let you set primaryColor as background color.
So your whole code will look like:
<android.support.design.button.MaterialButton
style="#style/Widget.MaterialComponents.Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Messages"
android:minWidth="200dp"
app:cornerRadius=”16dp”
app:icon="#drawable/ic_action_setting"
app:cornerRadius="#dimen/_16sdp"
app:backgroundTint="#color/colorAccent"
app:iconTint="#color/light_pitch"
app:iconPadding="-12dp"
/>
Cheers!
You can try using: app:backgroundTint="#af2222" and remove android:background="#af2222" it should support <21 also
As svkaka's answer mentioned, i used app:backgroundTint="#af2222" in xml to solve the issue.
Programatically, i used this:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) statusButton.backgroundTintList = ColorStateList.valueOf(MY_COLOR)
else statusButton.setBackgroundColor(MY_COLOR)
Also to note, this is required on Both material and support design button since the android:background="#fff" on both now seems to have no effect

How do I change the text color of a Button?

How do I change the text color of a Button?
try this:
button.setTextColor(getApplication().getResources().getColor(R.color.red)); //TAKE DEFAULT COLOR
or
button.setTextColor(0xff0000); //SET CUSTOM COLOR
or
button.setTextColor(Color.parseColor("#ff0000"));
and in xml :
<Button android:id="#+id/mybtn"
android:text="text textx "
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textStyle="bold"
android:textColor="#ff0000" /> <-- SET TEXT COLOR HERE -->
Use the android:textColor property.
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World"
android:textColor="#android:color/white" />
button.setTextColor(ContextCompat.getColor(getApplicationContext(), R.color.red));
this work too
Use: android:textColor="#FFFFFF" on the xml configuration,
or on the activity itself by calling
button.setTextColor(0xFFFFFF);
(FFFFFF is the color white).
For more color codes: here
You can use the android textColor for foreground and for background color of button, text view or any other element see code example
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:background="#ffb6c1"
android:textColor="#fff"
/>
any hexadecimal color code can be written for making interactive view.
change button text color programmatically
button.setTextColor(getResources().getColor(R.color.colorWhite));
An easy way to do this is by defining the color you want in res/values/colors.xml in this way:
<color name="colorCyan">#00BCD4</color>
and the button should look this way:
<Button
android:id="#+id/m_button"
android:text="MY BUTTON"
android:textColor="#color/colorAccent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorCyan"/>
Here's an approach with slightly less code that uses the implied Context of the current Activity.
button.setTextColor(getColor(R.color.colorPrimary));
I have not tested this with all API targets, but it is working for 28.
You can use:
button.setTextColor("green");
or
button.setTextColor(colorcode);
The format is AARRGGBB, so FF0000 is a transparent red. Use FFFF0000 instead.

Categories

Resources