Equal TextView in TableLayout - android

I would like to create in my application statistics from a'la tiles metro. Unfortunately TextView hasn't equal width, as it solved?
This is my layout

Use android:weightSum and android:layout_weight
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:weightSum="4" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginRight="1dp"
android:layout_weight="2"
android:background="#B0B0B0" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginRight="1dp"
android:layout_weight="2"
android:background="#B0B0B0" />
</TableRow>
</TableLayout>

Related

Equi-height row in table layout

I want to make a re-usable table layout, in which I have 3 rows and last row contains 1 element only whereas first two contains 2 element each.
Now, problem is, rows in the table layout are not of equal height despite of giving equal weight to each row.
Bottom row is consuming too much space.
Following is the layout content:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="3"
>
<TableRow
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:weightSum="2" >
<TextView
android:id="#+id/txtvw_age"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/age" >
</TextView>
<TextView
android:id="#+id/txtvw_roll_no"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/roll_no" >
</TextView>
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:weightSum="2" >
<TextView
android:id="#+id/txtvw_standard"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/standard" >
</TextView>
<TextView
android:id="#+id/txtvw_section"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/section" >
</TextView>
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
>
<TextView
android:id="#+id/txtvw_ct_name"
android:layout_width="0dp"
android:layout_height="match_parent"
android:text="#string/ct_name" >
</TextView>
</TableRow>
</TableLayout>
try this:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="3"
>
<TableRow
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:weightSum="2" >
<TextView
android:id="#+id/txtvw_age"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/save" >
</TextView>
<TextView
android:id="#+id/txtvw_roll_no"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/save" >
</TextView>
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:weightSum="2" >
<TextView
android:id="#+id/txtvw_standard"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/save" >
</TextView>
<TextView
android:id="#+id/txtvw_section"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/save" >
</TextView>
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/txtvw_ct_name"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/save" >
</TextView>
</TableRow>
</TableLayout>
I made the following change to the last TableRow and all goes well
<TableRow
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:weightSum="1"
>
<TextView
android:id="#+id/txtvw_ct_name"
android:layout_width="0dp" // this t.v will consume all width
android:layout_weight="1"
android:layout_height="match_parent" // consume all height as of parent which is adjusted by weight.
android:text="#string/save"
>
</TextView>
</TableRow>
Since table layout has weight sum 3, i provide equal weight to the table row ( w.r.t height).

TextView alignment in the TableRow

There are two TableRows in the TableLayout, and each TableRow contains two TextViews:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TableRow
android:id="#+id/tableRow1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp" >
<TextView
android:id="#+id/textTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/textTitle"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_marginLeft="10dp" />
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="63dp"
android:layout_marginRight="10dp" >
<TextView
android:id="#+id/textHall"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/textPrice"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_marginLeft="10dp" />
</TableRow>
</TableLayout>
If textHall contains a short Word, textTitle (Some Text) located at the correct position:
But if textHall contains a long Second Word, before textTitle (Some Text) appears a large indentation:
What is the reason?
Thanks.
You should give weight for your layouts and rows. I adapted your code. Here is the one that should be.
<TableRow
android:id="#+id/tableRow1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:weightSum="2" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="2"
android:orientation="horizontal" >
<TextView
android:id="#+id/textTime"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:text="10:30" />
<TextView
android:id="#+id/textTitle"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="left"
android:layout_marginLeft="10dp"
android:text="Some Text" />
</LinearLayout>
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="63dp"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:weightSum="2" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="2"
android:orientation="horizontal" >
<TextView
android:id="#+id/textHall"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:text="Some Word" />
<TextView
android:id="#+id/textPrice"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_marginLeft="10dp"
android:layout_weight="1"
android:text="200" />
</LinearLayout>
</TableRow>
You can put any margin value for your second row as you wish.
Hope this may help.
Your textHall and textTime both fall into same column and the width of that column is set to the width of textHall(as this is having more width) as a result your textTime textview's width is increasing when you increase text in textHall.

LinearLayout expanding when adding TextView to LinearLayout

