Develop Reference

How to dynamically add a group of buttons to android app - With categories

I'm a beginner to android and am working on an app to organize a chore counting system and I'm having some issues with my next step. I am trying to give users the option to input different chores at their choice within the app (ideally they would start with no chores then input them on their own). For each chore they enter, 4 new elements need to show up (the name of chore, increase arrow, decrease arrow and chore count number). I am also trying to keep those new additions organized based on if they fall under "kitchen, bathroom or general" (user would select that when they add the chore). I tried to use groups and tags but couldn't figure out how to make it work.
`package com.example.testbasic;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;
import androidx.appcompat.app.AppCompatActivity;
public class MainActivity extends AppCompatActivity {
int integer = 0;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
public void increase(View view) {
integer = integer + 1;
System.out.println(view.getTag());
display(integer);
}
public void decrease(View view) {
integer = integer - 1;
System.out.println(view.getTag());
display(integer);
}
private void display(int number) {
TextView displayInteger = findViewById(R.id.integer_number);
displayInteger.setText("" + number);
}
}
`
Snip of the XML layout
'
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:orientation="vertical"
tools:ignore="UselessParent">
<TextView
android:id="#+id/textView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="#string/welcome_to_the_chore_calculator"
android:textSize="20sp" />
<TextView
android:id="#+id/Kitchen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="15dp"
android:layout_marginTop="50dp"
android:text="#string/kitchen" />
<androidx.constraintlayout.widget.Group
android:id="#+id/EmptyDishRackG"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="visible"
app:constraint_referenced_ids="tv_EmptyDishRack,IncreaseEDR,DecreaseEDR,integer_numberEDR" />
<TextView
android:id="#+id/tv_EmptyDishRack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/Kitchen"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="15dp"
android:layout_marginTop="1dp"
android:layout_marginEnd="140dp"
android:background="#android:drawable/editbox_background"
android:drawablePadding="16dp"
android:hint="#string/empty_dish_rack"
android:padding="12dp"
tools:ignore="UseCompatTextViewDrawableXml" />
<ImageButton
android:id="#+id/IncreaseEDR"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignTop="#+id/tv_EmptyDishRack"
android:layout_alignParentEnd="true"
android:layout_marginStart="1dp"
android:layout_marginTop="-2dp"
android:layout_marginEnd="15dp"
android:onClick="increase"
android:tag="EmptyDishRack"
app:srcCompat="#android:drawable/arrow_up_float"
tools:ignore="UsingOnClickInXml" />
<ImageButton
android:id="#+id/DecreaseEDR"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignTop="#+id/tv_EmptyDishRack"
android:layout_marginStart="-140dp"
android:layout_marginTop="-2dp"
android:layout_marginEnd="32dp"
android:layout_toEndOf="#+id/tv_EmptyDishRack"
android:onClick="decrease"
android:tag="EmptyDishRack"
app:srcCompat="#android:drawable/arrow_down_float"
tools:ignore="UsingOnClickInXml" />
<TextView
android:id="#+id/integer_numberEDR"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/tv_EmptyDishRack"
android:layout_alignBottom="#+id/tv_EmptyDishRack"
android:layout_marginStart="-31dp"
android:layout_marginTop="0dp"
android:layout_marginEnd="0dp"
android:layout_marginBottom="0dp"
android:layout_toStartOf="#+id/IncreaseEDR"
android:layout_toEndOf="#+id/DecreaseEDR"
android:text="#string/_0"
android:textAlignment="center"
android:textSize="30sp" />'
Here is how it looks so far
Up and down arrows
Other categories
^the chores that are currently there are just examples users may have different ones
Any help would be greatly appreciated.

As Faizan says, a RecyclerView is probably the best option here. RecyclerView lets you have a list of items (your chores in this case) stored in an ArrayList.
You set up how the items will display in the RecyclerView. This is done using a ViewHolder. In your case the ViewHolder will have the name of the chore, the up/down arrows and the count of chores.
Because the RecyclerView is linked to your ArrayList, each chore will display automatically in its own ViewHolder. You can then update the Array with new items as the user adds them. Here is a link to an example:
http://www.digitstory.com/wp-content/uploads/2017/02/android_recyclerview.jpg
For more details, have a look here:
https://developer.android.com/guide/topics/ui/layout/recyclerview
To get started, you could try YouTube and seach for "RecyclerView Android Studio". Work through a few example tutorials to get the concept, and try to adapt them to your needs.

Displaying multiple lines of text on a listview

