Develop Reference

How to remove the space before the first letter in a TextView

So I have 3 vertical aligned TextViews. The second one has a larger font size.
Now, if the second TextView holds a string starting with e.g. a 'B' it looks like the View is indented:
Here's my XML layout:
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView style="#style/TextAppearance.LabelSmall"
android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView1" />
<TextView style="#style/TextAppearance.LabelBig"
android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="B TextView2" />
<TextView style="#style/TextAppearance.LabelSmall"
android:id="#+id/text3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView3" />
</LinearLayout>
And here's the corresponding styles.xml file:
<resources>
<style name="TextAppearance.LabelBig" parent="TextAppearance.MaterialComponents.Headline3">
<item name="fontFamily">#font/opensans_regular</item>
<item name="android:fontFamily">#font/opensans_regular</item>
<item name="android:textSize">48sp</item>
</style>
<style name="TextAppearance.LabelSmall" parent="TextAppearance.MaterialComponents.Body1">
<item name="fontFamily">#font/opensans_regular</item>
<item name="android:fontFamily">#font/opensans_regular</item>
<item name="android:textSize">16sp</item>
</style>
</ressources>
Is there any way to make these TextViews look equally indented?
Thanks for your help.

You don't need to use three textviews for single line text, just go for the spannable.
Find some info here: https://medium.com/androiddevelopers/spantastic-text-styling-with-spans-17b0c16b4568

How to shrink a TableLayout column to a minWidth?

If coloumn 3 has large text, column 2 disappears. Column 2 also disappears if I set android:stretchColumns="2,3". I'd like to set a minWidths to column 2. But this attribute is getting ignored.
I'm helping myself right now by setting android:stretchColumns="3" and android:shrinkColumns="3" and applying a maxWidth to the TextView on position 2. This almost does the job, but minWidth would be more the solution.
<TableLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:shrinkColumns="2,3"
android:stretchColumns="3" >
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/TextViewIdLabel"
style="#style/overlay_content"
android:text="#string/id_label"
android:textStyle="bold" />
<TextView
android:id="#+id/TextViewIdValue"
style="#style/overlay_content"
android:layout_marginLeft="4dp" />
<TextView
android:id="#+id/TextViewPersonIdLabel"
style="#style/overlay_content"
android:layout_marginLeft="8dp"
android:text="#string/person_id_label"
android:textStyle="bold" />
<TextView
android:id="#+id/TextViewPersonIdValue"
style="#style/overlay_content"
android:layout_marginLeft="4dp" />
</TableRow>
<!-- I skipped the other rows -->
</TableLayout>
This is the used style, if you wonder:
<style name="overlay_content">
<item name="android:textColor">#color/foreground_color_on_dark_background</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textSize">20sp</item>
<item name="android:ellipsize">marquee</item>
<item name="android:singleLine">true</item>
</style>
Update:
As the answers came I found out more about my requirements which I summed up in this comment: How to shrink a TableLayout column to a minWidth?

Seems like this might be the practical workaround you need, so moving my comment to answer. Maybe this can be improved though, essentially be dilligent about setting these weights to suit your app
How about setting weight per column instead of android:shrinkColumns and android:stretchColumns . So for column 1 you could set 0.2 weight, 0.3 for column 2 and 0.5 for column 3 and so on

