Develop Reference

Android material button set icon and background color not working?

I'm trying to create a facebook login button,
something like this.
I have trouble setting the icon of the material button and also changing the button's background color at the same time.
I am using a custom style in order to change the button's background color. I have also tried directly adding the backgroundTint property to my button but it is getting overriden by the theme's primaryColor.
But then the when I set the icon property of the button the icon won't show.
This is my button
<com.google.android.material.button.MaterialButton
android:id="#+id/fb_login_button"
style="#style/orangeButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/side_margin"
android:layout_marginTop="60dp"
android:layout_marginEnd="#dimen/side_margin"
android:layout_marginBottom="20dp"
android:text="#string/continue_with_facebook"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#id/login_link"
app:icon="#drawable/fb_icon"
app:iconTint="#color/white"
app:iconGravity="textStart"/>
And this is the style I'm using
<style name="orangeButtonStyle" parent="Widget.MaterialComponents.Button">
<item name="android:fontFamily">#font/semi_bold</item>
<item name="android:textColor">#color/white</item>
<item name="android:background">#drawable/orange_button_bg</item>
<item name="android:backgroundTint">#color/orange</item>
<item name="android:textSize">14sp</item>
<item name="android:textAllCaps">false</item>
<item name="android:layout_height">56dp</item>
<item name="android:layout_width">match_parent</item>
</style>
I've also tried changing my style's parent to Widget.AppCompat.Button. This will make the icon show but then the button's color doesn't change.

Better to use any one from this. If you mention both, then it will give priority to backgroundTint.
<item name="android:background">#drawable/orange_button_bg</item>
<item name="android:backgroundTint">#color/orange</item>
To provide background color to "com.google.android.material.button.MaterialButton", you should use "app:backgroundTint".
<item name="backgroundTint">#color/orange</item>
Updated code :
<com.google.android.material.button.MaterialButton
android:id="#+id/fb_login_button"
style="#style/orangeButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginTop="60dp"
android:layout_marginEnd="20dp"
android:layout_marginBottom="20dp"
android:text="continue_with_facebook"
app:icon="#drawable/fb_icon"
app:iconTint="#color/white"
app:iconGravity="textStart"/>
<style name="orangeButtonStyle" parent="Widget.AppCompat.Button">
<item name="android:textColor">#color/white</item>
<item name="android:background">#drawable/orange_button_bg</item>
<item name="backgroundTint">#null</item>
<item name="android:textSize">14sp</item>
<item name="android:textAllCaps">false</item>
<item name="android:layout_height">56dp</item>
<item name="android:layout_width">match_parent</item>
</style>
Updated : app:backgroundTint="#null" --> make this null to apply your drawable background to get applicable on MaterialButton.

Hiiii
use one of these attributes
android:drawableRight="#drawable/fb_icon"
android:drawableLeft="#drawable/fb_icon"
android:drawableEnd="#drawable/fb_icon"
android:drawableStart="#drawable/fb_icon"
instead of
app:icon="#drawable/fb_icon"

I'd do it like that
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#color/purple_200">
<LinearLayout
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_width="match_parent"
android:layout_margin="30dp"
android:orientation="vertical"
android:layout_height="wrap_content">
<com.google.android.material.card.MaterialCardView
android:id="#+id/btn_firs"
android:clickable="true"
app:cardCornerRadius="40dp"
app:cardBackgroundColor="#color/darkGreen"
android:layout_width="match_parent"
android:layout_height="60dp">
<LinearLayout
android:layout_margin="10dp"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:orientation="horizontal"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/ic_launcher_foreground"
android:layout_width="40dp"
android:layout_height="40dp"/>
<TextView
android:gravity="center"
android:textAppearance="?attr/textAppearanceHeadline6"
android:text="Continue with Facebook"
android:layout_width="wrap_content"
android:layout_height="match_parent"/>
</LinearLayout>
</com.google.android.material.card.MaterialCardView>
<com.google.android.material.card.MaterialCardView
android:layout_marginTop="7dp"
android:id="#+id/btn_second"
android:clickable="true"
app:cardCornerRadius="40dp"
android:layout_width="match_parent"
android:layout_height="60dp">
<LinearLayout
android:layout_margin="10dp"
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="match_parent">
<TextView
android:gravity="center"
android:textAppearance="?attr/textAppearanceHeadline6"
android:text="Register"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
</com.google.android.material.card.MaterialCardView>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
result

I ended up adding to my button the attribute
android:drawableLeft="#drawable/fb_icon"
and then also adding some start padding to the style so I could position the icon where I wanted to.