I am using android:weight attribute.
First state
http://s1.postimg.org/umygk8han/first.png
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="223"
android:orientation="horizontal" >
</LinearLayout>
When add TextView
http://s7.postimg.org/89qjb42dn/two.png
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="223"
android:orientation="horizontal" >
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Sample"
android:textColor="#android:color/background_dark" />
</LinearLayout>
How can I solve this problem?
Best regards
I think that initially you need a RelativeLayout outside of the
LinearLayout , because I don't think it is a good idea to
assign layout_weight to a LinearLayout.
So do it like this:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="223"
android:orientation="horizontal" >
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="Sample"
android:maxLines="1"
android:textColor="#android:color/background_dark" />
</RelativeLayout>
PS: I set the android:layout_height="0dp" of this RelativeLayout because it looked to me (according to the screenshots) that it was a node of a LinearLayour with orientation='vertical'
I understand that the linearlayout expands due to font size in the textView, try to decrease font size.
<TextView ....
android:textSize="9sp" />
Also you could try to set padding textview to 0
android:padding="0dp"
Hope it helps!
try setting android:layout_height="match_parent" in your TextView to android:layout_height="wrap_content"
Please try to use bellow code.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="vertical"
android:padding="5dip"
android:weightSum="2" >
<TextView
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:background="#android:color/white"
android:text="Sample" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="vertical"
android:padding="5dip"
android:weightSum="2" >
<TextView
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:background="#android:color/white"
android:text="Sample"
android:textColor="#android:color/background_dark" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="vertical"
android:padding="5dip"
android:weightSum="2" >
<TextView
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:background="#android:color/white"
android:text="Sample"
android:textColor="#android:color/background_dark" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="vertical"
android:padding="5dip"
android:weightSum="2" >
<TextView
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:background="#android:color/white"
android:text="Sample"
android:textColor="#android:color/background_dark" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="vertical"
android:padding="5dip"
android:weightSum="2" >
<TextView
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:background="#android:color/white"
android:text="Sample" />
</LinearLayout>

How to make the last TableRow visible?