How to shrink a TableLayout column to a minWidth?
Actually it is simple, just TextView layout_width="wrap_content" can do
that, the reason not working in your style is that 'wrap_content' should
not work together with TextView 'ellipsize', they are conflict. So you need
one seperate syle 'overlay_slide' for the column that has long text.
So use 'overlay_content' for columns those have short text, use
'overlay_slide' for columns that have long text.
Besides I suppose the 'ellipsize' in your style is not working because
seems two items missing:
<item name="android:focusable">true</item>
<item name="android:focusableInTouchMode">true</item>
finally in the column that has long text, you also need:
android:layout_weight="1"
to use all rest of space for 'ellipsize'.
Remove android:shrinkColumns="2,3" android:stretchColumns="3" from TableLayout
Solution working styles and layout:
//remove 'ecllipze' related items from 'overlay_content'
<style name="overlay_content">
<item name="android:textColor">#color/foreground_color_on_dark_background</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textSize">20sp</item>
</style>
//remove 'android:layout_width' from 'overlay_slide'
<style name="overlay_slide">
<item name="android:textColor">#color/foreground_color_on_dark_background</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textSize">20sp</item>
<item name="android:ellipsize">marquee</item>
<item name="android:focusable">true</item>
<item name="android:focusableInTouchMode">true</item>
<item name="android:singleLine">true</item>
</style>
<TableLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/TextViewIdLabel"
style="#style/overlay_content"
android:text="#string/id_label"
android:textStyle="bold" />
<TextView
android:id="#+id/TextViewIdValue"
style="#style/overlay_content"
android:layout_marginLeft="4dp"/>
<TextView
android:id="#+id/TextViewPersonIdLabel"
style="#style/overlay_content"
android:layout_marginLeft="8dp"
android:text="#string/person_id_label"
android:textStyle="bold"/>
<TextView
android:id="#+id/TextViewPersonIdValue"
style="#style/overlay_slide"
android:layout_weight="1"
android:layout_marginLeft="4dp" />
</TableRow>
</TableLayout>
Screenshot from my testing: (Portrait and Landscape)
My test long text column is text 'Column 1 ... Column 8'

You cannot change the width of a column that way. The width is only defined by the widest row in that column. If you have no display there, there will be no width. You can adjust this by adjusting the textview for that row.
<TextView
android:id="#+id/TextViewIdValue"
style="#style/overlay_content"
android:layout_marginLeft="4dp"
android:minEms="4" <!-- You can use either of these -->
android:minWidth="40dp" />
The trade-off here is that you might run out of room and your other columns will run off the end, but you can adjust your text size to correct that, even if you have to overwrite your style with android:textSize="10dp"
This code appears to be working for me, but I also changed your TableLayout width from "0dp" to "match_parent".
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:shrinkColumns="3"
android:stretchColumns="*" >
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/TextViewIdLabel"
style="#style/overlay_content"
android:text="id_label"
android:textStyle="bold" />
<TextView
android:id="#+id/TextViewIdValue"
style="#style/overlay_content"
android:layout_marginLeft="4dp"
/>
<TextView
android:id="#+id/TextViewPersonIdLabel"
style="#style/overlay_content"
android:layout_marginLeft="8dp"
android:text="person_id_label"
android:textSize="10dp"
android:textStyle="bold"
android:minEms="4"
android:minWidth="40dp" />
<!-- You can use either of these -->
<TextView
android:id="#+id/TextViewPersonIdValue"
style="#style/overlay_content"
android:layout_marginLeft="4dp" />
</TableRow>
<!-- I skipped the other rows -->

How to set transparent background during translate animation android?

I've the following problem. I've a TableLayout and two TableRows. Both TableRows contain two ImageButton. When a button is clicked I want to fade out other three buttons and translate the clicked button at the center of the screen. When it is translated the top or bottom half disappeared like it's hidden by the other table row. I've tried to set transparent background of table rows, to set alpha=0, to change layout and also I've tried to use ScaleAnimation, but the problem doesn't disappear. How can i show the disappeared half? I post also the layout code and a link to the screen with the problem.
http://it.tinypic.com/r/1zejhir/5
`
<RelativeLayout
android:id="#+id/l34"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:layout_alignParentTop="true">
<ImageButton
android:id="#+id/four"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="top|right"
android:src="#drawable/unor"
android:alpha="0"
android:onClick="translate"
android:layout_alignParentLeft="true" />
<ImageButton
android:id="#+id/three"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="top|left"
android:src="#drawable/unor"
android:alpha="0"
android:onClick="translate"
android:layout_alignParentRight="true" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/l12"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentBottom="true">
<ImageButton
android:id="#+id/one"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="top|right"
android:src="#drawable/unor"
android:alpha="0"
android:onClick="translate"
android:layout_alignParentLeft="true" />
<ImageButton
android:id="#+id/two"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="top|left"
android:src="#drawable/unor"
android:alpha="0"
android:onClick="translate"
android:layout_alignParentRight="true" />
</RelativeLayout>
</RelativeLayout>
`

