How does addView() of TableRow work? - android

I tried
private void addSnapPictureRow(TableLayout table, Bitmap bitmap) {
/*
* 1st row = TextView (Check In)
*/
TableRow row = new TableRow(this);
row.setGravity(Gravity.CENTER_HORIZONTAL);
// add text
TextView text = new TextView(this);
text.setText("Snap Picture");
TableRow.LayoutParams textLayoutParams = new TableRow.LayoutParams(TableRow.LayoutParams.MATCH_PARENT, TableRow.LayoutParams.WRAP_CONTENT);
textLayoutParams.setMargins(100, 0, 0, 0);
row.addView(text, textLayoutParams);
// add picture
ImageView picture = new ImageView(this);
picture.setImageResource(R.drawable.adium);
row.addView(picture);
/*
* 2nd row = View (separator)
*/
TableRow separator = new TableRow(this);
View line = new View(this);
TableRow.LayoutParams separatorLayoutParams = new TableRow.LayoutParams(TableRow.LayoutParams.MATCH_PARENT, 1);
separatorLayoutParams.setMargins(100, 0, 0, 0);
line.setBackgroundColor(Color.BLUE);
separator.addView(line, separatorLayoutParams);
// add row to table
table.addView(row);
// add a separator
table.addView(separator);
}
But the picture never showed. If I change the gravity to CENTER_HORIZONTAL, then it shows only a small part of the picture.
When create table with xml, I thought it automatically aligned horizontally. I can't understand how TableRow layout works. Could anyone shed me some lights on this?

Adding an extra LinearLayout for each row solved my problem ;). The algignment of the previous row cause the picture go out of screen.
private void addSnapPictureRow(TableLayout table, Bitmap bitmap) {
/*
* 1st row = TextView (Check In)
*/
TableRow row = new TableRow(this);
LinearLayout outerLayout = new LinearLayout(this);
// add text
TextView text = new TextView(this);
text.setText("Snap Picture");
LinearLayout.LayoutParams textLayoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
textLayoutParams.setMargins(100, 0, 0, 0);
// add picture
ImageView picture = new ImageView(this);
LinearLayout.LayoutParams pictureLayoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
picture.setImageResource(R.drawable.adium);
pictureLayoutParams.setMargins(20, 0, 0, 0);
outerLayout.addView(text, textLayoutParams);
outerLayout.addView(picture, pictureLayoutParams);
row.addView(outerLayout);
/*
* 2nd row = View (separator)
*/
TableRow separator = new TableRow(this);
View line = new View(this);
TableRow.LayoutParams separatorLayoutParams = new TableRow.LayoutParams(400, 1);
separatorLayoutParams.setMargins(100, 0, 0, 0);
line.setBackgroundColor(Color.BLUE);
separator.addView(line, separatorLayoutParams);
// add row to table
table.addView(row);
// add a separator
table.addView(separator);
}

Related

Programmatically set ImageButton margins

I have create a lot of image button like this code:
TableRow tr = new TableRow(this);
if (db != null) {
if (db.moveToFirst()) {
do {
ImageButton button = new ImageButton(this);
int ID = Integer.parseInt(db.getString(db.getColumnIndex("ID")));
int resource = getResources().getIdentifier("unit" + ID, "drawable", getPackageName());
System.out.println("unit" + ID + ":" + resource);
button.setImageResource(resource);
button.setOnClickListener(MainActivity.this);
tr.addView(button);
button.getLayoutParams().height = 250;
button.getLayoutParams().width = 250;
button.setScaleType(ImageView.ScaleType.FIT_CENTER);
//button.setLayoutParams(tableRowParams);
rowcount++;
if (rowcount % 5 == 0) {
layout.addView(tr);
tr = new TableRow(this);
}
} while (db.moveToNext());
}
}
And I found code:
TableLayout.LayoutParams tableRowParams = new TableLayout.LayoutParams(TableLayout.LayoutParams.WRAP_CONTENT, TableLayout.LayoutParams.WRAP_CONTENT);
tableRowParams.setMargins(0, 0, 0, 0);
and apply in button at the do while.
button.setLayoutParams(tableRowParams);
It will show the error message "android.widget.TableLayout$LayoutParams cannot be cast to android.widget.TableRow$LayoutParams"
Replace TableLayout.LayoutParams with TableRow.LayoutParams:
TableRow.LayoutParams tableRowParams =
new TableRow.LayoutParams(
TableRow.LayoutParams.WRAP_CONTENT,
TableRow.LayoutParams.WRAP_CONTENT);
tableRowParams.setMargins(0, 0, 0, 0);
The type of LayoutParams that you use is determined by the container of the view, not the view itself. So since your button is going inside a TableRow you need to use TableRow.LayoutParams rather than TableLayout.LayoutParams as you have it now.
Also, just so you're aware, if you need to style your TableRow or Button, rather than creating a new instance of the class and seeing the margins that way, you can inflate an XML layout using Button button = (Button) LayoutInflater.from(context).inflate(R.layout.button, tr, false); and that way you can set the margins in the XML file.

