Android: Two columns, one with wrapped text and other single line - android

I need to place two EditText side by side, the left one can be multiline, but the right one has to be just one line. I've used a table layout with just one row but I have the following problem, the second column should have just the enough room to show the one single line text but not more. How can I achive that? Thank you very much
<TableLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal">
<TableRow
android:background="#87F1FF"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:maxLines="3"
android:text="this can take more than a line"
android:textColor="#android:color/black"
android:textSize="40sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#454545"
android:maxLines="1"
android:text="May 25 - 10:00 pm"
android:textColor="#android:color/black"
android:textSize="20sp" />
</TableRow>
</TableLayout>

Make second TextView without android:layout_weight="1"

Just change in your 2nd TextView:
android:layout_width="0dp"
Instead of
android:layout_width="wrap_content"

Related

Android - TextView alignment for random text

I am developing an app. In that I am getting data from webservice and I am inserting it in TextView. But, the alignment of the textview is getting scrambled. Please check the image.
First 3 rows(black colored) is in proper order, from the 4th it is scrambled. I googled on it so many times but not getting the exact solution as I wanted.
XML 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="70dp"
android:orientation="horizontal"
>
<TextView
android:id="#+id/schedule_1_textView_day_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="KKR"
android:layout_weight="1.5"
android:layout_marginTop="10dp"
android:textColor="#color/Black"
android:textSize="7sp"
/>
<TextView
android:id="#+id/schedule_1_textView_matchno"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="10"
android:layout_weight="1.5"
android:layout_marginTop="10dp"
android:textColor="#color/Black"
android:textSize="7sp"
/>
<TextView
android:id="#+id/schedule_1_textView_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="6"
android:textColor="#color/Black"
android:textSize="7sp"
/>
<TextView
android:id="#+id/schedule_1_textView_team1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="4"
android:textSize="7sp"
android:textColor="#color/Black"
/>
<TextView
android:id="#+id/schedule_1_textView_team2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:layout_weight="1"
android:layout_marginTop="10dp"
android:textColor="#color/Black"
android:textSize="7sp"
/>
<TextView
android:id="#+id/schedule_1_textView_venue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="6"
android:layout_marginTop="10dp"
android:textColor="#color/Black"
android:textSize="7sp"
/>
<TextView
android:id="#+id/schedule_1_textView_blank"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="B"
android:layout_marginTop="20dp"
android:textColor="#color/Black"
android:textSize="6sp"
android:visibility="invisible"
/>
</LinearLayout>
Try this..
You forget to add android:layout_weight="1" for below two TextView Use android:singleLine="true" for all TextView
<TextView
android:id="#+id/schedule_1_textView_venue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:singleLine="true"
android:text="6"
android:layout_marginTop="10dp"
android:textColor="#color/Black"
android:textSize="7sp"
/>
<TextView
android:id="#+id/schedule_1_textView_blank"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:singleLine="true"
android:text="B"
android:layout_marginTop="20dp"
android:textColor="#color/Black"
android:textSize="6sp"
android:visibility="invisible"
/>
you might wanna assigh android:layout_weight property to the TextViews like:
<TextView
android:id="#+id/schedule_1_textView_venue"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="6"
android:layout_marginTop="10dp"
android:textColor="#color/Black"
android:textSize="7sp" />
you will need to assign weight according to your requirement. i.e for bigger views you want to assign higher values.
[EDIT] and for the last TextView you may want to set android:layout_gravity="center|right" and android:layout_gravity="center|left" for the first for the text alignment for the rest you should use android:layout_gravity="center"
Add gravity to your TextView like:
android:gravity="center_vertical|center_horizontal"
change gravity to left, right or center as you need...
have you tried adding weight to schedule_1_textView_venue?
It's a little more work, but did you try using TableLayout? This is very useful tutorial that can help you organizing the correct order of views.
EDIT: I think i know what causes the mismatch of the TextViews. It comes from the different length of the values in your last column named VENUE. Take for example the values HYDEBARAD and DELHI - the first one is much longer than the second which makes all the TextViews on the row to go left. I am sure that if you put identical padding to the TextViews you will align them. For example: take your TextViews in MATCH column and write the following: myTextView.setPadding(40, 0, 0, 0) (padding on the left side) this will put them exactly in a straight row. Do the same with the rest TextViews with the proper padding value, take into consideration the length of the values in the other columns... It is a little bit tricky though. :)

How to force a TableRow to wrap_content?

I am trying to build a really simple TableLayout, with 2 columns and an undeterminate number of rows.
In the first columns, I put a TextView, which MUST BE written on 2 lines :
<string name="param_period_data_rec_text">Période d\'acquisition des données\n(secondes)</string>
And in the second column, I put an EditText.
My problem is : the EditText's height is about 1 and a half lines of text, and the TableRows wraps around it, hiding the half of the second line of the TextView.
Of course, I would like the TextView to be displayed completely. How should I do?
<TableLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="30dp"
android:background="#color/blanc"
android:orientation="horizontal"
android:padding="20dp" >
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/param_frequence_data_rec_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/param_period_data_rec_text"
android:textColor="#android:color/black"
android:textSize="20sp" />
<EditText
android:id="#+id/param_frequence_data_rec_input"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/param_period_data_rec_input"
android:textColor="#android:color/black"
android:textSize="20sp" />
</TableRow>
</TableLayout>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal">
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/param_frequence_data_rec_text"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="#string/param_period_data_rec_text"
android:textColor="#android:color/black"
android:textSize="20sp" />
<EditText
android:id="#+id/param_frequence_data_rec_input"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="editText"
android:textColor="#android:color/black"
android:textSize="20sp" />
</TableRow>
update: textVeiw and editText width = 0dp, so that layout_weight="1" property can work
Try to set android:layout_height="wrap_content" to fill_parent in your TextView.
Try adding
android:minLines="2"
to the tag describing the widget that needs to have at least two lines. wrap_content (which you already have) should take care of the rest.

