Add TableRow xml layout to TableLayout on button click - android

I have a layout xml file I am trying to append to a TableLayout when the user clicks a button. Here is my onClick listener method:
addHazardButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
TableLayout table = (TableLayout) view.findViewById(R.id.safety_question_table);
View row = getLayoutInflater(null).inflate(R.layout.fragment_safety_question_table_row, table);
table.addView(row);
}
});
I have also tried replacing the line View row = getLayoutInflater.... with the following:
View row = getLayoutInflater(null).inflate(R.layout.fragment_safety_question_table_row, null);,
&
TableRow row = getLayoutInflater(null).inflate(R.layout.fragment_safety_question_table_row, table);,
&
TableRow row = getLayoutInflater(null).inflate(R.layout.fragment_safety_question_table_row, null);
I have also tried passing the LayoutInflater from the onCreateView method to the method my onClickListener is set in and using it, but I don't think that is the problem, as the stack trace is
java.lang.NullPointerException: Attempt to invoke virtual method 'void
android.widget.TableLayout.addView(android.view.View)' on a null
object reference
How do I properly add my xml layout file to the table onClick?
<?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">
<EditText
android:id="#+id/task_step_text"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#drawable/border_outline"
android:inputType="text"
android:maxLines="1" />
<EditText
android:id="#+id/hazards_not_covered_text"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#drawable/border_outline"
android:inputType="text"
android:maxLines="1" />
<EditText
android:id="#+id/reduce_risk_text"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#drawable/border_outline"
android:inputType="text"
android:maxLines="1" />
</TableRow>

Use
TableLayout table = (TableLayout) findViewById(R.id.safety_question_table);
instead of
TableLayout table = (TableLayout) view.findViewById(R.id.safety_question_table);
Because TableLayout is probably in Activity layout instead of in Button View.
OR
if TableLayout is in parent View of Button then we can also access it as:
View parent = (View)view.getParent();
if (parent != null) {
TableLayout table =
(TableLayout)parent.findViewById(R.id.safety_question_table);
// add your code here
}

Related

Removing Views dynamically

I search a lot for this, but I can't solve it. I have LinearLayout with two textviews and a button (to add others LinearLayout) like this:
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent">
<EditText android:id="#+id/ingredientsField"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_margin="#dimen/boxes_margin"
android:hint="#string/ingredients"
android:inputType="text"
xmlns:android="http://schemas.android.com/apk/res/android" />
<EditText
android:id="#+id/quantityField"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_margin="#dimen/boxes_margin"
android:hint="#string/quantity"
android:inputType="number"
/>
<com.google.android.material.button.MaterialButton
android:id="#+id/add_ingredient_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/add"
android:layout_margin="#dimen/boxes_margin"
app:icon="#drawable/ic_add_ingr_btn"
/>
</LinearLayout>
The layout added is like this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="50dp">
<EditText android:id="#+id/ingredientsField"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_margin="#dimen/boxes_margin"
android:hint="#string/ingredients"
android:inputType="text"
xmlns:android="http://schemas.android.com/apk/res/android" />
<EditText android:id="#+id/quantityField"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_margin="#dimen/boxes_margin"
android:hint="#string/quantity"
android:inputType="number"
xmlns:android="http://schemas.android.com/apk/res/android" />
<ImageButton
android:id="#+id/remove_ingredient_btn"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_margin="#dimen/boxes_margin"
android:src="#drawable/ic_remove_ing_qnt"/>
</LinearLayout>
In the Activity, I created a method to add new Layouts (and it works), and inside of it a method to delete the corresponding Layout with the Delete Button. Delete Button works only one time and only if it's in the first layout added. Here's the code:
add_ingredient.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
final View rowView = inflater.inflate(R.layout.ingredient_quantity_layout, null);
// Add the new row before the add field button.
parentIngredientLayout.addView(rowView);
ImageButton removeChildIngredient = findViewById(R.id.remove_ingredient_btn);
removeChildIngredient.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
parentIngredientLayout.removeView((View) v.getParent());
}
});
}
});
You have to set the OnClickListenerevent on the ImageButton from the last inserted layout.
To do that, just change this line
ImageButton removeChildIngredient = findViewById(R.id.remove_ingredient_btn);
to
ImageButton removeChildIngredient = rowView.findViewById(R.id.remove_ingredient_btn);
rowView.findViewById search the ImageButton on the last inserted layout and not the whole layout which contains other layouts.
In this line :
parentIngredientLayout.removeView((View)
v.getParent());
You are trying to remove the parent of the removeChildIngredient ImageButton, which is probably parentIngredientLayout, which i think is not what you want,
You could try this :
parentIngredientLayout.
removeView(rowView);
But in your implementation, you could encounter issues when you will add multiples ingredients, because you are setting a new onClickListener to each new ingredient, and The ImageButton will only delete the last one you have added(the last onClickListener set),
Instead, you could use a List/RecyclerView or search for another implementation, eg. put the ImageButton inside the Inflated Layout so you'll have one Remove Button in each Layout you add,
Then you should replace the findViewById of your ImageButton by rowView.findViewById
And this line should stay unchanged
parentIngredientLayout.removeView((View) v.getParent());

