AppCompat Support for RTL - android

I've been recently looking into supporting RTL text and layouts. According to this post android will natively support and switch layoutDirection automatically for API-17, which is why the Start and End gravities were added. The issue now is how to support this in a similar way for pre API-17.
This question has been asked many times before, with the general solution being to inspect the locale or text, then set gravity as needed. At least it would require less effort than a solution like this.
The reason I'm revisiting this question now is because I have noticed an update to support-v7-appcompat which now contains classes such as AppCompatTextView and LinearLayoutCompat. As far as I know, the point of these support libraries is to mimic the default behavior of later Android releases.
I created a layout to test this.
layout.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:background="#80ccffee">
<android.support.v7.widget.AppCompatTextView
android:id="#+id/textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>
When I give textview an arabic string, it is correctly detected as RTL text and automatically right-aligned on an API-17 device, where as the same does not happen on an API-10 device. It's possible that I misunderstood the purpose of AppCompatTextView, but the presence of GravityCompat.START suggests to me that its intended as a workaround.
I then wrapped the textview in a LinearLayoutCompat instead in the hopes that the layout's direction will influence it, but no luck.
So my question is: is there a mechanism in the new AppCompat update which can be used to support RTL without having to set each TextView's gravity in code?

Yes, there is!
You can achieve what you want by overriding default attributes of theme as described below:
Go to res -> values -> styles.xml
override attributes like this:
<style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
<item name="android:textDirection">rtl</item>
<item name="android:gravity">start</item>
</style>

Related

Android how to center text of chip with fixed size?

I have a chip with 100dp of width but the text is not centered how I can center the text.
I use androidx with material library, I've tried put android:textAlignment="center" and android:gravity="center" but not work
<com.google.android.material.chip.Chip
android:id="#+id/chip"
style="#style/Widget.MaterialComponents.Chip.Choice"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="7:00" />
I have this
I want this
just now I faced with the same problem, and I solved it by set a chip property: android: textAlignment = "center". I tested your example and it works fine too, here the code that I tested:
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.google.android.material.chip.Chip
android:id="#+id/chip"
style="#style/Widget.MaterialComponents.Chip.Choice"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="7:00"
android:textAlignment="center"/>
</FrameLayout>
Also make sure that you don't set or change a chip's text alignment somewhere in your code.
The short answer:
Chips aren't meant to be used the way you are trying to use them. They are supposed to wrap your content. Therefore there isn't a clean way to align the text in the center.
There is a workaround tho, you can use Chip_textEndPadding and Chip_textStartPadding attributes, which will be kinda awkward I guess.
I don't really know what you are trying to achieve, I mean, what is your why? Is it a button? Is it suppose just to show some text?
Please describe the feature, or at least, part of it.
Anyway:
According to the material design guidelines
Chips allow users to enter information, make selections, filter content, or trigger actions. Chips should appear dynamically as a group of multiple interactive elements. Unlike buttons, which should be a consistent and familiar call to action, one that a user expects to appear as the same action in the same general area.
Does your feature as anything to do with this?
In case you want a clickable, circular component you can simply use material button.
There is a similar question that was asked at github.
as others said you can use textAlignment ...but i wanted to tell you that if your using a custom font it wont be perfectly vertically aligned. you can check here for explanation.
so i would make a custom style that inherits from chip styles and set the font padding for usage like this:
<style name="customStyle" parent="#style/Widget.MaterialComponents.Chip.Choice">
<item name="chipBackgroundColor">#color/white</item>
******* <item name="android:includeFontPadding">true</item> *************
</style>
then for the text appearance you can make another style:
<style name="CustomChipTextAppearance" parent="TextAppearance.MaterialComponents.Chip">
<item name="android:fontFamily">?attr/myFont</item>
<item name="android:textAlignment">center</item>
</style>
dont forget to force a bridge theme in xml:
<com.google.android.material.chip.Chip 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"
style="#style/customStyle"
**** android:theme="#style/Theme.MaterialComponents.Bridge" ****
***** android:textAppearance="#style/CustomChipTextAppearance" *******
app:chipMinHeight="38dp"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:chipStrokeWidth="2dp"
app:rippleColor="#android:color/transparent"
tools:chipText="my chip" />
Use isTextAlignmentResolved,
For example, chipname.isTextAlignmentResolved() to do this programmatically.

How to customize AppCompatButton color

I saw new appCompat controls are available here. And implemented it in android app, but I don't find any specific way of customizing its color.
Just like if we set accent color in style, the edit text automatically catches it. But it is not working in case of AppCompatButton.
Does anybody find something regarding this?
See here: Coloring Buttons in Android with Material Design and AppCompat
To summarize, you can use the tintBackground attribute on the button itself or you can use colorControlNormal (or a combination).
Also, you can just use Button and it'll get converted to an AppCompatButton as long as you're using the theme and inheriting from AppCompatActivity correctly.
Examples from the linked URL
theme.xml:
<item name="colorButtonNormal">#color/button_color</item>
v21/theme.xml
<item name="android:colorButtonNormal">#color/button_color</item>
or
<Button
android:id="#+id/add_remove_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:backgroundTint="#color/bg_remove_btn_default"
android:textColor="#android:color/white"
tools:text="Remove" />
Use the SupportLib with AppCompatButton like this:
<android.support.v7.widget.AppCompatButton
android:id="#+id/add_remove_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:backgroundTint="#color/bg_remove_btn_default"
android:textColor="#android:color/white"
tools:text="Remove" />
app is a mxlns: xmlns:app="http://schemas.android.com/apk/res-auto"
so the backgroundTint works also for preLollipop