Android dynamic table creation with ImageView and TextView design with date at parent right

I am not able to put two textview's to the right of ImageView and aligning the date to parent right is also getting difficult for me in dynamic creation. someone who have knowledge on this please help me. Design should be DYNAMIC.
tl = (TableLayout) view.findViewById(R.id.mainLayout);
TableRow row2 = new TableRow(getContext());
row2.setLayoutParams(new TableRow.LayoutParams(200, 230, 280));
TableLayout posterInfoTable = new TableLayout(getContext());
posterInfoTable.setBackgroundResource(R.drawable.whitegrey);
posterInfoTable.setLayoutParams(new TableLayout.LayoutParams(TableRow.LayoutParams.FILL_PARENT, 250));
TableRow posterNameRow = new TableRow(getContext());
TableLayout.LayoutParams lp = new TableLayout.LayoutParams(TableLayout.LayoutParams.FILL_PARENT, TableLayout.LayoutParams.WRAP_CONTENT);
lp.setMargins(0, 0, 30, 0);
posterNameRow.setHorizontalGravity(Gravity.LEFT);
posterNameRow.setLayoutParams(lp);
ImageView posterImage = new ImageView(getContext());
posterImage.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT, TableRow.LayoutParams.WRAP_CONTENT));
posterImage.setMaxHeight(100);
posterImage.setMaxWidth(100);
Picasso.with(getContext())
.load(R.drawable.dummyimage2)
.placeholder(R.drawable.dummyimage2)
.error(R.drawable.dummyimage2)
.transform(new RoundedTransformation(50, 4))
.resizeDimen(R.dimen.list_detail_image_size, R.dimen.list_detail_image_size)
.centerCrop()
.into(posterImage);
posterNameRow.addView(posterImage);
final TableRow nameRow = new TableRow(getContext());
nameRow.setPadding(40, 0, 0, 0);
nameRow.setLayoutParams(new TableLayout.LayoutParams(250, 100));
nameRow.setTag(db_id);
TextView posterName = new TextView(getContext());
posterName.setText(postman);
posterName.setTextColor(Color.BLACK);
posterName.setTextSize(18);
posterName.setPadding(10, 0, 0, 0);
posterName.setWidth(240);
// posterName.text
posterNameRow.addView(posterName);
TextView dateview = new TextView(getContext());
dateview.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT, TableRow.LayoutParams.WRAP_CONTENT))
dateview.setText(date);
dateview.setPadding(50, 0, 0, 5);
dateview.setTextColor(Color.DKGRAY);
dateview.setTextSize(10);
dateview.setWidth(300);
dateview.setGravity(Gravity.RIGHT);
nameRow.addView(dateview);
posterInfoTable.addView(posterNameRow);
posterInfoTable.addView(nameRow);
// posterInfoTable.addView(dateRow);
row2.addView(posterInfoTable, new TableRow.LayoutParams(TableRow.LayoutParams.FILL_PARENT, 200));
// row2.addView(dateview);
tl.addView(row2, new TableLayout.LayoutParams(TableRow.LayoutParams.FILL_PARENT, 200));
you do not need to create all views dynamically. Create XML with your item-layout. try this:
void addNewRow(YourData data) {
View v = getLayoutInflater().inflate(R.layout.your_item, null);
RelativeLayout rl = (RelativeLayout) v; //or other...
TextView textView1 = (TextView) rl.findViewById(R.id.textV1);
ImageView imageView1 = (ImageView) rl.findViewById(R.id.imageV1);
textView1.setText(data.name);
imageView.setImageResource(data.imageRes);
tableLayout.addView(rl);
}