I have been reading up on simple_list_item_2 and other standardized ways of displaying multi line text on a listview but none have given me what I want. As of now I am using a custom layout for the listview, but I lack the knowledge (after reading multiple articles) on how to customize each row in the listview to display it's own line of large text, tooltip (small text), and picture.
Here is the code I am using to initalize the listview and set the adapter
//List View
final String[] itemname = {
"More Rockets",
"Better Lasers",
"Super Shield",
"Super Defense"
};
final String[] itemtip = {
"+1 attack",
"+5 attack ",
"+1 defense",
"+5 defense"
};
final ListView upgradeList = (ListView) findViewById(R.id.upgradeListView);
upgradeList.setAdapter(new ArrayAdapter<String>(
this, R.layout.program_list,
R.id.Itemname, itemname));
program_list.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="80dp"
android:background="#drawable/buttontemplate">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Item Name"
android:id="#+id/Itemname"
android:textSize="30sp"
android:layout_centerVertical="true"
android:layout_toEndOf="#+id/imageView"
android:layout_marginLeft="15sp" />
<ImageView
android:layout_width="30sp"
android:layout_height="30sp"
android:id="#+id/imageView"
android:src="#drawable/heart"
android:layout_marginLeft="20dp"
android:layout_alignBottom="#+id/Itemname"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Tooltip:"
android:id="#+id/toolTip"
android:layout_centerVertical="true"
android:layout_toEndOf="#+id/Itemname"
android:layout_marginLeft="20dp" />
</RelativeLayout>
Here was my idea for puting another line of text in the listview but it is not the right amount of arguments
upgradeList.setAdapter(new ArrayAdapter<String>(
this, R.layout.program_list,
R.id.Itemname, itemname, R.id.toolTip, itemtip));
Any help is very much appreciated!
-Kelton

First make a POGO class with field String itemname,String itemtip then generate the getter and setter method , then from the activity class make an arraylist of this pogo class i.e
ArrayList<MyPOGO> arraylist =new ArrayList();
MyPOGO myPogo1=new MyPogo("More Rockets","+1 attack");
MyPOGO myPogo2=new MyPogo("Better Lasers","+5 attack ");
MyPOGO myPogo3=new MyPogo("Super Shield","+1 defense");
MyPOGO myPogo4=new MyPogo("Super Defense", "+5 defense");
arraylist.add(myPogo1);
arraylist.add(myPogo2);
arraylist.add(myPogo3);
arraylist.add(myPogo);
Here your arraylist size is 4 .
Now make a baseadapter or recyler view pass this arraylist

Programmatically adding a TextView onto an existing XML file

