Although this looks a lot repeated question but first time for me. I searched all over and could not get the result and ended up posting here.
I am creating a table dynamically of which the TableLayout part is written in xml part.
<RelativeLayout
android:layout_width="70dp"
android:layout_height="40dp"
android:background="#color/colorPrimaryDark"
android:id="#+id/componentA">
<TableLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:gravity="center"
android:id="#+id/tl_componentA">
</TableLayout>
</RelativeLayout>
I created an object for the table
TableLayout tableLayoutA;
tableLayoutA= (TableLayout)view.findViewById(R.id.tl_componentA);
Now I tried to add a row dynamically from here onwards as
createTableRowColumn(tableLayoutA);
Functions Related are
private void createTableRowColumn(TableLayout tableLayout){
TableRow tableRow1= new TableRow(this.context);
tableRow1.setBackgroundColor(getResources().getColor(R.color.colorAccent));
setTableRowColumnProperty(tableRow1);
tableLayout.addView(tableRow1);
}
private void setTableRowColumnProperty(TableRow tableRow){
TableRow.LayoutParams layoutParams= new TableRow.LayoutParams(70, 40);
tableRow.setLayoutParams(layoutParams);
}
I did all this and nothing showed me in the emulater. But when I gave same structure in xml mannually then thing was working well.
For this reason i tried something to figure out
Toast.makeText(getContext(), tableLayoutA.getHeight()+"", Toast.LENGTH_LONG).show();
In toast it was showing me 0. I could not get why, although I have fixed the size for tableLayoutA in the xml itself.
A table in real life needs at least one row and one column.
You didn't see the table, because you only created a row, but, there were no column.
You need to add a column to the row for something to be visible.
Try this :
TextView label_date = new TextView(this);
label_date.setText("DATE");
label_date.setTextColor(Color.WHITE);
label_date.setPadding(5, 5, 5, 5);
tableRow.addView(label_date);// add the column to the table row here
tableLayout.addView(tableRow, new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));
You can replace the textView with whatever the value you want it to be.
tableLayout.addView(tableRow, new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));
Here what happens is, you say, add a view into tableLayout and you tell which view it is, and you also say the width and height of the view should wrap it's contents.
Also, specifying 40,70 is not a great idea, what happens when you have varying screen sizes. Furthermore, use a library to handle dynamic view addition and removal. You don't need to reinvent the wheel and save a lot of time and effort. For table views, https://github.com/EsotericSoftware/tablelayout might be a good one (not sure). Another question is, is table view what you are looking for? Make sure you are not mistaking recyclerView for table views, I say this because I don't understand your use case.
Useful link : https://technotzz.wordpress.com/2011/11/04/android-dynamically-add-rows-to-table-layout/
Related
I have a TableLayout which is specified in the XML, to which I add TableRows programmatically. I have to add the rows this way because I do not know the structure of the table (i.e., number of columns, etc...) until run time.
Initially, I was having a problem with the table extending off the right end of the page when there was enough data in the rows. Now I am shrinking the final column, which wraps the text in that column and causes the table to be entirely visible. However, I now have a problem where the shunk column is "taller" than the other cells it the row, which looks ugly. Here is a screen shot:
Well, apparently I'm not allowed to post an image because I do not have "10 reputation points".
I'm not sure how to get my problem across without the image. If anyone has any suggestions, I'd appreciate that.
Here is the XML that defines the TableLayout:
<TableLayout
android:id="#+id/boilingPoint"
style="#style/PhysicalPropertyTable"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
And here is the code snippet that get the table and specifies the column to shrink:
TableLayout layout = (TableLayout) findViewById(tableLayoutID);
layout.setColumnShrinkable(shrinkIndex, true);
What can I do so that the height of each cell in the row is the same as the tallest row?
Thanks in advance for any help.
I want to show a table row with three columns (TextView) but i want to divide the table row in three equal parts.
This is easily possible by setting a layoutWeightSum in TableRow in XML and making layout_weight=1 for all theww TextView.
But i adding the table at run time through java and not by xml.
All i know is the TableRow.LayoutParameter do not provide any thing for weightSum. How can i do this?
TableRow.LayoutParams pmRow = new TableRow.LayoutParams(TableRow.LayoutParams.MATCH_PARENT,
TableRow.LayoutParams.WRAP_CONTENT);
You can achieve this by following code.
TableLayout layout = //...findViewbyid
layout.setStretchAllColumns(true);
And make width 0dp to all the children (views) of TableRow like below.
<TextView
android:id="#+id/txt_no1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="hi" />
Note
Above is XML layout design, but you can create run time code also. Its just for demonstration.
I've got you covered, mate!
myTableRow.setWeightSum(float weightSum);
use pmRow.span=int value
like pmRow.span=3;
Create a LinearLayout xml (horizontal) with the three required Items ( TextViews). To add the row item at runtime, inflate the above said layout, and set text values and add it.
I am having a little bit of trouble making the table look like I intend to.
These are a few questions, but since they all refer to the picture below and the details I provide I thought they should all be in a single post.
Here is what I achieved so far:
The header row contains one element of type Button.
TableRow.LayoutParams params = new TableRow.LayoutParams(TableRow.LayoutParams.MATCH_PARENT, TableRow.LayoutParams.WRAP_CONTENT);
Button bt = new Button(getContext());
bt.setText("Column1");
mHeader.addView(bt, params);
mHeader.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT, TableRow.LayoutParams.WRAP_CONTENT));
addView(mHeader);
The rest of the table is poulated like this:
(Messagerow extends TableRow and has a TextView member)
for(int i = 0; i < 100; i++) {
MessageRow mr = new MessageRow(getContext());
// stuff to set the TexView text and color
mr.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT, TableRow.LayoutParams.WRAP_CONTENT));
this.addView(mr);
}
1. How can I make the header row height be more like the rows?
2. How can I make the button occupy the full width of the row?
If the table is empty, no text rows just header, then the button matches the row width. As soon as I add a row of text, the column width is adapted but the button width is not.
3. How can I make the row fill the screen width? (MATCH_PARENT does not do it)
4. How can I draw a thin line between the table rows?
I tried to override the onDraw() function on MessageRow, but it never gets called, not even once.
Don't get me wrong. I am not asking that you do my work for me. These are issues I tried to solve by myself and googled them and read similar posts, but did not find an answer.Note: I find that UI design in Javascript for Android lacks clear control and clear documentation over all these little details.
Edit
This is how I create the table:
TableLayout mTable = new TableLayout(this);
HorizontalScrollView hview = (HorizontalScrollView) findViewById(R.id.hscroll);
populate(mTable);
mTable.setLayoutParams(new TableLayout.LayoutParams( TableLayout.LayoutParams.MATCH_PARENT, TableLayout.LayoutParams.WRAP_CONTENT));
mTable.setBackgroundColor(Color.WHITE);
hview.addView(mTable);
How can I make the header row height be more like the rows?
Using the default Button there isn't much to do. The Button uses a nine-patch image that has some space between the button's text and the borders that you see. You could use a smaller font but that you'll probably look ugly. Another thing to try is using your own background for the Button and get rid of the default extra space(of the default nine-patch image) so the final height is near the height of the text from the TextViews. Or try to enforce a standard height for all rows using a fixed value.
How can I make the button occupy the full width of the row?
I think that you have more then one TextView in MessageRow so when you add the Button it moves to the first column(corresponding to the first TextView). If this is the case, make your Button span across the number of columns representing the number of TextViews in MessageRow:
TableRow.LayoutParams params = new TableRow.LayoutParams(TableRow.LayoutParams.MATCH_PARENT, TableRow.LayoutParams.WRAP_CONTENT);
params.span = 3; // if you have 3 `TextView` in the MessageRow
Button bt = new Button(getContext());
bt.setText("Column1");
mHeader.addView(bt, params);
If this is not the case add more details.
How can I make the row fill the screen width? (MATCH_PARENT does not do it)
As I said on one of your previous questions, I don't know why that happens(but I gave you some solutions there to overcome this issue). Also:
mHeader and the other MessageRow are children of a Tablelayout and the correct LayoutParams to use on them is the LayoutParams of the parent: TableLayout.LayoutParams and not TableRow.LayoutParams.
You add some TextView in the MessageRow(from what I seen in your previous questions), add those child views with TableRow.LayoutParams to MessageRow.
You use only WRAP_CONTENT for your LayoutParams everywhere in your code, you might want to set the width(the first parameter in the constructor) to FILL_PARENT/MATCH_PARENT
How can I draw a thin line between the table rows?
You could use a simple View that will act as a separator:
for(int i = 0; i < 100; i++) {
MessageRow mr = new MessageRow(getContext());
// stuff to set the TexView text and color
mr.setLayoutParams(new TableLayout.LayoutParams(TableLayout.LayoutParams.FILL_PARENT, TableLayout.LayoutParams.WRAP_CONTENT));
this.addView(mr);
View separator = new View(getContext());
separator.setLayoutParams(new TableLayout.LayoutParams(TableLayout.LayoutParams.FILL_PARENT, 3)));
separator.setBackgroundColor(Color.RED);
this.addView(separator);
}
Because you have 100 rows you could try to set a drawable with a separator line as the background for theTableRow(header and MessageRow) instead of the above method that adds another 100 Views to the layout.
Extra Note:
You have a lot of views to add to a single activity layout, you are talking about 100 rows, and if your MessageRow is more complex than a simple TextView(and I think it is) you could get in some performances problems. I suggest you take a look at the wonderful ListView widget.
Don't have a programming environment here, but I'll try and answer some of your questions.
The reason your header row (button) is taller than your test based rows is because the button requires more space and the row accomodates it. The default button has padding on both the top/bottom of the text. I think your best option is to create your own button, which gives you the additional benefit of being able to control the look and feel. It seems like other people have had this issue before: Can't get rid of bottom padding on button
Your button is set to wrap_content which means it won't be any bigger than it needs to be (It will grow/shrink so it can fit the text "Column1" or whatever you put there). Instead of making the Button WRAP, I suspect you'll need to make it FILL_PARENT.
It's not your Table Row that needs to fill the screen width, it's your table that needs to fill the screen. Wherever you define your table, it's probably set to WRAP_CONTENT for the Horizontal dimension. Set it to FILL_PARENT and your table should expand to the full width of whatever it's container is (In this case, it should expand the full width of the screen)
There are probably several different ways you can do this. One method I used somewhat recently is to utilize the View tag which essentially looks like a horizontal bar across the screen. Below is a link to how to implement it.
http://sonnygill.net/android/horizontal-rule/
i have create my own View and ViewGroup. The ViewGroup is a LinearLayout that includes a dynamic TableView. I add two rows, but only one is displayed. The first Row take the full height.
The Destination on Run is this Output:
But i need this:
Perfectly, the cells are square and the Bottom is unused.
Like this:
I have uploaded the stylized code
I hope someone can help me.
Sry, i cant include the images directly because: "We're sorry, but as a spam prevention mechanism, new users aren't allowed to post images. Earn more than 10 reputation to post images."
And the image Urls i have included as text because: "We're sorry, but as a spam prevention mechanism, new users can only post a maximum of two hyperlinks. Earn more than 10 reputation to post more hyperlinks."
Thank you
I dont know more about creating table by code but same problem i feel while creating the table from XMl file. In that time i have solved the problem by using height-width of linear layout with fill parent option.
Or U can Use Relative Layout instead of the Linear Layout and try it. May be it helps u.
Try setting the weights this way.
float rowWeight = 1/noOfColumns;
TableRow.LayoutParams mCellLayoutParams = new TableRow.LayoutParams(TableRow.LayoutParams.FILL_PARENT, TableRow.LayoutParams.FILL_PARENT, rowWeight );
mCellLayoutParams.setMargins(5, 5, 5, 5);
I am trying to display a SpreadSheet in the Android application with auot adjustable columns and each columns should surrounded by lines.I used the Table Layout the data are displayed in the Table format but i dont know how to surround each column with lines, auto adjustment.If anyone knows it please help me.
You can set a background color for the TableLayout and give your TableRows a margin:
<TableLayout android:background="#000000">
<TableRow android:background="#ffffff" android:layout_margin="3dip">
<!-- etc. -->
I open-sourced an elementary spreadsheet I wrote here:
https://github.com/dennis-sheil/android-spreadsheet
One elementary features it does not have yet:
You can load Microsoft Excel pre-2007 (.xls) files, but not Excel 2007/2010 (.xlsx) files. This is the feature I have been stuck on implementing for a while. There is a codebase (POI) out there to do this, but there are complexities to implementing it.
I have found this article with a Spreadsheet layout example. Maybe it can be helpful to someone too. But it is just an example, still need to update it for general purpose.
http://www.codeofaninja.com/2013/08/android-scroll-table-fixed-header-column.html
Use TableLayout.LayoutParams or TableRow.LayoutParams. They inherit ViewGroup.MarginLayoutParams, which you seem to need.
A sample code with TableRow.LayoutParams could be:
// you can also init values for width, height and weight here
TableRow.LayoutParams params = new TableRow.LayoutParams();
params.setMargins(LEFT_MARGIN, TOP_MARGIN, RIGHT_MARGIN, BOTTOM_MARGIN);
TextView textView = new TextView(this);
textView.setText("I'm in the table");
TableRow row = new TableRow();
row.addView(textView, params);
The same principle could be applied with TableLayout.LayoutParams, when you add to the table layout.