How to get row to extend for full width of the table in Android

I followed the example at https://stackoverflow.com/a/7123217/2884981 but unfortunately, the row is not extending for the full width of the table (see how the black "border"/background is so large on the right while it's only 1px wide everywhere else).
I want the second column to extend, so it's taking up all the available space to the right.
Here is the code I am using. Please, if anyone knows how I can get that right "border" to 1px instead of it looking so awful, let me know.
for (int i = 0; i < tasks.size(); i++)
{
TaskDetail taskDetail = tasks.get(i);
TableRow row = new TableRow(this);
// Set the background/border colour to black
row.setBackgroundColor(Color.BLACK);
row.setPadding(1, 1, 1, 1);
TableRow.LayoutParams layoutParams = new TableRow.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);
layoutParams.setMargins(0,0,1,0);
LinearLayout detailCell = new LinearLayout(this);
detailCell.setBackgroundColor(Color.parseColor("#FFE6F0"));
detailCell.setLayoutParams(layoutParams);
LinearLayout valueCell = new LinearLayout(this);
valueCell.setBackgroundColor(Color.WHITE);
valueCell.setLayoutParams(layoutParams);
TextView detailName = new TextView(this);
detailName.setTextSize(TypedValue.COMPLEX_UNIT_SP, 18);
detailName.setText(taskDetail.getName());
detailName.setPadding(5, 10, 5, 5);
detailName.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));
TextView valueName = new TextView(this);
valueName.setTextSize(TypedValue.COMPLEX_UNIT_SP, 18);
valueName.setText(taskDetail.getValue());
valueName.setPadding(5, 10, 5, 5);
valueName.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));
detailCell.addView(detailName);
valueCell.addView(valueName);
// Add to the screen layout
row.addView(detailCell);
row.addView(valueCell);
table.addView(row);
}
Set weight to be 1.0f for each column in the row as follows:
TableRow.LayoutParams layoutParams = new TableRow.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT, 1.0f);
Simply make changes as follows:
...
...
row.setPadding(1, 1, 1, 1);
TableRow.LayoutParams layoutParams = new TableRow.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT, 1.0f);
layoutParams.setMargins(0,0,1,0);
LinearLayout detailCell = new LinearLayout(this);
...
...

How to dynamically add components

