I got some trouble with the TableLayout Android. I wanna create a table with symmetric rows/columns, i.e. a layout where every TextView in it gets allocated exactly the same amount of space like all the others, no matter what text has been appended to it.
It's important that this can be done by the use of Java-code, not the XML-files.
It would be probably good to know that this layout requires two tables to be next to each other, i.e. every table has just 50% of the screen size. I suppose this makes several LayoutParameter unavailable (e.g. FILL_PARENT)?
This is what I tried:
for (String s : buffer) {
TextView tv = new TextView(this);
tv.setLayoutParams(new TableRow.LayoutParams(0x00, LayoutParams.WRAP_CONTENT, 1f));
tv.append(s);
row.addView(tv, new TableRow.LayoutParams(LayoutParams.FILL_PARENT));
}
Still looks bad though.
This will create two columns that share's the width in an orderly fashion.
<TableLayout android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TableRow>
<!-- Set the width to 0dp and set layout_weight=1! on both Views-->
<TextView
android:text="This is text1, its pretty long but that shouldn't be a problem"
android:layout_marginLeft="1px"
android:background="#ff0000"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content" />
<TextView
android:text="Shorter"
android:background="#00ff00"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content" />
</TableRow>
</TableLayout>
Edit: Same thing, but now in code:
TableLayout layout = new TableLayout(this);
TextView t1 = new TextView(this);
t1.setBackgroundColor(Color.BLUE);
t1.setText("This is text1, its pretty long but that shouldn't be a problem");
TextView t2 = new TextView(this);
t2.setBackgroundColor(Color.GRAY);
t2.setText("Shorter");
TableRow row = new TableRow(this);
row.addView(t1, new TableRow.LayoutParams(0, LayoutParams.WRAP_CONTENT, 1f));
row.addView(t2, new TableRow.LayoutParams(0, LayoutParams.WRAP_CONTENT, 1f));
layout.addView(row);
Related
Adding text view to row and thus row to table layout. But the row gets cut from the screen.
TextView point = new TextView(activity);
TextView time = new TextView(activity);
point.setTextSize(15);
time.setTextSize(15);
point.setPadding(5, 5, 5, 5);
time.setPadding(5, 5, 5, 5);
point.setText("smthing something")
time.setText("smthing smthing")
row.addView(point);
row.addView(time);
tableLayout.addView(row);
How to wrap the textview in the row so that the row gets wrapped in the screen itself..?
Set your textView height wrap_content.
point.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
Thanks Mukesh, that solved most of the part of my problem. :) The text crossing the screen got wrapped inside screen.
Since my first column contained long text and second column has short text.. So first column must fit in multiple lines and 2nd column in single line. (Setting the textview to single line or multiple line didnt help)
So I did it by adding shrink column to my '0th' and stretch column to my '1st'. This solved my whole problem and setting layout params also not required now.
XML for table layout:
<TableLayout
android:id="#+id/route_table"
android:layout_width="match_parent"
android:shrinkColumns="0"
android:padding="5dp"
android:stretchColumns="1">
<TableRow android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/row1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/stop"
android:background="#drawable/table_row"
android:padding="10dp"
android:text="Stop: "/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/time"
android:layout_gravity="right"
android:background="#drawable/table_row"
android:padding="10dp"
android:text="Time: "/>
</TableLayout>
`
TextView point = new TextView(activity);
TextView time = new TextView(activity);
LayoutParams layoutParams = new TableRow.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
point.setLayoutParams(layoutParams);
time.setLayoutParams(layoutParams);
point.setTextSize(15);
time.setTextSize(15);
point.setPadding(5, 5, 5, 5);
time.setPadding(5, 5, 5, 5);
point.setText("smthing something")
time.setText("smthing smthing")
row.addView(point);
row.addView(time);
tableLayout.addView(row);
I know this has been asked several times over, but can't seem to get it to work correctly in my situation. I am trying to get the last column to align right in a table that is generated programatically. I know I need to apply the LayoutParams to the row and all the inner children, and I know that I need to set the Gravity to the TextView, not the row, but I have tried all the permutations I can think of and can't seem to get the last column to align right.
Here is my XML layout:
<!--Open Hours-->
<LinearLayout
android:id="#+id/llOpenHourDetail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/llWebsiteDetail"
android:paddingBottom="10dp"
android:visibility="gone"
android:weightSum="4">
<TextView
android:id="#+id/tvOpenHourDetailIcon"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="#string/fa_clock"
android:textColor="#color/cp_blue" />
<TableLayout
android:id="#+id/tlOpenHoursDetail"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3" />
</LinearLayout>
And then in my activity I have the following code in a loop
String currentPeriod = formattedOpen.format(open.getTime()) + " - " +
formattedClose.format(close.getTime());
TableRow.LayoutParams params = new TableRow.LayoutParams(
TableRow.LayoutParams.MATCH_PARENT,
TableRow.LayoutParams.MATCH_PARENT );
TableRow tableRow = new TableRow(getBaseContext());
tableRow.setLayoutParams(params);
TextView tvDayOfWeek = new TextView(getBaseContext());
tvDayOfWeek.setText(open.getDisplayName(
Calendar.DAY_OF_WEEK, Calendar.LONG, Locale.getDefault()));
tvDayOfWeek.setTextColor(getResources().getColor(R.color.black));
tvDayOfWeek.setLayoutParams(params);
tableRow.addView(tvDayOfWeek);
TextView tvPeriodHours = new TextView(getBaseContext());
tvPeriodHours.setText(currentPeriod);
tvPeriodHours.setTextColor(getResources().getColor(R.color.black));
tvPeriodHours.setGravity(Gravity.RIGHT);
tvPeriodHours.setLayoutParams(params);
tableRow.addView(tvPeriodHours);
tlOpenHoursDetail.addView(tableRow);
In order for setGravity() to work you must first modify the width field of yourTextView as follows in your layout:
android:layout_width="fill_parent"
Now you should be able to call:
tvPeriodHours.setGravity(Gravity.RIGHT)
I think there are two ways of doing this.
If your TableLayout has a width not based on it's contents (such as if the columns widths are set using android:stretchColumns) you can set the TextView width to match_parent and then assign the gravity on the TextView using textView.setGravity(Gravity.END).
If your TextView width is smaller than the bounds of the TableLayout cell you can call the gravity on the TableRow instead using tableRow.setGravity(Gravity.END).
I have a TableLayout where my TextViews fill the width of the cell but not the height so I'm using:
textView.setGravity(Gravity.CENTER);
tableRow.setGravity(Gravity.CENTER_VERTICAL);
To get my text in the very centre of the cell.
In case it helps anyone, I have spent ages trying to get the TextView aligned to the bottom of the cell but nothing seems to work, including tableRow.setGravity(Gravity.CENTER_VERTICAL), no idea why but I have given up and in the centre is fine.
I have an XML layout containing a EditText and 2 buttons. If I click on the plus button, a new edittext is programatically added. This works, but the edittext looks different. According to the XML the edittext defined in XML does not have any special attributes, so I believe its not a particular layout setting.
My question is how do I make my programmatically added EditText's look the same?
The EditText's containing the numbers are my programmatically added edittext's. The empty ones are creating in the XML.
(source: tozz.nl)
Code:
LinearLayout baseLayout = (LinearLayout) findViewById(R.id.baseLayout);
LinearLayout linearLayout = new LinearLayout(getApplicationContext());
linearLayout.setId(100 + numPlayers);
linearLayout.setOrientation(LinearLayout.HORIZONTAL);
EditText editText = new EditText(getApplicationContext());
editText.setText(editText.toString().substring(25, 30));
ImageButton delButton = new ImageButton(getApplicationContext());
delButton.setImageResource(R.drawable.ic_delete);
linearLayout.addView(editText);
linearLayout.addView(delButton);
baseLayout.addView(linearLayout);
My XML is as following:
<LinearLayout
android:id="#+id/linearPlayer1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<EditText
android:id="#+id/editPlayer1"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center_vertical" />
<ImageButton
android:id="#+id/addPlayer1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_input_add" />
</LinearLayout>
Luksprog answered my question:
pass the Activity Context and not the Application Context when creating the new views.
Adding those views with the correct LayoutParams should make the EditText be like the initial one from the layout:
linearLayout.addView(editText, new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,
LinearLayout.LayoutParams.WRAP_CONTENT, 1.0f));
linearLayout.addView(delButton, new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,
LinearLayout.LayoutParams.WRAP_CONTENT));
baseLayout.addView(linearLayout, new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT,
LinearLayout.LayoutParams.WRAP_CONTENT));
I have following UI hierarchy
Scroll View -->TableLayout-->Rows [each row has TextView+EditText]
Problem
Inside a row, each View should not exceed 50% of width of parent (TableRow). if an EditText is created to enter, say Username with max characters N; then width of EditText ideally should be exactly N chars long but must not exceed 50% limit.
I've tried many permutations and combination and could not get it right so far.
I have to do it programmatically as per the project requirement.
thanks.
Try using layout weight like this:
<TableRow
android:id="#+id/tableRow1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/textview1"
android:layout_width="0px"
android:layout_height="wrap_content"
android:layout_weight="1">
</TextView>
<EditText
android:layout_width="0px"
android:layout_height="wrap_content"
android:layout_weight="1" >
</EditText>
</TableRow>
To do it programmatically, try using LayoutParams to accomplish the same like this:
TableLayout table = (TableLayout) findViewById(R.id.TableLayout1);
TableRow tr = new TableRow(this);
TableLayout.LayoutParams trparams = new TableLayout.LayoutParams(TableLayout.LayoutParams.MATCH_PARENT, TableLayout.LayoutParams.WRAP_CONTENT);
tr.setLayoutParams(trparams);
textview1 = new TextView(this);
edittext1 = new EditText(this);
TableRow.LayoutParams fieldparams = new TableRow.LayoutParams(0, LinearLayout.LayoutParams.WRAP_CONTENT, 1.0f);
tr.addView(textview1, fieldparams);
tr.addView(edittext1, fieldparams);
table.addView(tr);
i saw your comment to ask's answers.i think you can set the width of edittext or textview as wrap content.and set the max width property of those controls as 50% of the screen.then it's width will not exceed the 50% of the parent width.
I had to scrap TableLayout in order to be my own layouts effective. Layout params in TableRows seems ineffective. LinearLayout looks more flexible.
Now I have following Layout hierarchy and it works.
Scroll View -->LinearLayout instead of TableLayout--> [Individual fields encapuslated in LinearLayout instead of TableRows]
Can't seem to find any examples of this being done from the activity. I can get the table row added to the table layout, but it doesn't line up with the existing columns that were set up in the axml. All I want is to have my header row set up in axml and then dynamically add to it from the activity.
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scannedLO"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below ="#id/addPart"
android:layout_marginTop="20dip"
android:stretchColumns="3">
<TableRow android:layout_marginBottom ="10dip">
<TextView
android:layout_column="1"
android:text="Item Number"
android:padding="3dip"
android:layout_margin="2dip"/>
<TextView
android:layout_column="2"
android:text="Item Description"
android:padding="3dip"
android:layout_margin="2dip"/>
<TextView
android:layout_column="3"
android:text="Qty"
android:padding="3dip"
android:layout_margin="2dip"
android:lines="1"/>
</TableRow>
When I do this in my activity:
TableLayout tl = (TableLayout)FindViewById(Resource.Id.scannedLO);
TableRow tr = new TableRow(this);
TextView itemNumber = new TextView(this);
TextView itemDescription = new TextView(this);
TextView itemQuantity = new TextView(this);
TableRow.LayoutParams trparam = new TableRow.LayoutParams();
trparam.Span = 3;
itemNumber.Text = partnum;
itemDescription.Text = partdescr;
itemQuantity.Text = partquan;
tr.AddView(itemNumber);
tr.AddView(itemDescription);
tr.AddView(itemQuantity);
tl.AddView(tr);
All 3 of my textviews end up in the first column.
The setLayoutParams() method in Java maps to the LayoutParameters property in C#.
row.LayoutParameters = ViewGroup.LayoutParams.FillParent;
In general, when translating from Java to C#, getter/setter methods in Java are mapped to properties in C#. For example, getText() / setText() in Java will usually map to a property named Text in C#.
Edit (based on your updated question):
The problem is that you're setting the column for each TextView in the XML, but you're not doing that in code:
itemNumber.LayoutParameters = new TableRow.LayoutParams(1);
itemDescription.LayoutParameters = new TableRow.LayoutParams(2);
itemQuantity.LayoutParameters = new TableRow.LayoutParams(3);
After doing that the views should go in the proper columns. They won't line up perfectly, since in the XML you're applying padding and margin, but are not doing that in code either. I'd suggest creating reusable styles for the cells instead of redefining those everywhere.