Picture of the android interface: http://tinypic.com/view.php?pic=avht6w&s=6
As seen in the picture above I want a small borders at the bottom and top of the white listView. The problem is, as I set the tableRow to be android:paddingBottom="20dp" the border never gets displayed at the bottom. It seems like, if the listviews height is big enough, nothing else after it will get displayed (See code example below to understand).
I have tested some different approaches to solve the problem, one is setting the paddingBottom attribute in the next TableRow (the borders tableRow) but it will only work if the listView's height is exact of the screens height and not to big.
Why do I set the listView's height to a fixed number like 415dp? Well, it is due to another problem I do not know how to solve. If I for example set the listViews height to fill_parent the background will only cover the number of items in the list. I always want the lists background to be filled down to 20dp from the bottom of the interface.
If anyone has some ideas how I can managed to display the border at the bottom and always have the lists background visible, even if it is not filled with items, please post your ideas! /thanx alot!
<?xml version="1.0" encoding="utf-8"?>
<TableLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#drawable/orginalbild"
android:gravity="center|top"
android:stretchColumns="1"
android:weightSum="1.0"
android:fillViewport="true">
<TableRow
android:background="#000000"
>
<TextView
android:layout_marginTop="0.15dp"
android:layout_width="fill_parent"
android:layout_height="2dp"
android:background="#999999"
android:layout_weight="1">
</TextView>
</TableRow>
<TableRow
android:background="#999999"
>
<TextView
android:background="#999999"
android:id="#+id/show_task_feedback_title"
android:layout_width="0dip"
android:layout_height="28dp"
android:layout_weight="0.8"
android:text="#string/LatestFeedbackTitle"
android:textColor="#ffffff"
android:textSize="17dp"
android:shadowColor="#FFFFFF"
android:layout_marginBottom="0.15dp"
android:textAppearance="?android:attr/textAppearanceMedium">
</TextView>
<TextView
android:layout_width="0dip"
android:layout_height="28dp"
android:layout_gravity="center"
android:layout_weight="0.08" >
</TextView>
<Button
android:id="#+id/latest_feedback_help_button"
android:layout_width="0dip"
android:layout_height="28dp"
android:layout_gravity="center"
android:background="#drawable/help_button"
android:layout_weight="0.12"
android:layout_marginBottom="0.15dp"
/>
</TableRow>
<TableRow
android:background="#212421">
<TextView
android:layout_width="fill_parent"
android:layout_height="1dp"
android:background="#ffffff"
android:layout_marginTop="0.15dp"
android:layout_weight="1">
</TextView>
</TableRow>
<TableRow>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.25" />
</TableRow>
<TableRow
android:paddingLeft="24dp"
android:paddingRight="24dp"> <--------THE BLACK BRODER AT THE TOP OF THE LISTVIEW
<TextView
android:background="#000000"
android:layout_width="0dip"
android:layout_height="0.5dp"
android:layout_weight="1" >
</TextView>
</TableRow>
<TableRow
android:paddingLeft="24dp"
android:paddingRight="24dp"
android:paddingBottom="20dp" <------(paddingBottom attribute which causes the problem)
>
<ListView
android:background="#ffffff"
android:id="#+id/bookmarks_list"
android:layout_width="0dip"
android:layout_height="415dp"
android:gravity="left"
android:layout_weight="1"
/>
</TableRow>
<TableRow> <---THE BLACK BRODER AT THE BOTTOM OF THE LISTVIEW(not being displayed)
<TextView
android:background="#000000"
android:layout_width="0dip"
android:layout_height="0.5dp"
android:layout_weight="1" >
</TextView>
</TableRow>
</TableLayout>
See if this helps.
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/orginalbild"
android:fillViewport="true"
android:gravity="center|top"
android:orientation="vertical"
android:stretchColumns="1"
android:weightSum="1.0" >
<TableRow android:background="#000000" >
<TextView
android:layout_width="fill_parent"
android:layout_height="2dp"
android:layout_marginTop="0.15dp"
android:layout_weight="1"
android:background="#999999" >
</TextView>
</TableRow>
<TableRow android:background="#999999" >
<TextView
android:id="#+id/show_task_feedback_title"
android:layout_width="0dip"
android:layout_height="28dp"
android:layout_marginBottom="0.15dp"
android:layout_weight="0.8"
android:background="#999999"
android:shadowColor="#FFFFFF"
android:text="#string/LatestFeedbackTitle"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#ffffff"
android:textSize="17dp" >
</TextView>
<TextView
android:layout_width="0dip"
android:layout_height="28dp"
android:layout_gravity="center"
android:layout_weight="0.08" >
</TextView>
<Button
android:id="#+id/latest_feedback_help_button"
android:layout_width="0dip"
android:layout_height="28dp"
android:layout_gravity="center"
android:layout_marginBottom="0.15dp"
android:layout_weight="0.12"
android:background="#drawable/help_button" />
</TableRow>
<TableRow android:background="#212421" >
<TextView
android:layout_width="fill_parent"
android:layout_height="1dp"
android:layout_marginTop="0.15dp"
android:layout_weight="1"
android:background="#ffffff" >
</TextView>
</TableRow>
<TableRow>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.25" />
</TableRow>
<TableRow
android:paddingTop="0.5dp"
android:paddingBottom="0.5dp"
android:background="#000000"
android:layout_marginLeft="24dp"
android:layout_marginRight="24dp"
android:layout_marginBottom="20dp"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ListView
android:id="#+id/bookmarks_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#ffffff"
android:gravity="left"
android:entries="#array/listitems" />
</TableRow>
</TableLayout>

EditText in a tableRow how to fix 100%

I have a linearlayout with a table and a button, the table has EditText and TextView, my problem is with EditText, which is too small
<LinearLayout
android:orientation="vertical"
android:layout_width="300dip"
android:layout_height="350dip"
android:background="#drawable/background_resto"
>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
>
<TableLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
>
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity ="center"
>
<TextView
android:id="#+id/nameRegister"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#000000"
android:text="Nombre"
android:layout_marginLeft="10dip"
/>
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity ="center"
>
<EditText
android:id="#+id/registerName"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:layout_marginLeft="10dip"
android:layout_marginRight="10dip"
/>
</TableRow>
</TableLayout>
<Button
android:id="#+id/butRegister"
android:layout_height="35dip"
android:layout_width="wrap_content"
android:text="Enviar"
/>
</LinearLayout>
</LinearLayout>
I would like the EditText fix the 300dip that the first linearLayout, but I don't get it, what should I do?
Try this, add to TableLayout stretchColumns param
<TableLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:stretchColumns="1"
>

Categories

Resources