Button layout with 4 separate "borders": Can't get text in center

I have created a button layout with 4 separate "border" views (left, right, top, bottom) and alpha-numeric text intended to be in the center. I using the 4 separate border views so I can selectively hide (or not) each side. When used in a grid layout, I intend to enable the borders on a per button basis to create gridlines between the buttons (think tic-tac-toe lines).
But I cannot seem to center the alpha-numeric text vertically inside the button. Any help would be appreciated.
Here is the relevant xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
style="#style/dialPadButton"
android:id="#+id/pad_btn_2"
android:orientation="horizontal"
android:background="#android:color/darker_gray">
<!-- Left Border -->
<View style="#style/dialPadButtonVerticalBorderStyle"
android:id="#+id/left_border"
android:visibility="visible"
android:layout_alignParentLeft="true"
></View>
<RelativeLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Top Border -->
<View style="#style/dialPadButtonHorizontalBorderStyle"
android:id="#+id/top_border"
android:visibility="visible"
android:layout_alignParentTop="true"
></View>
<!-- Alpha-numeric text -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:orientation="vertical">
<TextView style="#style/dialPadButtonNumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAlignment="center"
android:textSize="#dimen/dial_number_text_size"
android:text="2"
android:layout_gravity="center" />
<TextView style="#style/dialPadButtonText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="#dimen/dial_letter_text_size"
android:text="abc"
android:layout_gravity="center" />
</LinearLayout>
<!-- Bottom Border -->
<View style="#style/dialPadButtonHorizontalBorderStyle"
android:id="#+id/bottom_border"
android:visibility="visible"
android:layout_alignParentBottom="true"
></View>
</RelativeLayout>
<!-- Right Border -->
<View style="#style/dialPadButtonVerticalBorderStyle"
android:id="#+id/right_border"
android:visibility="visible"
android:layout_alignParentRight="true"
></View>
</RelativeLayout>
For additional reference, here are the style definitions:
<resources>
<style name="dialPadButton">
<item name="android:layout_width">100dp</item>
<item name="android:layout_height">100dp</item>
<item name="android:fontFamily">sans-serif</item>
</style>
<style name="dialPadButtonNumber">
<item name="android:textColor">#00FF00</item>
<item name="android:maxLines">1</item>
</style>
<style name="dialPadButtonText">
<item name="android:textColor">#00FF00</item>
<item name="android:layout_marginTop">-10dp</item>
<item name="android:maxLines">1</item>
</style>
<style name="dialPadButtonHorizontalBorderStyle">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">2dp</item>
<item name="android:background">#EEEEEE</item>
</style>
<style name="dialPadButtonVerticalBorderStyle">
<item name="android:layout_height">match_parent</item>
<item name="android:layout_width">2dp</item>
<item name="android:background">#EEEEEE</item>
</style>
</resources>

you can do these
android:gravity="center"
or
android:layout_height="wrap_content"
on your LinearLayout

simply add
android:gravity="center"
to the linearlayout that holds the two textviews, the linear layout is defined match parent so you need the children to be gravity:center
like this :
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:gravity="center"
android:orientation="vertical">
<TextView style="#style/dialPadButtonNumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAlignment="center"
android:textSize="25sp"
android:text="2"
android:layout_gravity="center" />
<TextView style="#style/dialPadButtonText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25sp"
android:text="abc"
android:layout_gravity="center" />
</LinearLayout>

TextView android:ellipsize in ActionBar with two imageButtons

I have tried to get ellipsize to work on my title but as you can see in the image it set the ... before the menu button and not before the two added imagebuttons.
Activity code to set title:
// set title
TextView mTitle = (TextView)findViewById(R.id.group_post_title);
mTitle.setText(title);
Title XML:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<TextView
android:id="#+id/group_post_title"
style="#style/title"
android:text="#string/group_post" />
<ImageButton
android:id="#+id/group_post_comment_add"
android:layout_width="40dp"
android:layout_height="match_parent"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/group_post_status_view"
android:background="#drawable/title_button"
android:contentDescription="#string/add_grouppost"
android:src="#android:drawable/ic_menu_add" />
<RelativeLayout
android:id="#+id/group_post_status_view"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:orientation="horizontal" >
<ProgressBar
android:id="#+id/group_post_status"
style="?android:attr/progressBarStyleSmall"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:visibility="gone" />
<ImageButton
android:id="#+id/group_post_reload"
android:layout_width="40dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:background="#drawable/title_button"
android:contentDescription="#string/reload"
android:src="#drawable/menu_refresh" />
</RelativeLayout>
</RelativeLayout>
Style code:
<style name="title">
<item name="android:singleLine">true</item>
<item name="android:ellipsize">end</item>
<item name="android:scrollHorizontally">true</item>
<item name="android:layout_centerVertical">true</item>
<item name="android:layout_marginLeft">5dp</item>
<item name="android:textSize">16sp</item>
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
</style>
Image:
http://i.imgur.com/oOGns2L.png