text align with different character count

I am really really sorry about my poor English
Here is what I made.
with
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView android:id="#+id/txtTImeRemain"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:layout_marginRight="50dip"
android:textColor="#ff000000"
android:gravity="center_vertical|left"
/>
<TextView android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:layout_marginRight="5dip"
android:textColor="#ff000000"
android:gravity="center_vertical|right"
/>
</LinearLayout>
My question is.
I want to align the left most words to being center of their row. regardless how many character they have.
Use a TableLayout, then you can set the layout_gravity for the different parts of the table row.

Trouble with layout in android (ellipsized text between two buttons)

Trying to make toolbar with two buttons on both sides and header between. Header should be ellisized when text is too long, like this:
[Button] Some quite long header te... [Button]
I've tried several solutions, but none help. My last try was something like this:
<TableLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#444"
android:stretchColumns="1">
<TableRow android:background="#777" android:minHeight="60dp">
<Button android:text="Left"/>
<TextView android:text="Center this very long text and ellisize"
android:background="#f00"
android:lines="1"
android:ellipsize="end"
android:scrollHorizontally="true"
android:gravity="center"
/>
<Button android:text="Right"/>
</TableRow>
</TableLayout>
But right button still goes away from screen...
UPDATE:
The solution is:
<RelativeLayout android:layout_width="fill_parent" android:layout_height="64dip">
<Button android:id="#+id/btnLeft"
android:text="Left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<Button android:id="#+id/btnRight"
android:text="Right"
android:layout_alignParentRight="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView android:text="Center this very long text and ellisize"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:background="#f00"
android:lines="1"
android:ellipsize="end"
android:gravity="center"
android:scrollHorizontally="true"
android:layout_toLeftOf="#id/btnRight"
android:layout_toRightOf="#id/btnLeft"
/>
</RelativeLayout>
UPDATE 2: And the second solution using TableLayout:
<TableLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#444"
android:stretchColumns="1"
android:shrinkColumns="1">
<TableRow android:background="#777" android:minHeight="60dp">
<Button android:text="Left"/>
<TextView android:text="Center this very long text and ellisize"
android:background="#f00"
android:lines="1"
android:ellipsize="end"
android:scrollHorizontally="true"
android:gravity="center"
/>
<Button android:text="Right"/>
</TableRow>
</TableLayout>
Try using a relative layout instead of a table layout. If you set up the two buttons to be aligned left and right respectively, you can set the text field to span between the two buttons with the layout_alignRight and layout_alignLeft properties. You can look at the example code for the RelativeLayout given on the android development website.
While the RelaviveLayout should work, another option is to add a LinearLayout set to Horizontal. Set the three widgets to layout_width:"fill_parent" and give the TextView and both Buttons a weight (1 for each if you want them to equally take up three parts of the screen).
Not at a computer to test it right now, but should theoretically work.

Android and displaying multi-lined text in a TextView in a TableRow

I'm displaying a TableLayout with rows as follows:
<?xml version="1.0" encoding="utf-8"?>
<TableRow
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/one"
android:layout_marginLeft="10dip"
android:textColor="#B0171F" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/one"
android:id="#+id/two"
android:layout_marginLeft="10dip"
android:ellipsize="none"
android:singleLine="false"
android:scrollHorizontally="false"
android:maxLines="10"
android:textColor="#android:color/black" />
</RelativeLayout>
</TableRow>
I'm hitting this with everything I can find here and can think of to permit the text to wrap on many lines but to no avail: The text is always forced to a single line, running off the screen. It might matter that I'm working inside a TableRow here, and so far as I can tell this hasn't been treated on this site.
So, how do I force my second TextView to wrap to many lines?
The TextView will wrap the text if the column it's in is set to shrink. Sometimes it does not wrap exactly, if the text ends with ", ...", then it is a little bit longer than exactly n lines.
Here's an example, the TextView with the id question will wrap:
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:shrinkColumns="*">
<TableRow>
<TextView
android:id="#+id/question"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</TableRow>
</TableLayout>
For the sake of completeness, this is how my TableLayout reads in XML:
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:shrinkColumns="0"
android:stretchColumns="0"
android:id="#+id/summaryTable">
</TableLayout>
I later populate this with TableRows.
By code also works:
TableLayout tablelayout = (TableLayout) view.findViewById(R.id.table);
tablelayout.setColumnShrinkable(1,true);
1 is the number of column.
Maybe try as follows:
myTextView.setText(Html.fromHtml("On " + stringData1 + "<br> at " + strinData2);
I know, looks a bit like a "wheelchair" solution, but works for me, though I also fill a text programmatically.
You can also used below code
<TableRow >
<TextView
android:id="#+id/tv_description_heading"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:padding="8dp"
android:text="#string/rating_review"
android:textColor="#color/black"
android:textStyle="bold" />
<TextView
android:id="#+id/tv_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:maxLines="4"
android:padding="8dp"
android:text="The food test was very good."
android:textColor="#color/black"
android:textColorHint="#color/hint_text_color" />
</TableRow>

Categories

Resources