My main screen displays info from user input.
Now everything on this screen is added using XML apart from "Kool" TextView on the top left corner. Now I want a way to get info from a user and add it underneath the first row of information.
I've sorted out the screen that gets user input the problem is actually getting the layout perfect. Now I added "Kool" TextView programmatically but the layout is wrong.
How can I make it so it so the "Kool" TextView is underneath the date "20/08/15". Every time I use the setHeight method it makes the TextView invisible.
Code:
public class AnalysisPage extends Activity {
Button savebutton,cancelbutton;
EditText dateinput,weightinput,repsinput;
int dd,mm,yy;
private TextView texty = null;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.dumbbellpress);
}
#Override
public boolean onCreateOptionsMenu(Menu menu){
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.main_activity_actions,menu);
return super.onCreateOptionsMenu(menu);
}
#Override
public boolean onOptionsItemSelected(MenuItem item){
switch (item.getItemId()){
case R.id.addinfo:
Dialog dialog = new Dialog(AnalysisPage.this);
dialog.setTitle(" Enter your STATS brah");
dialog.setContentView(R.layout.datainput);
dateinput = (EditText)dialog.findViewById(R.id.editDate);
final Calendar c = Calendar.getInstance();
dd = c.get(Calendar.DAY_OF_MONTH);
mm = c.get(Calendar.MONTH);
yy = c.get(Calendar.YEAR);
dateinput.setText(new StringBuilder().append(dd).append("/").append(mm+1).append("/").append(yy));
dialog.show();
weightinput = (EditText)dialog.findViewById(R.id.editWeight);
repsinput = (EditText)dialog.findViewById(R.id.editReps);
savebutton = (Button)dialog.findViewById(R.id.btnSave);
cancelbutton = (Button)dialog.findViewById(R.id.btnCancel);
savebutton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
RelativeLayout views = (RelativeLayout)findViewById(R.id.xxx);
texty = new TextView(AnalysisPage.this);
texty.setTextSize(28);
texty.setText("Kool");
views.addView(texty);
}
});
cancelbutton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
dialog.cancel();
}
});
return true;
default:
return super.onOptionsItemSelected(item);
}
}
XML code:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent" android:weightSum="1" android:id="#+id/statslayout">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" android:id="#+id/xxx">
<TableRow
android:layout_width="fill_parent"
android:layout_height="100dp" android:id="#+id/tableRow3" android:layout_alignParentTop="true"
android:layout_alignParentStart="true" android:layout_marginStart="72dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Dumbbell Press Stats!"
android:id="#+id/textView"/>
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="100dp" android:id="#+id/tableRow"
android:layout_alignParentTop="true" android:layout_alignEnd="#+id/tableRow3"
android:layout_marginTop="49dp" android:layout_alignBottom="#+id/tableRow3">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Date"
android:layout_weight="0.22"
android:id="#+id/btnDate"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text=" Weight"
android:layout_weight="0.22"
android:id="#+id/txtWeight"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text=" Reps"
android:layout_weight="0.22"
android:id="#+id/btnReps"
/>
</TableRow>
<TableRow
android:layout_width="wrap_content"
android:layout_height="200dp"
android:layout_below="#+id/tableRow" android:layout_alignParentStart="true" android:id="#+id/tableRow4">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="20/08/15"
android:id="#+id/textView2" android:layout_below="#+id/tableRow"
android:layout_alignStart="#+id/tableRow3"/>
</TableRow>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text=" 8"
android:id="#+id/textView7"
android:layout_marginEnd="82dp" android:layout_below="#+id/tableRow"
android:layout_alignEnd="#+id/tableRow3"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="50kg"
android:id="#+id/textView6"
android:layout_marginStart="43dp"
android:layout_below="#+id/tableRow3" android:layout_toEndOf="#+id/tableRow4"/>
</RelativeLayout>
My end (dream) goal for this is by using Java I making complete perfectly formatted rows which contains the Date, Weight and Reps in their respected columns. And multiple rows of this or perfectly formatted using Java.
Image (this is in XML not in Java)

Rather than add TextView(s) programmatically, use a ListView. This will solve your problems entirely. You would use a custom adapter setAdapter() that your ListView would set as it's adapter (that provides the List it's data), and add new row elements each time you click your button that adds the new items. This would mean replacing your TableRow bit, and using a ListView in the RelativeLayout instead. Also, you could add a custom header view to the ListView to replace that header you already use (source: addHeaderView() )
Looking at your rows, it appears that they have the fields: "Date", "weight" and "reps". This would mean create a custom Java object that has those three fields, and make the the object type of your ListView adapter's elements. I can provide starter code if you REALLY need it, but it would help you best to use the documentation I provided to teach your self how to use the ListView.
Tutorial: ListView tutorial
Edit: Another bonus: ListView handles allowing the user to scroll as more, and more rows are added to this List of yours. More reason to just opt to a ListView :)

font size will be increase on whole app textview when click image

I have to develop one android application.
Here i have to click one image means automatically increase the font size on whole app textview.how can i develop these like iphone BBC news app . please give me some idea ???
EDIT:
please see here.here see the 2nd image bottom -A +A image is there...that purpose is have to click that image means automatically increase and decrese the whole app textview fontsize.
how can we ll do in android app ???

Use imageview and implement onclicklisetner
XML
<TextView
android:id="#+id/firsttv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="serif"
android:gravity="center"
android:layout_marginBottom="20dip"
android:layout_marginTop="20dip"
android:text="#string/prompt" />
<ImageButton
android:id="#+id/imagebtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:background="#android:color/transparent"
android:contentDescription="#string/description"
android:onClick="onclickbtn"
/>
Java
Register:
TextView tv;
tv=(TextView)findViewById(R.id.firsttv);
Onclick
public void onclickbtn(View v){
tv.setTextSize(20);
}

Here is implemented version of your query:
Java Code:
package com.anurag.increasefont;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
public class MainActivity extends Activity {
TextView tv;Button b1,b2;int count=0;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tv=(TextView)findViewById(R.id.tv1);
b1=(Button)findViewById(R.id.b1);
b2=(Button)findViewById(R.id.b2);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}
public void increase(View inc){
count++;
if(count==1){tv.setTextSize(20); }
else if(count==2){tv.setTextSize(30);}
else if (count>=3) {count=3;tv.setTextSize(40);}
}
public void decrease(View dec){
count--;
if(count<=0){tv.setTextSize(12);count=0;}
if(count==1){tv.setTextSize(20);}
else if(count==2){tv.setTextSize(30);}
else if (count==3) {tv.setTextSize(40);}
}
}
XML Code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="2dp"
tools:context=".MainActivity" >
<TextView
android:id="#+id/tv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:text="This is sample text, i will increase and decrease the font size when user clicks on A+ and A_ buttons provided below. I can also use imageview or image button instead of Buttons to perform the same" />
<Button
android:id="#+id/b2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignRight="#+id/textView1"
android:onClick="decrease"
android:text="Decrease" />
<Button
android:id="#+id/b1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:onClick="increase"
android:text="Increase" />
</RelativeLayout>