TableLayout error in Android

I have a XML file containing TableLayout as follows:
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="10dp" >
<TableLayout
android:id="#+id/resulttable"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weightSum="3" >
<TableRow
android:id="#+id/tr"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/tv_discription"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<TextView
android:id="#+id/tv_left_vehicle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<TextView
android:id="#+id/tv_right_vehicle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
</TableRow>
</TableLayout>
</ScrollView>
In the above table I want to show array list of string, for this I have done following code:
TableLayout table = (TableLayout) findViewById(R.id.resulttable);
for(int i=0;i<DArray.size();i++)
{
TableRow row = (TableRow)findViewById(R.id.tr);
String discription = DArray.get(i);
String leftVehicle = LArray.get(i);
String rightVehicle = RArray.get(i);
TextView tvD = (TextView)findViewById(R.id.tv_discription);
tvD.setText(discription);
TextView tvlPrice = (TextView)findViewById(R.id.tv_left_vehicle);
tvlPrice.setText(leftVehicle);
TextView tvrPrice = (TextView)findViewById(R.id.tv_right_vehicle);
tvrPrice.setText(rightVehicle);
row.addView(tvD);
row.addView(tvlPrice);
row.addView(tvrPrice);
table.addView(row);
}
but this code is arising exception. Here is LogCat error for my code.
E/AndroidRuntime(1897): java.lang.IllegalStateException: The specified child already has a parent. You must call removeView() on the child's parent first.
I am beginner for this situation please help me find out the problem.
i think you should Try this way
TableLayout table = (TableLayout) findViewById(R.id.resulttable);
TableRow row = (TableRow)findViewById(R.id.tr);
TextView tvD = (TextView)findViewById(R.id.tv_discription);
TextView tvlPrice = (TextView)findViewById(R.id.tv_left_vehicle);
TextView tvrPrice = (TextView)findViewById(R.id.tv_right_vehicle);
for(int i=0;i<DArray.size();i++)
{
String discription = DArray.get(i);
String leftVehicle = LArray.get(i);
String rightVehicle = RArray.get(i);
tvD.setText(discription);
tvlPrice.setText(leftVehicle);
tvrPrice.setText(rightVehicle);
row.addView(tvD);
row.addView(tvlPrice);
row.addView(tvrPrice);
table.addView(row,id);
}
Provide id for row positioning
The thing is that you added in the xml the row and then you add it again and again in the loop.
If you want to have a TableLayout and add rows on it dinamicaly then you might want to create the row with its content in another xml file and inflate that xml in the for loop and then add the row to the table.
So, lets say you have the following inside another xml called row.xml:
<TableRow
android:id="#+id/tr"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/tv_discription"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<TextView
android:id="#+id/tv_left_vehicle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<TextView
android:id="#+id/tv_right_vehicle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
</TableRow>
And the TableLayout in another one (xml file):
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="10dp" >
<TableLayout
android:id="#+id/resulttable"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weightSum="3" >
</TableLayout>
</ScrollView>
Then you would have this in the code:
TableLayout table = (TableLayout) findViewById(R.id.resulttable);
for(int i=0; i < DArray.size(); i++){
//get the row from the xml and add it on the table at each loop step
TableRow row = getActivity().getLayoutInflater() .inflate(R.layout.row, table, true);
String discription = DArray.get(i);
String leftVehicle = LArray.get(i);
String rightVehicle = RArray.get(i);
// get the labels from the row and populate themm with data, note that you don't have to add them again as they are allready added..
TextView tvD = (TextView)row.findViewById(R.id.tv_discription);
tvD.setText(discription);
TextView tvlPrice = (TextView)row.findViewById(R.id.tv_left_vehicle);
tvlPrice.setText(leftVehicle);
TextView tvrPrice = (TextView)row.findViewById(R.id.tv_right_vehicle);
tvrPrice.setText(rightVehicle);
}
You might have to tweak the code above a bit as I wrote it from my mind and didn't tested it but that should be the trick.
Why Cant you use listview and custom adapters for this implementation?. which will make your life easier.
Okay the second potential problem is also: table.addView(row);
rowgets added every single loop iteration but it's the same view. You can only add a view once to the hierarchy. You probably want a new instance for each loop iteration. I can't say for sure but this is likely the problem. or try to add with index position in viewgroup like
table.addView(row, index);

