Develop Reference

Can't add margin to a button inside a ConstraintLayout

Why would I not be able to add margin to the end of this button?
<!--Buttons-->
<androidx.constraintlayout.widget.ConstraintLayout android:id="#+id/arqo_llButtons" android:layout_width="match_parent"
android:layout_height="98dp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent"
android:background="#color/white" >
<!--Pay Button-->
<android.widget.Button android:id="#+id/arqo_btnQuickApplyPayment" style="#style/CustomButtonStyle.Success"
android:layout_width="200dp" android:layout_height="60dp" android:layout_marginEnd="16dp"
android:enabled="false" android:text="#string/button_pay" app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<style name="CustomButtonStyle">
<item name="android:layout_height">55dp</item>
<item name="android:layout_width">332dp</item>
<item name="android:layout_margin">5dp</item>
<item name="android:textSize">18sp</item>
<item name="android:gravity">center</item>
<item name="android:paddingTop">5dp</item>
<item name="android:paddingBottom">5dp</item>
<item name="android:paddingEnd">10dp</item>
<item name="android:paddingStart">10dp</item>
<item name="android:clickable">true</item>
<item name="android:drawablePadding">5dp</item>
<item name="android:textColor">#color/border_button_text</item>
<item name="android:background">#drawable/button_border</item>
</style>
<style name="CustomButtonStyle.Success" parent="#style/CustomButtonStyle">
<item name="android:background">#drawable/button_success</item>
</style>
The button here just sits on the very right edge of the constraint layout...

If you want to customize your button with a custom style, your custom style should inherit a button's style.
Something like this :
<style name="CustomStyle" parent="Widget.MaterialComponents.Button">
<!-- Style your custom button here -->
</style>
For more info : Material Button theming
Material3 Button Theming

Removing this line from the CustomButtonStyle in Styles.xml solved the issue:
<item name="android:layout_margin">5dp</item>

TextInputLayout move the hint label and change it's background color when focused

I am trying to customize materials TextInpuLayout.OutlinedBox and TextInputEditText.
My current state is like following image
What I want to do is remove the background of the hint label so that it doesn't create that ugly cutout. Like this:
Or if that isn't possible moving the label above the input would also do the trick:
It would be nice if this was achievable using styles so that I could easily apply this to other text input elements as well.
I'm pretty new to android so please be considerate.
Here's the code for the styling:
<style name="MyTheme" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
<item name="android:textSize">14sp</item>
<item name="boxCornerRadiusTopStart">#dimen/textInputCornerRadius</item>
<item name="boxCornerRadiusTopEnd">#dimen/textInputCornerRadius</item>
<item name="boxCornerRadiusBottomStart">#dimen/textInputCornerRadius</item>
<item name="boxCornerRadiusBottomEnd">#dimen/textInputCornerRadius</item>
<item name="boxBackgroundColor">#color/primaryDarkColorBackground</item>
<item name="boxStrokeColor">#color/text_input_box_stroke</item>
</style>
<style name="EditTextStyle" parent="Widget.AppCompat.EditText">
<item name="android:background">#null</item>
<item name="android:paddingStart">30dp</item>
</style>
And here is how I define my input in the layout:
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/username_layout"
style="#style/MyTheme"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="48dp"
android:layout_marginEnd="48dp"
android:hint="#string/email_or_username"
app:boxBackgroundMode="outline"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.10">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/username"
style="#style/EditTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</com.google.android.material.textfield.TextInputLayout>

I don't think you can obtain it with the TextInputLayout.OutlinedBox style.
It is not exactly what you are looking for:
<com.google.android.material.textfield.TextInputLayout
style="#style/Widget.MaterialComponents.TextInputLayout.FilledBox.Rounded"
..>
<com.google.android.material.textfield.TextInputEditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingStart="30dp"
/>
</com.google.android.material.textfield.TextInputLayout>
With:
<style name="Widget.MaterialComponents.TextInputLayout.FilledBox.Rounded" parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
<item name="shapeAppearanceOverlay">#style/Rounded_ShapeAppearanceOverlay.MaterialComponents.TextInputLayout</item>
<item name="boxStrokeColor">#color/input_text_no_underline</item>
</style>
<style name="Rounded_ShapeAppearanceOverlay.MaterialComponents.TextInputLayout" parent="">
<item name="cornerFamily">rounded</item>
<item name="cornerSize">50%</item>
</style>
The selector is used to remove the underline:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:alpha="0" android:color="?attr/colorOnSurface" android:state_hovered="true"/>
<item android:alpha="0" android:color="?attr/colorOnSurface" android:state_enabled="false"/>
<item android:alpha="0" android:color="?attr/colorOnSurface"/>
</selector>
Note: it requires the version 1.1.0 of the library.