I have to display a grid of pictures taken from the database. Depending on the screen size of the user, I want to show more or less pictures.
1) How to change the number of pictures shown dynamically according to the number of pics from the database?
1a) Which layout would be adequate?
2) If there are more pictures than that can fit on a single screen, obviously it has to be scrolled. How do I define a page wise scrolling instead of scrolling little by little, meaning after each scrolling, next page will have all new members (just like we scroll Applications in Android)
At the moment, I have a TabHost layout for the main Activity and a LinearLayout for the grid type display activity.
I am using API version 10, so GridLayout is not available.
Any suggestions would be very helpful. Thanks in advance.
1) How to change the number of pictures shown dynamically according to the number of pics from the database?
As far as this part is concerned use a for loop based on the number of pics available in your database, the only thing you need is to know the number of elements present in your database, which you then use as I have used numberOfElements here
for(int i = 1; i <= numberOfElements ; i++) {
LinearLayout lHor = new LinearLayout(this);
lHor.setOrientation(LinearLayout.HORIZONTAL);
//lHor.setBackgroundColor(Color.rgb(238, 233, 191));
// Text View
TextView tv = new TextView(this);
tv.setText("FAULT "+i);
tv.setTextSize(20);
// tv.setGravity(Gravity.CENTER);
tv.setTextColor(Color.rgb(255,255,255));
tv.setPadding(12, 12, 12, 12);
tv.setId(i);
tv.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1.0f));
lHor.addView(tv); // Adding the TextView to the LinearLayout
//CheckBox
CheckBox cb = new CheckBox(this);
cb.setId(i);
cb.setTag("CheckBox");
cb.setClickable(false);
// cb.setChecked(true);
cb.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1.0f));
cb.setGravity(Gravity.CENTER);
checkBoxes.add(cb);
lHor.addView(cb);
l.addView(lHor);
}
You might already know how to get the number of elements in your database, if not I used this
// Method 3: Getting total number of entries present in the database
public int getTotalNumberOfEntries() {
String[] columns = new String[]{ KEY_ROWID, KEY_TYPE, KEY_DATE};
Cursor c = myDataBase.query(DATABASE_TABLE, columns, null, null, null, null, null);
int count = 0;
for (c.moveToFirst(); !c.isAfterLast(); c.moveToNext()) {
count++;
}
c.close();
return count;
}
========== EDIT ================
You can call this method in your onCreate() method of your activity
private void setDynamicContentViewOfThisPage() {
// Defining the Scroll View and the LinearLayout
ScrollView sv = new ScrollView(this);
LinearLayout l = new LinearLayout(this);
l.setOrientation(LinearLayout.VERTICAL);
sv.addView(l);
// You will need to collect data from the previous Intent :-)
TextView introduction = new TextView(this);
introduction.setText("Set Text Here");
introduction.setGravity(Gravity.LEFT);
introduction.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT));
l.addView(introduction);
Button instructionsButton = new Button(this);
instructionsButton.setTag("Some Button");
instructionsButton.setId(987654321); // Random ID set to avoid conflicts :-D
instructionsButton.setText("Click to read all the instructions");
instructionsButton.setGravity(Gravity.CENTER);
instructionsButton.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT));
l.addView(instructionsButton);
instructionsButton.setOnClickListener(this);
// Creates a line
TableLayout tl1 = new TableLayout(this);
View v1 = new View(this);
v1.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.FILL_PARENT, 1));
v1.setBackgroundColor(Color.rgb(51, 51, 51));
tl1.addView(v1);
l.addView(tl1);
// Version 2 (Creating Different Layouts)
for(int i = 1; i <= 3 ; i++) {
// Creates a line
TableLayout tl2 = new TableLayout(this);
View v2 = new View(this);
v2.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.FILL_PARENT, 1));
v2.setBackgroundColor(Color.rgb(51, 51, 51));
tl2.addView(v2);
l.addView(tl2);
LinearLayout lHor = new LinearLayout(this);
lHor.setOrientation(LinearLayout.HORIZONTAL);
//lHor.setBackgroundColor(Color.rgb(238, 233, 191));
LinearLayout lVer1 = new LinearLayout(this);
lVer1.setOrientation(LinearLayout.VERTICAL);
lVer1.setGravity(Gravity.RIGHT);
lVer1.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1.0f));
// Text View
TextView tv = new TextView(this);
tv.setText("TV "+i);
tv.setTextSize(20);
// tv.setGravity(Gravity.CENTER);
tv.setTextColor(Color.rgb(255,255,255));
tv.setPadding(12, 12, 12, 12);
tv.setId(i);
// tv.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1.0f));
lVer1.addView(tv); // Adding the TextView to the LinearLayout
//CheckBox
CheckBox cb = new CheckBox(this);
cb.setClickable(false);
// cb.setChecked(true);
cb.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1.0f));
cb.setGravity(Gravity.CENTER);
lVer1.addView(cb);
lHor.addView(lVer1);
LinearLayout lVer = new LinearLayout(this);
lVer.setOrientation(LinearLayout.VERTICAL);
lVer.setGravity(Gravity.RIGHT);
lVer.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1.0f));
Button showsomeOtherButton = new Button(this);
showsomeOtherButton.setTag("showSomeButton");
showsomeOtherButton.setId(i);
showsomeOtherButton.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1.0f));
showsomeOtherButton.setText("View Image");
// showsomeOtherButton.setEnabled(false);
lVer.addView(showsomeOtherButton);
Button someOtherDataButton = new Button(this);
someOtherDataButton.setId(i);
someOtherDataButton.setTag("someOtherButton");
someOtherDataButton.setText("Do this action " + i);
// someOtherDataButton.setEnabled(false);
someOtherDataButton.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1.0f));
lVer.addView(someOtherDataButton);
showsomeOtherButton.setOnClickListener(this);
someOtherDataButton.setOnClickListener(this);
lHor.addView(lVer);
l.addView(lHor);
// Creates a line
TableLayout tl3 = new TableLayout(this);
View v3 = new View(this);
v3.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.FILL_PARENT, 1));
v3.setBackgroundColor(Color.rgb(51, 51, 51));
tl3.addView(v3);
l.addView(tl3);
}
// Creates a line
TableLayout tl3 = new TableLayout(this);
View v3 = new View(this);
v3.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.FILL_PARENT, 1));
v3.setBackgroundColor(Color.rgb(51, 51, 51));
tl3.addView(v3);
l.addView(tl3);
Button nextPageButton = new Button(this);
nextPageButton.setTag("goToNExtPageButton");
nextPageButton.setId(98765432);
nextPageButton.setText("Go To Next Page");
nextPageButton.setGravity(Gravity.CENTER);
//nextPageButton.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
LinearLayout.LayoutParams layoutParams=new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
layoutParams.gravity=Gravity.CENTER;
nextPageButton.setLayoutParams(layoutParams);
l.addView(nextPageButton);
// Set the content View to this
this.setContentView(sv);
}
}
I solved the problem by using a LinearLayout. I dynamically added views to it using:
LinearLayout parentLayout = (LinearLayout) findViewById(R.id.parentLayout);
TextView ChildView = new TextView(getApplicationContext());
ChildView.setText("I am the child");
parentLayout.addView(ChildView);
I loop upto the available view as suggested by Sumit.
I had to enclose the whole activity's layout into a ScrollView and it made up for the invisible children in the dynamic layout