Adding TableRow dynamically and retrieving/setting from edittext, viewtext

I want to add table rows dynamically to my layout, the rows will be added to a RelativeLayout called main_ScrollView_Container
The problems I have are that:
The added rows are stacked on top each other and not below each other in order added.
How can I retrieve the added rows so I can read/write to the EditText input and TextView output of each row that I have added?
My oncreate:
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_launcher);
// the inflater
LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
// the item to inflate
RelativeLayout relativeLayout = (RelativeLayout) findViewById(R.id.main_ScrollView_Container);
// the item to inflate with
View tableRow = inflater.inflate(R.xml.my_row, relativeLayout, false);
relativeLayout.addView(tableRow, 0);
tableRow = inflater.inflate(R.xml.my_row, relativeLayout, false);
relativeLayout.addView(tableRow, 1);
tableRow = inflater.inflate(R.xml.my_row, relativeLayout, false);
relativeLayout.addView(tableRow, 2);
tableRow = inflater.inflate(R.xml.my_row, relativeLayout, false);
relativeLayout.addView(tableRow, 3);
// retrieve/set values to the EditText input
// retrieve/set values to the TextView output
}
I got this my_row.xml
<?xml version="1.0" encoding="utf-8"?>
<TableRow xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tableRow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp" >
<EditText
android:id="#+id/input"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:ems="10"
android:gravity="center"
android:hint="#string/input"
android:inputType="numberDecimal" />
<TextView
android:id="#+id/output"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="center"
android:hint="#string/output"
android:textAppearance="?android:attr/textAppearanceLarge" />
</TableRow>
and my layout
<ScrollView
android:id="#+id/main_scroll_view"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<RelativeLayout
android:id="#+id/main_ScrollView_Container"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
</RelativeLayout>
</ScrollView>
Firstly, you should probably be using R.layout rather than R.xml to organize and reference your layout files. There are many types of xml resources in your project alone - it's a good idea to subcategorize them.
Secondly, when you call relativeLayout.addView(tableRow, 0); you are in fact adding tableRow at the 0th position of the layout (the top). Also, since you are adding the rows into a RelativeLayout, it's no surprise that they are stacking on top of each other. You might want to use a vertically oriented LinearLayout instead, which will take care of vertically arranging the rows from top to bottom.
Thirdly, once you have inflated your row view, you can access its subviews like this:
View tableRow = inflater.inflate(R.xml.my_row, relativeLayout, false);
EditText inputBox = (EditText) tableRow.findViewById(R.id.input);
TextView outputBox = (TextView) tableRow.findViewById(R.id.output);
Remember, you can call findViewById on any View to access its subviews - providing they have IDs.