Try setting on the TextInputEditText:
android:background="#android:color/transparent"

Android Button Theme not applying

I created really simple view. I would like to create default layout for my button and import it via AppTheme, which i added in manifest file.
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="buttonStyle">#style/ButtonStyle</item>
<item name="android:buttonStyle">#style/ButtonStyle</item>
<item name="android:button">#style/ButtonStyle</item>
</style>
<style name="ButtonStyle" >
<item name="android:textSize">20dp</item>
<item name="android:gravity">center</item>
<item name="android:layout_width">150dp</item>
<item name="android:layout_gravity">center</item>
<item name="android:layout_marginTop">10dp</item>
<item name="android:background">#drawable/defaultbutton</item>
</style>
So what I expect is to have all buttons in my app be styled which this settings. Only way i can accomplishe it is to import style inside my button using
style="#style/ButtonStyle"
Button 'Start Test' is styled via inside import.
Funny thing is that some styles are imported for buttons 'Settings' and 'Check Sensors' ( like drawable/deefaultbutton or centered text)
<Button
style="#style/ButtonStyle"
android:id="#+id/test"
android:layout_height="50dp"
android:text="Start Test" />
<Button
android:id="#+id/settings"
android:layout_width="150dp"
android:layout_height="50dp"
android:text="Settings" />
<Button
android:id="#+id/checkSensors"
android:layout_width="150dp"
android:layout_height="50dp"
android:text="Check Sensors" />
My question is, why is this happening and i can't set it as default without importing it via 'Theme' ?
Tried this and read this but it doesn't work for me.

Custom style should extend Widget styles to use with buttonStyle attribute.
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="buttonStyle">#style/Widget.AppCompat.Button.ButtonStyle</item>
</style>
<style name="Widget.AppCompat.Button.ButtonStyle">
<item name="android:textSize">20dp</item>
<item name="android:gravity">center</item>
<item name="android:layout_width">150dp</item>
<item name="android:layout_gravity">center</item>
<item name="android:layout_marginTop">10dp</item>
<item name="android:background">#drawable/defaultbutton</item>
</style>

Android XML - Apply and use different buttonStyles