I found the solution:
Add a LinearLayout around the "things" to the right. Give it an id. Use android:layout_toLeftOf on the title TextView to the id given on the LinearyLayout and wupti the title use android:ellipsize correct.

how to make headers in android with text and buttons like in iOS

i want to create header in android with text and buttons like in iOS (Text in Cetner and Buttons on right and left side), i have tried but not useful at all,please guide me ... how can i make this one for my app

Try this. Make header.xml file and put below code in it and use it in any layout file using include .
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#drawable/titlebar"
android:gravity="center">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/back_button"
android:background="#android:color/transparent"
android:layout_marginLeft="5.0dip"
android:id="#+id/imageButtonBack"
android:contentDescription="#string/ui_image_home_description"/>
<TextView
android:id="#+id/textViewTitleBar"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
style="#style/TitleBarText"
android:singleLine="false"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/home_button"
android:background="#android:color/transparent"
android:layout_marginRight="5.0dip"
android:id="#+id/imageButtonHome"
android:contentDescription="#string/ui_image_home_description"/>
</LinearLayout>
Note : Add the below style to style.xml in res/values folder.
<style name="TitleBarText">
<item name="android:layout_width">0dp</item>
<item name="android:layout_height">fill_parent</item>
<item name="android:layout_weight">1</item>
<item name="android:gravity">center_vertical</item>
<item name="android:textSize"> 17sp </item>
<item name="android:paddingLeft">12dip</item>
<item name="android:paddingRight">12dip</item>
<item name="android:textColor">#color/white</item>
<item name="android:singleLine">true</item>
<item name="android:ellipsize">end</item>
</style>

This is an easier one. You can try this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#drawable/header">
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="Back" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="Next" />
</RelativeLayout>
</RelativeLayout>

Text doesn't show up with android:textStyle="italic"

Below is the XML I am using and when I use the android:textStyle="italic" attribute, the text doesn't show up. Basically any TextView with the style SummarySubtitle will not show up.
<style name="SummarySubtitle" parent="#android:style/TextAppearance">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">fill_parent</item>
<item name="android:gravity">right|center_vertical</item>
<item name="android:layout_weight">1</item>
<item name="android:paddingRight">6dp</item>
<item name="android:textSize">12dp</item>
<item name="android:textStyle">italic</item>
</style>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="70dp"
android:orientation="vertical">
<LinearLayout android:id="#+id/summary_header"
android:layout_width="fill_parent" android:layout_height="30dp"
android:orientation="horizontal">
<TextView android:id="#+id/summary_title" android:text="Title"
style="#style/SummaryTitle"/>
<TextView android:id="#+id/summary_subtitle"
android:text="Subtitle " style="#style/SummarySubtitle"/>
</LinearLayout>
<LinearLayout android:id="#+id/summary_subheader"
android:layout_width="fill_parent" android:layout_height="20dp"
android:orientation="horizontal">
<TextView android:id="#+id/summary_min" android:text="#string/min"
style="#style/SummaryHeader"/>
<TextView android:id="#+id/summary_max" android:text="#string/max"
style="#style/SummaryHeader"/>
<TextView android:id="#+id/summary_avg" android:text="#string/avg"
style="#style/SummaryHeader"/>
</LinearLayout>
<LinearLayout android:id="#+id/summary_values"
android:layout_width="fill_parent" android:layout_height="20dp"
android:orientation="horizontal">
<TextView android:id="#+id/summary_value_min"
android:text="$0.00" style="#style/SummaryValue"/>
<TextView android:id="#+id/summary_value_max"
android:text="$0.00" style="#style/SummaryValue"/>
<TextView android:id="#+id/summary_value_avg"
android:text="$0.00" style="#style/SummaryValue"/>
</LinearLayout>
</LinearLayout>

All I found on the subject so far
http://groups.google.com/group/android-developers/browse_thread/thread/843376e298e95e14
Relevant quote: "Oh yeah, I have seen that too. But when you run your app, it renders
correctly."
It doesn't show up on the layout's graphical representation but works correctly when you build and run the app.

try using this code:
adInfoTV.setTypeface(Typeface.MONOSPACE,Typeface.ITALIC);