Android: setting text in each new view within a for loop

So I have an XML layout1 which is just a LinearLayout with three text views. I also have another XML layout2 with ScrollView and a LinearLayout inside it. I'm using this for loop to create several of the layout2 inside the LinearLayout of the ScrollView. It's working fine but I want to be able to set the text of each of the TextViews within the for loop. I'm not sure how to access these TextViews as I can only set one id within the XML file, will that not cause problems if I tried to access their id inside the for loop?
private void setUpResults() {
for (int i = 1; i < totalQuestions; i++) {
parent.addView(LayoutInflater.from(getBaseContext()).inflate(
R.layout.result_block, null));
}
}
Here is the result_block xml file (layout1) :
<?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="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/layoutSelectedAnswer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/border"
android:orientation="horizontal"
android:paddingBottom="#dimen/option_padding_bottom"
android:paddingTop="#dimen/option_padding_top" >
<TextView
android:id="#+id/tvOptionALabel2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dp"
android:text="#string/option_a"
android:textColor="#color/white"
android:textSize="#dimen/option_text_size" />
<TextView
android:id="#+id/tvSelectedAnswer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dp"
android:text="#string/option"
android:textColor="#color/white"
android:textSize="#dimen/option_text_size" />
</LinearLayout>
<LinearLayout
android:id="#+id/layoutCorrectAnswer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/border"
android:orientation="horizontal"
android:paddingBottom="#dimen/option_padding_bottom"
android:paddingTop="#dimen/option_padding_top" >
<TextView
android:id="#+id/tvOptionBLabel2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dp"
android:text="#string/option_b"
android:textColor="#color/white"
android:textSize="#dimen/option_text_size" />
<TextView
android:id="#+id/tvCorrectAnswer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dp"
android:text="#string/option"
android:textColor="#color/white"
android:textSize="#dimen/option_text_size" />
</LinearLayout>
</LinearLayout>
Let's say I wanted to set the TextView with the id as tvCorrectAnswer to a different String value in each loop, how should I access it?
Sure, you can do it like this:
private void setUpResults () {
LayoutInflater i = LayoutInflater.from(getBaseContext());
for (int i = 1 /* should be zero? */; i < totalQuestions; i++) {
View view = i.inflate(R.layout.result_block, parent, false);
TextView correctAnswer = (TextView) view.findViewById(R.id.tvSelectedAnswer);
correctAnswer.setText("My Answer Text");
parent.addView(view);
}
}
The key is, inflate using the parent as the container, but don't attach it (the false parameter). Then you'll get a reference to the inflated view, which you can then directly reference to do your findViewById() calls (which will limit the search to that particular ViewGroup). Then add it to the parent and continue to the next item.
Once you have added all your views in your ViewGroup you can use ViewGroup.getChildAt(int) to get a one of the views you have inserted. Once you get one of the views you can access any of its inner views. Something like this.
for(int i = 0; i < parentView.getChildCount();++i) {
View v = parentView.getChildAt(i);
Textview tv = (TextView) v.findViewById(R.id.tvOptionALabel2);
//And so on...
}

Layouttrouble extending tablerow and inflating xml tablerow