Style TextView like a Spinner with appcompat v21

I want to make a TextView look like a spinner with the new Material style.
I managed to do it with "Widget.Material.Light.Spinner" style, but I didn't find any alternative in AppCompat (v21) resources.
My xml:
<TextView
android:id="#+id/sp_league_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
tools:text="Premier league"
style="#android:style/Widget.Material.Light.Spinner"
android:textColor="#android:color/white" />
I'd go with:
style="#style/Widget.AppCompat.Spinner"
But feel free to pick another one:
The style solution didn't work for me, but I've found another solution:
I use AppCompatButton instead, and have this :
XML:
<android.support.v7.widget.AppCompatButton
android:background="#drawable/abc_spinner_mtrl_am_alpha"
... />
Java:
((AppCompatButton)findViewById(...)).setSupportBackgroundTintList(new ColorStateList(new int[][]{new int[0]}, new int[]{0xff52A1E8}));
EDIT: seems it won't work well anymore, but found another solution :
<style name="Widget.MyTheme.HeaderBar.Spinner" parent="Widget.AppCompat.Light.Spinner.DropDown.ActionBar">
</style>
It's true that it's for the action bar , but it should work for other cases too.
I Tested the the solutions mentioned here 1.Using style="#style/Widget.AppCompat.Spinner) and
2.Using Widget.AppCompat.Light.Spinner.DropDown.ActionBar
Both these works only on Android 5.x And Above Devices and do not work well for Android devices running on 4.x and below.
Hence, I am posting my solution for those who wanted to have a Drop-down like effect to TextView for all devices.
App needs to create a Drawable inside drawable folder in App, let's say dropdown_spinner.xml
<?xml version="1.0" encoding="utf-8"?>
<bitmap
xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/ic_icon_arrow"
android:gravity="end" />
And then simply use this as a background for the TextView as below:
<TextView
android:id="#+id/mySpinnerTextView"
android:background="#drawable/dropdown_spinner"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
In AndroidX, use style="#style/TextAppearance.AppCompat.Widget.TextView.SpinnerItem"

Can't apply themes and styles in Android

I've been searching the solution for hours: how to apply a simple theme or style to an application, an activity or just a view? It seems super easy but my styles always get ignored.
Here is the code in style.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="master" parent ="#android:style/Theme.NoTitleBar">
<item name="android:typeface">serif</item>
<item name="android:textColor">#8b8378</item>
</style>
</resources>
and here is the code in AndroidManifest.xml:
<application android:icon="#drawable/icon"
android:label="#string/app_name"
android:theme="#style/master">
and code in a ListView
<ListView android:layout_height="wrap_content"
style="#style/master"
android:id="#+id/list"
android:layout_width="fill_parent">
</ListView>
NOTHING ever happens. Font style, color all remain the default. Only by declare the attributes explicitly like
<TextView android:gravity="center" android:typeface="serif" android:textColor="#8b7d6b" android:textAppearance="?android:attr/textAppearanceSmall" android:id="#+id/text_intro" android:layout_height="wrap_content" android:text="#string/welcome_text" android:layout_width="wrap_content" android:padding="20sp" android:layout_weight="0"></TextView>
will work. I know eclipse doesn't support preview of theme and style, but they don't work on emulator as well.
Help please! I can't believe I have been stuck with this tiny issue for a week... Thank you in advance!
There are a few things about Android styles and resources at work here.
Android styles are an extremely general facility, and the result is that some configurations are possible but invalid and will be ignored. You've run across a few. :)
When applied to a view, a style will be equivalent to setting those same attributes on that view. Styles do not cascade to child views. typeface and textColor aren't valid on a ListView, so they are ignored. They also aren't going to work on a theme that way, since themes provide default styles for different kinds of views. (Why are invalid attributes silently ignored instead of generating an error? Because as new attributes are added in later platform revisions, older devices should ignore extra attributes that they don't know how to parse for compatibility.)
The best way to accomplish what you're trying to do is likely to be:
Create a style for TextViews. (This shouldn't have a parent that is a theme like your pasted code does.)
Apply that style to the TextView in your list item layout using the style= syntax.

Width of a scroll bar in android

In my application scroll bar is just too skinny to use. Does anyone know how to change the width of this?
Looking around in the platform resource files, I found this in res/values/themes.xml under the main Theme:
<item name="scrollbarSize">10dip</item>
<item name="scrollbarThumbHorizontal">#android:drawable/scrollbar_handle_horizontal</item>
<item name="scrollbarThumbVertical">#android:drawable/scrollbar_handle_vertical</item>
So, it looks like if you create your own Theme, as described in the documentation, you can provide your own drawables for the scrollbars.
I do wonder what you mean by they are "too skinny to use". They aren't meant to be touched/dragged. They are meant for display, to show you your current position relative to the entire ScrollView.
Instead of creating your own theme dedicated to your ScrollView, you can set the android:scrollbarSize attribute.
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbarSize="2dp" />

Categories

Resources