At the moment, I feel a little bit stupid.
Here's my problem :
I actually want to apply different styles for some buttons, different from my default button's style.
My styles.xml :
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
<style name="CustomTheme" parent="AppTheme">
<item name="android:actionBarStyle">#style/CustomTheme.ActionBarStyle</item>
<item name="cardViewStyle">#style/CustomTheme.CardViewStyle</item>
<item name="buttonStyle">#style/CustomTheme.StandardButton</item>
</style>
<...>
<style name="CustomTheme.StandardButton" parent="Base.Widget.AppCompat.Button.Colored">
<item name="background">#drawable/ripple_button</item>
<item name="android:tint">#color/white</item>
<item name="android:elevation">8dp</item>
</style>
<style name="CustomTheme.ConfirmButton" parent="Base.Widget.AppCompat.Button.Colored">
<item name="background">#drawable/ripple_button_confirm</item>
<item name="android:tint">#color/white</item>
<item name="android:elevation">8dp</item>
</style>
<style name="CustomTheme.CancelButton" parent="Base.Widget.AppCompat.Button.Colored">
<item name="background">#drawable/ripple_button_cancel</item>
<item name="android:tint">#color/white</item>
<item name="android:elevation">8dp</item>
</style>
</resources>
In fact, I tried a lot of things with inheritance of my CustomTheme.ConfirmButton and CustomTheme.CancelButton.
What's changing from CustomTheme.StandardButton : the shape's color.
The ripple_button.xml is orange.
Then, I created two other ripple buttons, the first one is red (CancelButton), the second one is green (ConfirmButton).
By default, the <item name="buttonStyle">#style/CustomTheme.StandardButton</item> is applied.
But, in my activity, even when I declare a specific theme to my buttons, the default style is the only one applied.
Note : the both buttons are always visible in these activity.
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/btn_confirm_reset"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/lbl_confirm"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#id/btn_cancel_reset"
android:layout_marginBottom="8dp"
style="#style/CustomTheme.ConfirmButton"/>
<Button
android:id="#+id/btn_cancel_reset"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/lbl_cancel"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toRightOf="#id/btn_confirm_reset"
android:layout_marginBottom="8dp"
style="#style/CustomTheme.CancelButton"/>
</android.support.constraint.ConstraintLayout>
I tried to apply the "default" StandardButton theme manually for each button (and then by removing the line <item name="buttonStyle">#style/CustomTheme.StandardButton</item> from my styles.xml but I still get the same behavior : all my buttons are always orange (and using StandardButton theme).
So I'm wondering where I fail / what I don't understand, or even if it's possible.
If a peaceful soul has an idea, some tips, I will be grateful (I can thank my hero with a french craft beer).
Have a great day, and thanks for reading.

Update your Button Style as below:
style.xml
<style name="CustomTheme.StandardButton" parent="Base.Widget.AppCompat.Button.Colored">
<item name="android:backgroundTint">#color/orange</item>
<item name="android:colorButtonNormal">#color/gray</item>
<item name="android:colorControlHighlight">#color/blue</item>
<item name="android:elevation">8dp</item>
</style>
<style name="CustomTheme.ConfirmButton" parent="Base.Widget.AppCompat.Button.Colored">
<item name="android:backgroundTint">#color/orange</item>
<item name="android:colorButtonNormal">#color/gray</item>
<item name="android:colorControlHighlight">#color/blue</item>
<item name="android:elevation">8dp</item>
</style>
<style name="CustomTheme.CancelButton" parent="Base.Widget.AppCompat.Button.Colored">
<item name="android:backgroundTint">#color/orange</item>
<item name="android:colorButtonNormal">#color/gray</item>
<item name="android:colorControlHighlight">#color/blue</item>
<item name="android:elevation">8dp</item>
</style>
You missed to append android: in item background.
To set Ripple effect you have to use android:colorControlHighlight because android:backgroundTint will take only color as input and drawable will not work. Here android:colorButtonNormal will give no effect because we have set backgroundTint. If you will remove backgroundTint, it will take color from android:colorButtonNormal
You have to set the theme in Button instead of style.
your_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/btn_confirm_reset"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/lbl_confirm"
android:textColor="#color/white"
android:theme="#style/CustomTheme.ConfirmButton"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#id/btn_cancel_reset"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/btn_cancel_reset"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/lbl_cancel"
android:textColor="#color/white"
android:theme="#style/CustomTheme.CancelButton"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toRightOf="#id/btn_confirm_reset"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
Hope it will work!!

create style in Android for marquee effect on all TextViews

I want the Marquee effect on EVERY textview in my app...so I thought I put it in a style:
<style name="MyTextViewStyle" parent="#android:style/Widget.TextView">
<item name="android:focusable">true</item>
<item name="android:focusableInTouchMode">true</item>
<item name="android:fontFamily">sans-serif-thin</item>
<item name="android:textSize">25sp</item>
<item name="android:ellipsize">marquee</item>
<item name="android:singleLine">true</item>
<item name="android:maxLines">1</item>
</style>
and set it in the app theme:
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<item name="android:textViewStyle">#style/MyTextViewStyle</item>
</style>
this doe not work :(
Tried it directly on the TextView:
<TextView
android:ellipsize="marquee"
android:singleLine="true"
android:focusable="true"
android:focusableInTouchMode="true"
android:maxLines="1"
android:id="#+id/text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="-5dp"
android:fontFamily="sans-serif"
android:textAllCaps="true" />
This does work...
With the following condition: the style may NOT have the 'focusable' and 'focusableInTouchMode' options.
But without these uptions in the TextView example above, it will not scroll...
so I need these attributes, but am unable to get them to work via styles...anyone have an answer?

If focusable and focusableInTouchMode not working in Style then remove from Style.xml and add in every TextView
<style name="MyTextViewStyle" parent="#android:style/Widget.TextView">
<item name="android:fontFamily">sans-serif-thin</item>
<item name="android:textSize">25sp</item>
<item name="android:ellipsize">marquee</item>
<item name="android:singleLine">true</item>
<item name="android:maxLines">1</item>
</style>
<style name="AppTheme" parent="AppBaseTheme">
<item name="android:textViewStyle">#style/MyTextViewStyle</item>
</style>
In Your layout.xml file.
<TextView
android:focusable="true"
android:focusableInTouchMode="true"
android:id="#+id/text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="-5dp"
android:textAllCaps="true" />
Note : this will work if there is only one TextView in layout..
If you have many TextView as marquee in single layout then look at this example, Android-MarqueeView.

I'm guessing that android:ellipsize is not a text style element, so it is not inherited with android:textViewStyle.
Just add your MyTextViewStyle as a style to a TextView to check my guess. If this is the problem, you have to add the android:ellipsize attribute individually or in a style.

try this :
<TextView
android:focusable="true"
android:focusableInTouchMode="true"
android:id="#+id/text_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="-5dp"
android:marqueeRepeatLimit="marquee_forever"
android:scrollHorizontally="true"
android:textAllCaps="true" />
and marquee effect will work only if text length is bigger than scree width.