Android: How to create such layout dynamicaly (not by xml)?

In My application i want to create the layout as like below image:
So How to make it possible ?
I have done Something like below code:
public void showResult()
{
List<TextView> textListWord = new ArrayList<TextView>(tempEmployerList.size());
List<TextView> textListAnswer = new ArrayList<TextView>(tempEmployerList.size());
List<TextView> imageListAnswer = new ArrayList<TextView>(tempEmployerList.size());
for(int i = 0; i<=tempEmployerList.size()-1; i++)
{
LinearLayout innerLayout = new LinearLayout(this);
innerLayout.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.WRAP_CONTENT));
innerLayout.setBackgroundColor(0x00000000);
// set the Multiple TextView
TextView mHeading = new TextView(getApplicationContext());
TextView middleValue = new TextView(getApplicationContext());
TextView aImageView = new TextView(getApplicationContext());
mHeading.setText("\n"+"1");
//mHeading.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT));
mHeading.setTextColor(0xFFFF0000);
mHeading.setPadding(3, 0, 0, 0);
middleValue.setText("\n"+"2");
//middleValue.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT));
middleValue.setTextColor(0xFFFF0000);
middleValue.setGravity(Gravity.RIGHT);
middleValue.setPadding(2, 0, 9, 0);
aImageView.setText("\n"+"3");
//aImageView.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT));
aImageView.setGravity(Gravity.RIGHT);
aImageView.setTextColor(0xFF000000);
aImageView.setPadding(0, 0, 9, 0);
View line = new View(getApplicationContext());
//line.setOrientation(1);
line.setLayoutParams(new LayoutParams(2, android.view.ViewGroup.LayoutParams.FILL_PARENT));
line.setBackgroundColor(0xFF000000);
/**** Any other text view setup code ****/
innerLayout.addView(mHeading);
innerLayout.addView(middleValue);
innerLayout.addView(aImageView);
innerLayout.addView(line);
myLinearLayout.addView(innerLayout);
textListWord.add(mHeading);
textListAnswer.add(middleValue);
imageListAnswer.add(aImageView);
}
}
So please guide me that what more i have to do to create such view ?
Thanks.
try TableLayout and TableRow instead of LinearLayout.
You can create TableLayout in xml as well, as it, I think would be static and add TableRows. To Create a TableLayout in Java use,
TableLayout tblLayout=new TableLayout(this);
Set LayoutParams and other properties of table layout in java, like I am setting LayoutParams:
LayoutParams params=new LayoutParams(LayoutParams.Fill_Parent, LayoutParams.Wrap_Content);
tblLayout.setLayoutParams(params);
Create a loop for TableRows creation and insertion:
for(int i=0;i<arrList1.size();i++)
{
TableRow row=new TableRow(this);
row.setLayoutParams(params);
TextView lbl1=new TextView(this);
lbl1.setText(arrList1.get(i));
row.addView(lbl1);
TextView lbl2=new TextView(this);
lbl2.setText(arrList2.get(i));
row.addView(lbl2);
TextView lbl3=new TextView(this);
lbl3.setText(arrList3.get(i));
row.addView(lbl3);
tblLayout.addView(row);
}

Categories

Resources