The problem is that you want to use "space" from other viewgroups, your view is bound to the hosting viewgroup (eg tablerow). It doesn't have anything to do with the transparent background. The solution would be to have one viewgroup holding all your icons. For example use a RelativeLayout.

make transparent
in java code-> imagebtn.setBackgroundColor(Color.TRANSPARENT);
xml-> android:background="#android:color/transparent"

create modify the styles.xml file resource in values folder, with following code
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowBackground">#android:color/transparent</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowIsFloating">true</item>
<item name="android:backgroundDimEnabled">false</item>
in manifest.xml file add the below step to which activity make you as transparent.
android:theme="#style/Theme.Transparent"

android - views with same width placed horizontaly without filling all screen

I'm trying to create menu layout where I can place buttons in two colums with same width.
I don't want to stretch buttons to fill all screen (unless there are long lables).
I want all buttons to have same width - the width of the button with the longest label.
I'm trying two vertical linear layouts inside one horizontal linear layout.
All solutions that I found suggest to use same layout_weight for vertical linear layouts and layout_width=fill_parent for horizontal layout which is forcing buttons to occupy entire screen width.
Is there any common solution for my problem?
This is what I expect - https://dl.dropbox.com/u/2751770/android-layout1.PNG
This is how common solution looks like - https://dl.dropbox.com/u/2751770/android-layout2.PNG
And here is code which I'm using as a common solution:
<LinearLayout style="#style/menuLayout"
android:layout_width="match_parent"
android:orientation="horizontal"
android:baselineAligned="false">
<LinearLayout android:orientation="vertical"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content">
<Button style="#style/menuButton"
android:text="Title 1"/>
<Button style="#style/menuButton"
android:text="Title 2"/>
</LinearLayout>
<LinearLayout android:orientation="vertical"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content">
<Button style="#style/menuButton"
android:text="Title 3"/>
<Button style="#style/menuButton"
android:text="Long title 4"/>
</LinearLayout>
</LinearLayout>
Styles:
<style name="menuLayout">
<item name="android:layout_gravity">center</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_width">wrap_content</item>
</style>
<style name="menuButton">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">match_parent</item>
<item name="android:paddingLeft">30dp</item>
<item name="android:paddingRight">30dp</item>
<item name="android:layout_margin">5dp</item>
</style>

You are setting the width in the style "menu_layout" and also again in the second line of your code.Remove one of them. And try using android:weightSum="1" in the parent LinearLayout and then android:layout_weight="0.5" in each LinearLayout.

Android: how to make two TextViews placed in different lines if there is not enough space in one line

I'm trying to organize two TextViews to behave like that:
So, if there is enough space for both TextViews in line, android should place them in line.
If there is not enough space, the second TextView must be placed on the next line with right alignment.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/takeoffCity"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="#style/flightItem" />
<TextView
android:id="#+id/landingCity"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="#style/flightItem" />
</LinearLayout>
<style name="flightItem" parent="#android:style/TextAppearance">
<item name="android:textSize">14dip</item>
<item name="android:textColor">#color/flightItemFont</item>
<item name="android:scrollHorizontally">true</item>
<item name="android:textStyle">bold</item>
</style>

To accomplish what you are looking for you could change you're layout to a RelativeLayout and add android:layout_alignParentLeft="true" to your TextViews, however, this doesn't set these TextViews to act dynamically. Meaning if they can fit side-by-side then they should be in-line but the bottom TextView will still align to the right.
I don't think what you are looking for is technically possible. However this may be a good alternative:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/takeoffCity"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
style="#style/flightItem" />
<TextView
android:id="#+id/landingCity"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
style="#style/flightItem" />
</RelativeLayout>