I'm pretty close to go for a LinearLayout alternative, but its kind of irritating not getting this right. To get most flexibility out of things I've defined a TableLayout xml with only a row header defined. Next I've generated a seperate TableRow xml defining the "row template". In Javacode I've subclassed TableRow and in the constructor i inflate the tablerow template to attach to the root (the subclassed class).
Well, good so far. When the table is populated the headerrow is ok, but the other rows are NOT. It seems like they are laid out in a different way, the two columns is not filling the whole width as expected and the the coluomns is therefore not aligned correctly to each other.
Anyone who can shed some light on this one? I've tried a lot of solutions, but nothing makes it work.
The tablelayout with header row
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true" >
<HorizontalScrollView
android:id="#+id/horizontalScrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true" >
<TableLayout
android:id="#+id/zone_table"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:stretchColumns="*" >
<TableRow
android:id="#+id/tableRow1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="fill_horizontal"
android:clipToPadding="false" >
<TextView
android:layout_width="0dip"
android:layout_weight="0.8"
android:background="#ffcccccc"
android:text="Zonename"
android:textColor="#android:color/black" />
<TextView
android:layout_width="0dip"
android:layout_weight="0.2"
android:background="#ffcccc00"
android:gravity="right"
android:text="Antall"
android:textColor="#android:color/black" />
</TableRow>
</TableLayout>
</HorizontalScrollView>
</ScrollView>
The "other" inflated row
<TableRow xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/zonetablerow"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<TextView
android:id="#+id/zonerow_name"
android:layout_width="0dip"
android:layout_weight="0.8"
android:background="#ffcccccc"
android:textSize="18dp" />
<TextView
android:id="#+id/zonerow_invcount"
android:layout_width="0dip"
android:layout_gravity="right"
android:layout_weight="0.2"
android:background="#ffcccc00"
android:textSize="18dp" />
</TableRow>
Class extending TableRow
public class ZoneRow extends TableRow {
private ZoneInventoryDAO dao = null;
private int inventoryCount = 0;
public ZoneRow(Context ctx, ZoneInventoryDAO dao) {
this(ctx, dao, 0);
}
public ZoneRow(Context ctx, ZoneInventoryDAO dao, int inventoryCount) {
super(ctx);
setWeightSum(1.0f);
this.dao = dao;
this.inventoryCount = inventoryCount;
doLayout();
}
private void doLayout() {
// XML layouten settes med zonerow som parent (se:
// http://developer.android.com/resources/articles/layout-tricks-merge.html)
View v = LayoutInflater.from(getContext()).inflate(R.layout.zonerow,
this, true);
TextView t = (TextView) findViewById(R.id.zonerow_name);
TextView cnt = (TextView) findViewById(R.id.zonerow_invcount);
t.setText(dao.getZoneAlias());
cnt.setText(String.valueOf(inventoryCount));
}
public void incInventory() {
inventoryCount++;
}
public ZoneInventoryDAO getDAO() {
return dao;
}
}
What it looks like is that you are extending tablerow and creating an instance of that object. This will cause a table row to be created. Then you are inflating another tablerow which is for some reason interacting with the first. For a quick fix try adding something like table.setColumnStretchable(0, true);
I'm having the same problem. I fixed it by not doing that - specifically by not subclassing TableRow, but just instantiating them in code and applying whatever I needed to them by hand. You can do this by encapsulating instead. Have some record that has ZoneInventoryDAO, inventoryCount, and tableRow, which points to the corresponding TableRow instance. Just instantiate TableRow with an inflation:
TableLayout table = (TableLayout) inflater.inflate(R.layout.my_table, null); // etc
...
for (//each data item//) {
TableRow tr = (TableRow) inflater.inflate(R.layout.my_table_row, null);
TextView tv1 = (TextView) findViewById(R.id.table_entry_1);
tv1.setText("Whatever goes here");
...
// and so on for each column
table.addView(tr);
}
The above worked for me when moving that same code into a class which extends TableRow did not.
I know this is old, but I had same issue, and figured it out, so maybe this will help future users.
The problem is, that when you inflate the TableRow from XML, and you add it ino your extended TableRow, it is seen by the Table as a single column, with multiple children, as the TableRow in your Layout is in essence a ViewGroup. Therefore it lays out the table, as a single column table.
The solution is that in the TableRow XML layout, use a <merge> type, rather than a <TableRow> type. This way when inflated, the items within your xml, will be merged into your extended TableRow, and your extended TableRow will have multiple colums.
Here is the example code
<merge xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/zonetablerow"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<TextView
android:id="#+id/zonerow_name"
android:layout_width="0dip"
android:layout_weight="0.8"
android:background="#ffcccccc"
android:textSize="18dp" />
<TextView
android:id="#+id/zonerow_invcount"
android:layout_width="0dip"
android:layout_gravity="right"
android:layout_weight="0.2"
android:background="#ffcccc00"
android:textSize="18dp" />
</merge>

Categories

Resources