In my app I'm trying to adjust this layout so it's readable when the user scales the system wide font size in Android System settings -> Display -> Font size (or in accessibility settings on some devices). Doing some digging I found out this adjusts the device configuration font scale (getResources().getConfiguration.fontScale) from 1.0 to 1.15.
I'm getting some weird behavior in a LinearLayout where one of the TextViews width gets crushed, when it's set to wrap_content, and also doesn't reflect a set minWidth.
What it looks like normally
What it looks like when font is scaled
Here is the LinearLayout in question (comments added for context in screenshot)
<LinearLayout
android:id="#+id/sectionPaintStatus"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginTop="20dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<!-- () 6 Paint Items -->
<LinearLayout
android:id="#+id/sectionPaintItemToggle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:gravity="center_vertical"
android:orientation="horizontal"
android:paddingBottom="5dp">
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabExpandPaintItems"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:rotation="180"
android:src="#drawable/ic_collapse"
app:elevation="2dp"
app:fabSize="mini"/>
<TextView
android:id="#+id/tvPaintItemCount"
style="#style/Label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:text="0 Paint Items"
android:textSize="16sp"/>
<ImageView
android:id="#+id/imgPaintAreaWarning"
android:layout_width="20dp"
android:layout_height="match_parent"
android:layout_marginStart="10dp"
android:scaleType="centerInside"
android:src="#drawable/ic_edit_warning2"
android:visibility="invisible"/>
</LinearLayout>
<!-- Inner layout to consume middle width and right align the rest -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="end"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/layoutPaintItemCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="end"
android:orientation="vertical"
android:visibility="invisible">
<TextView
android:id="#+id/tvPaintItemCountStatus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2"
android:textSize="16sp"
android:textStyle="bold"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Paint Items"
android:textSize="16sp"/>
</LinearLayout>
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginStart="30dp"
android:scaleType="centerInside"
android:src="#drawable/ic_time"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="end"
android:orientation="vertical">
<TextView
android:id="#+id/tvPaintTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2.5h"
android:textSize="16sp"
android:textStyle="bold"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Time"
android:textSize="16sp"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="30dp"
android:layout_marginEnd="30dp"
android:minWidth="70dp"
android:gravity="end"
android:orientation="vertical">
<TextView
android:id="#+id/tvPaintTotal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="$123.22"
android:textSize="16sp"
android:textStyle="bold"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Total"
android:textSize="16sp"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
Why is that last LinearLayout containing 2 TextViews not properly wrapping content? I tried removing the minWidth incase that was causing any issues and got the same result. I don't understand why all the other layouts wrap their content properly but the last one doesn't.
And is it possible to add a resource folder for scaled system wide font?
Edit It appears removing margins allow the TextView to wrap the proper width but obviously I need the margins.
Can anyone explain this strange behavior?
Edit Solved
It turns out I completely forgot about an invisible element in the layout between the "Paint Items" label and the time icon. It was causing me to run out of horizontal space.
You appear to have used layout_width="match_parent" and gravity="end" to align your elements.
I assume on small devices (or with large text) you'd like the "0 Paint Items" to ellipsize when not enough space, and have the 'Time' and 'Total' fields to show at full width.
To do this, we make the following changes:
First, make the sectionPaintItemToggle have 0dp width and layout_weight="1" - this tells Android "this should fill as much space is available".
<LinearLayout
android:id="#+id/sectionPaintItemToggle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
... >
I removed all the gravity="end" settings.
I changed the "inner layout" (as per the comment) to be have wrap_content width.
I deleted the entire layoutPaintItemCount layout - I feel like you were trying a different way to do the "N paint items" layout.
In the end, we have something like this (I swapped in an ImageView for the FAB and just used resources I already had - I think I changed some margins too):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:id="#+id/sectionPaintStatus"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="20dp"
android:layout_marginStart="20dp"
android:layout_marginTop="20dp"
android:gravity="center_vertical"
>
<!-- () 6 Paint Items -->
<LinearLayout
android:id="#+id/sectionPaintItemToggle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:clipToPadding="false"
android:gravity="center_vertical"
android:orientation="horizontal"
android:paddingBottom="5dp">
<ImageView
android:id="#+id/fabExpandPaintItems"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_margin="5dp"
android:rotation="180"
android:src="#drawable/ic_edit_black_24dp"/>
<TextView
android:id="#+id/tvPaintItemCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:text="0 Paint Items"
android:textSize="16sp"/>
<ImageView
android:id="#+id/imgPaintAreaWarning"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginStart="10dp"
android:scaleType="centerInside"
android:src="#drawable/ic_edit_black_24dp"
android:visibility="invisible"/>
</LinearLayout>
<!-- Inner layout to consume middle width and right align the rest -->
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:scaleType="centerInside"
android:src="#drawable/ic_edit_black_24dp"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/tvPaintTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2.5h"
android:textSize="16sp"
android:textStyle="bold"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Time"
android:textSize="16sp"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="30dp"
android:layout_marginStart="30dp"
android:orientation="vertical">
<TextView
android:id="#+id/tvPaintTotal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="$123.22"
android:textSize="16sp"
android:textStyle="bold"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Total"
android:textSize="16sp"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
The key part was to convince Android that the "N Paint Items" view was the one you wanted to shrink.
Related
I am trying to get the TextView, "tv_amount" to stay on the right side of the screen. I have tried using android:gravity="right" but that hasn't been working for me. Anyone have any suggestions?
Image of emulator running this code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="45dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="#+id/iv_icon"
android:layout_width="40sp"
android:layout_height="40sp"
android:background="#drawable/circle_border"
android:padding="6sp"
android:layout_marginLeft="6dp"
android:src="#drawable/food"/>
<TextView
android:id="#+id/tv_label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginStart="12dp"
android:text="Yummy Pizza"
android:textSize="20sp" />
<TextView
android:id="#+id/tv_amount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="12dp"
android:gravity="end"
android:text="$25"
android:textSize="25sp" />
</LinearLayout>
I am expecting the transaction or "tv_amount" to stay be right justified so that end of the number is staying towards the right side of the screen.
I tried using :
android:layout_weight="0"
android:layout_gravity="end"
android:gravity="right"
but these don't seem to work obviously. I am a beginner when it comes to android development and can't seem to find any answers that have helped anywhere else. They all say to use android:gravity or some other alternative. Maybe there is something in my code that doesn't allow that.
Try it like this:
Splitting the content into left and right will result in the weight and gravity properties working. Check out this layout below.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/tv_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Title"
android:textSize="20sp" />
<!--Separate layout aligned to the left, containing an image and a yummy pizza label. -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal">
<ImageView
android:id="#+id/iv_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<TextView
android:id="#+id/tv_text_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text Left"
android:textSize="16sp" />
</LinearLayout>
<!--Display the pizza price on a separate label aligned to the right -->
<TextView
android:id="#+id/tv_text_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:text="Text Right"
android:layout_weight="1"
android:textSize="16sp" />
</LinearLayout>
</LinearLayout>
I am dumb. The issue wasn't with the code in my individual recycler view layout code. It was with my activity_main.xml. I set the recycler_view width to "wrap_content" when it should have been "match_parent." Rookie mistake.
I have the next design:
Actual design app
CODE:
<LinearLayout
android:id="#+id/edit_name"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#99000000"
android:weightSum="1">
<FrameLayout
android:background="#color/tabIndicator"
android:layout_width="310dp"
android:layout_gravity="center"
android:clickable="true"
android:layout_height="wrap_content"
android:minHeight="136dp"
android:layout_weight="0.75">
<TextView
android:id="#+id/close_circle"
android:elevation="2dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="X"
android:background="#drawable/oval_corner"
android:backgroundTint="#color/colorPrimary"
android:layout_gravity="top|bottom|right"
android:layout_alignParentEnd="true"
android:paddingLeft="8dp"
android:paddingTop="3dp"
android:paddingRight="8dp"
android:paddingBottom="3dp"
android:textColor="#color/tabIndicator"
android:textStyle="bold"
android:layout_margin="2dp"
android:translationZ="2dp">
</TextView>
<TextView
android:id="#+id/textDescLarga"
android:layout_width="match_parent"
android:layout_height="208dp"
android:text="#string/text_placeholder_benefit"
android:textStyle="normal"
android:textSize="12dp"
android:textColor="#color/textDefault"
android:layout_gravity="bottom|center"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:maxLines = "12"
android:scrollbars="vertical">
</TextView>
<ImageView
android:id="#+id/imageMain"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:src="#drawable/placeholder_benefit"
android:layout_gravity="top|left">
</ImageView>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:id="#+id/textTitulo"
android:layout_gravity="center"
android:layout_marginBottom="0dp"
android:text="Nombre hotel"
android:textAlignment="center"
android:textStyle="bold"
android:textSize="19dp"
android:textColor="#color/cardview_dark_background"/>
</FrameLayout>
PROBLEM:
When I need auto height, on the text, whether increases or decreases, I tried Fragment Layout layout_height: wrap_content but text overlap image.
What am I doing wrong? Is there another way to do this?
Thanks
FrameLayout renders it's children in a stack - one on top of the other unless you use layout_gravity to position them. FrameLayout is typically used with the entire available screen space - the layout_height and layout_width are set to match parent.
Your issue is because you have the layout_height set to wrap content, it will overlay widgets one on top of the other. Set the layout_height to match parent. Or better yet for your case, use a RelativeLayout.
I have a layout with one row:
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingRight="#dimen/total_sales_page_summary_text_distance"
android:text="test2"
android:textSize="#dimen/total_sales_page_info_font_size" />
<TextView
android:id="#+id/year_on_year"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#color/total_sales_info_text_color"
android:textSize="#dimen/total_sales_page_info_font_size" />
<ImageView
android:id="#+id/tradeGreen"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_gravity="center_vertical"
android:contentDescription=""/>
</LinearLayout>
In source code I just set different number and visibility (GONE/VISIBLE) of imageview (clicking on different buttons).
as result:
image is not visible (button1 was clicked)
2.image and some long number are vivible (button2 was clicked)
3.image and other little shorter number are visible (button3)
You can compare how it looks like. Text becomes visible but image is on the previous place. Why? Why image is not moved to left.
By the way. When screen is rotated - image becomes visible on correct place.
Try to use weight.. it will align based on screen
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:orientation="horizontal" xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:paddingRight="#dimen/total_sales_page_summary_text_distance"
android:text="test2"
android:textSize="#dimen/total_sales_page_info_font_size" />
<TextView
android:id="#+id/year_on_year"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:textColor="#color/total_sales_info_text_color"
android:textSize="#dimen/total_sales_page_info_font_size" />
<ImageView
android:id="#+id/tradeGreen"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_marginLeft="5dp"
android:layout_gravity="center_vertical"
android:contentDescription=""/>
As Deepchand rightly said, add that Image as a drawable to the TextView directly. This will take care of the Image position and will remove an extra ImageView from the layout.
So to your TextView add this,
<TextView
android:id="#+id/year_on_year"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#color/total_sales_info_text_color"
android:drawableRight="your image" //this will add an image to its right
android:drawablePadding="5dp" // you can also add padding as per you need
android:textSize="#dimen/total_sales_page_info_font_size" />
Hope this works the way you want. :)
This will be solved by using Weight.
Here your UI is horizontally so you need to change in your xml file. Like,
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:orientation="horizontal" xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:paddingRight="#dimen/total_sales_page_summary_text_distance"
android:text="test2"
android:textSize="#dimen/total_sales_page_info_font_size" />
<TextView
android:id="#+id/year_on_year"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:textColor="#color/total_sales_info_text_color"
android:textSize="#dimen/total_sales_page_info_font_size" />
<ImageView
android:id="#+id/tradeGreen"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_marginLeft="5dp"
android:layout_gravity="center_vertical"
android:contentDescription=""/>
</LinearLayout>
As seen in picture below I need a layout where Textview containing contents 'Hello' and layout '2' are always visible and are between layout '1' and ']'
{1}Hello{2} ]
{1}Hello I..{2}]
If textview contents are too long they should ellipsize
Layout '2' shouldn't be right aligned to parent or ']', but be next to TextView
I have tried playing with wieghts and relative layout but do not seem to get a working solution.
Any ideas/pointers?
Here is slimdown version of my layout
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/simple_white_button"
android:orientation="horizontal" >
<RelativeLayout
android:id="#+id/topLayout1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.85"
android:paddingBottom="5dp"
android:paddingLeft="5dp"
android:paddingTop="5dp" >
<ImageView
android:id="#+id/photo"
android:layout_width="75dp"
android:layout_height="75dp"
android:scaleType="centerCrop"
android:src="#drawable/headshot_alt"
android:visibility="visible" />
<LinearLayout
android:id="#+id/myRow"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/photo" >
<TextView
android:id="#+id/address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginTop="2dp"
android:ellipsize="end"
android:singleLine="true"
android:text="New Jersey"
android:textColor="#color/grey_text"
android:textSize="16sp" />
<LinearLayout
android:id="#+id/weather"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginTop="2dp"
android:layout_weight="1"
android:gravity="left" >
<!-- Weather -->
<ImageView
android:id="#+id/imgWeather"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_notification_news"
android:visibility="visible" />
<TextView
android:id="#+id/txtWeather"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="3dp"
android:gravity="center_vertical"
android:text="50/43"
android:textColor="#color/text_dark"
android:textSize="13sp"
android:visibility="visible" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
<LinearLayout
android:id="#+id/menu"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="0.15"
android:background="#drawable/simple_white_button"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="#+id/menu_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="center"
android:src="#drawable/ic_quickaction_default" />
</LinearLayout>
</LinearLayout>
Where {1} would be the id = photo, ] is id=menu and id=myRow is the textview + weather layout i want in between photo and menu. I preferably do not want to set max width on my address text view, in worst case i want it ellipsize when weather touches the menu, But when address is small i want weather next to address and not close to menu
Hopefully its bit more clear now
In a relative layout, with fixed width for the textview, Layout'2' as layout_toRightOf the textview, something like this:
<TextView
android:id="#+id/firstText"
android:layout_width="60dp"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:text="Hello String"
android:lines="1"
android:ellipsize="end"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/layoutTwo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/firstText"
android:background="#android:color/white"
android:text="Layout 2"
android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>
Provide the container layout as per your requirement. With a fill_parent width, you can adjust the "]" to be at the extreme right or xdp away after your Layout 2
Can you specify, precisely, what is required...i'l edit my answer
I want to display three different values allocated to two different headers, in other words a first header with one value and a second one with two values
My approach is to split the "header linear layout" 40/60 and the "values linear layout" 40/30/30. In order to not display the text beginning at the border, I put everywhere an android:layout_marginLeft="15dp" in, so finally it should remain proportional.
In my XML, I declare the following:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_weight="4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:text="#string/txt_price_chf"
/>
<TextView
android:layout_weight="6"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:text="#string/txt_price_offshore_chf"
/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView android:id="#+id/tv_price_ch"
android:layout_weight="4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:text="Value1"
/>
<TextView android:id="#+id/tv_price_off_chf"
android:layout_weight="3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:text="Value2"
/>
<TextView android:id="#+id/tv_price_off_eur"
android:layout_weight="3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:text="Value3"
/>
</LinearLayout>
The result is following output:
Why are the "Price offshore:"-TextView and the "Value2"-TextView not in line? Note that "Price offshore" is saved in my strings.xml, there is no error like a whitespace or something. First I thought, it's caused by the android:layout_marginLeft="15dp", but
how I understood it the "dp" is a relative value to a specific
resolution (so the split-off by android:layout_weigth should not
effect this) and
if I remove the margins, they are still not in
line.
Has anyone an idea? Do I overlook something obvious?
<TextView
android:layout_weight="4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_marginRight="-10dp"
android:text="#string/txt_price_chf"
/>
This will work for you...
Not really something you should be doing with a LinearLayout though.
I suggest using a RelativeLayout, there you can just say that those two should align.
Without digging into details in this particular case, it can be either marginRight, padding etc or just simply a side effect of the non monospaced font.
Or another alternative is this:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight=".60"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="txt_price_chf" />
<TextView
android:id="#+id/tv_price_ch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Value1" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight=".40"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="txt_price_offshore_chf" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/tv_price_off_chf"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Value2" />
<TextView
android:id="#+id/tv_price_off_eur"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Value3" />
</LinearLayout>
</LinearLayout>