EditText resizing for no reason

Observing rather strange behavior in relative layout.
This is the initial state:
Defined as:
<EditText
android:id="#+id/bleedCount"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#+id/abrMult"
android:layout_below="#+id/textView4"
android:layout_marginRight="10dp"
android:ems="10"
android:inputType="number"
>
<requestFocus />
</EditText>
<TextView
android:id="#+id/abrMult"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/abrSubmit"
android:layout_alignBaseline="#+id/abrSubmit"
android:layout_marginRight="10dp"
android:text="x12" />
<Button
android:id="#+id/abrSubmit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textView4"
android:layout_alignParentRight="true"
android:text="Calculate" />
On onItemSelected from the dropdown it is being changed like this:
abrSubmit.setText(pos == 1 ? "Calculate" : "Submit");
abrMult.setVisibility(pos == 1 ? View.VISIBLE : View.GONE);
bleedCount.setHint(pos == 1 ? "# of Meow/month" : "# of Meow/year");
and turns into this:
Notice how EditText bleedCount is way taller on the second picture. The value of bleedCount.getHeight() is changing from 72 to 95, and I can't understand what is causing it.

It's connected with android:ems="10"
When EditText changed it's width, after showing up of view with x12, it must have been splited into two lines.
ems has size of one letter for given font.
I think you don't need ems.
Set EditText as single lined: android:singleLine="true"

The bleedCount EditText resizing is due to your hint text becoming longer than a single line when (pos == 1).
If you comment out the following line in your code, the resizing will stop happening:
// bleedCount.setHint(pos == 1 ? "# of Meow/month" : "# of Meow/year");
Maybe you can make it shorter/smaller to prevent the resizing?

Okay, since I don't have your entire code base I put something simple together to replicate what you are doing. Just FYI, I am using ICS 4.1. I didn't have any of the problems you are having, so perhaps this is an API issue. Perhaps you can look at my code base and see where there are differences between it and your own. Therein may lie the solution.
XML:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/main_rl"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Top TextView" />
<Spinner
android:layout_below="#+id/textView4"
android:id="#+id/spinner1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:layout_below="#+id/spinner1"
android:id="#+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Above EditText" />
<EditText
android:id="#+id/bleedCount"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/textView5"
android:layout_marginRight="10dp"
android:layout_toLeftOf="#+id/abrMult"
android:ems="10"
android:inputType="number" >
</EditText>
<TextView
android:id="#+id/abrMult"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textView5"
android:layout_alignBaseline="#+id/abrSubmit"
android:layout_marginRight="10dp"
android:layout_toLeftOf="#+id/abrSubmit"
android:text="x12"
android:visibility="gone" />
<Button
android:id="#+id/abrSubmit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/textView5"
android:text="Submit" />
</RelativeLayout>
Code:
public class ExampleActivity extends Activity implements OnItemSelectedListener {
private Button submitButton;
private TextView tv;
private Spinner spinner;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_example);
submitButton = (Button) findViewById(R.id.abrSubmit);
tv = (TextView) findViewById(R.id.abrMult);
spinner = (Spinner) findViewById(R.id.spinner1);
// create the data array for the spinner
String[] strings = { "This", "That", "The Other" };
// create the spinner adapter
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
android.R.layout.simple_spinner_item, strings);
adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
// set the adapter on the spinner
spinner.setAdapter(adapter);
// set the event listener for the spinner
spinner.setOnItemSelectedListener(this);
}
public void onItemSelected(AdapterView<?> arg0, View arg1, int arg2,
long arg3) {
if (submitButton.getText().equals("Calculate")) {
submitButton.setText("Submit");
tv.setVisibility(View.GONE);
} else {
submitButton.setText("Calculate");
tv.setVisibility(View.VISIBLE);
}
}
public void onNothingSelected(AdapterView<?> arg0) {
// TODO Auto-generated method stub
}
}
Hope it helps...