Android positioning in Layout

Question

I'm trying to build in my Layout this kind of line:

"Total......................1000"

I need to change "1000" depending on what I receive from network. As a result I have to change width of "........." . Word "Total" is just a final TextView. How to implement it in Layout? When phone changes to landscape "....." (dots) have to be longer and I don`t know how to implement it.

So I have 3 parts: TextView "Total", TextView "...." (dots), and TextView "1000" which can be any namber from 1 to infinity. How to implement them in order to show the mandatory "Total" and "1000" in conjunction with "....." between them depending on size of screen?

The following xml doesn`t make it.

<RelativeLayout 
                android:id="@+id/statistic_layout"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/statistic_separator"
                android:orientation="horizontal"
                android:padding="15dp">


               <TextView android:id="@+id/published_recepies"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content" 
                        android:textStyle="bold"
                        android:textSize="18dp"
                        android:layout_alignParentLeft="true"
                        android:textColor="@color/dark_orange"
                        android:text="Total"/>

               <TextView android:id="@+id/dots"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content" 
                        android:textSize="18dp"
                        android:layout_toRightOf="@+id/published_recepies"
                        android:textColor="@color/dark_orange"
                        android:text="@string/dots"/>

               <TextView android:id="@+id/published_recepies_data"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content" 
                        android:textSize="18dp"
                        android:layout_alignParentRight="true"
                        android:textColor="@color/dark_orange"
                        android:text="323"/>           

           </RelativeLayout>

Answer 1

You need to play around with weight attributes : Try below snippet ,make use of below code and design as per your requirement :

<?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="fill_parent"
android:orientation="horizontal" >

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_weight="1"
    android:background="#ffffff" >
</LinearLayout>

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_weight="1"
    android:background="#ffffeabc" >
</LinearLayout>

 <LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_weight="1"
    android:background="#ffffedef" >
</LinearLayout>

</LinearLayout>

Answer 2

Try this,,

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/white" >

    <TextView
        android:id="@+id/text"
        android:layout_width="fill_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        android:background="@android:color/white"
        android:singleLine="true"
        android:text="......................................................................................................................................................................"
        android:textColor="#000000"
        android:textSize="18dip" />

    <TextView
        android:id="@+id/text2"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="left"
        android:background="@android:color/white"
        android:text="Total"
        android:textColor="#000000"
        android:textSize="18dip" />

    <TextView
        android:id="@+id/text3"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="right"
        android:background="@android:color/white"
        android:text="1000"
        android:textColor="#000000"
        android:textSize="18dip" />

</FrameLayout>

Two little problems in my code,

1. You need to write so many dots hardcoded in layout xml file.
2. As sometimes there is a some little portion of dots cuts on both side.

Answer 3

How about a horizontal LinearLayout with the objects of equal layout_weights? "Total" can be wrap_content width, "......" can be match_parent , and "1000" can be wrap_content . Align "Total" to the left, "1000" to the right, and "....." will fill the rest of the space between the other two. However, this would only work if you do something somewhat ridiculous like make the "...." string 200 dots long. In that way, some of the dots will not appear and will run off screen, but at least you'll see all the dots you need between "Total" and "1000". What do you think?

The only other "more complicated" way I could think of doing this is every time you switch orientation or increase/decrease the number, find the width of the screen in pixels, figure out the width of the word "Total" and the each digit of the number in pixels, subtract that from the width, and divide that by the number of pixels a dot takes up. That number would be the amount of dots to put in the "...." string.