Create buttons programmatically goes new line - android

I created a layout which programmatically created buttons (see code). With this layout I have a column of buttons, but I would create something like the picture below. I tried something with linear layout but the buttons didn't go to new line automatically and didn't show, so I change it to table layout. How can I create something like the picture programmatically?
Thank you.
protected TableLayout layout;
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
layout = (TableLayout) findViewById(R.id.workflows_activity_layout);
private void createButton() {
loading.setVisibility(View.VISIBLE);
layout.removeAllViews();
if (items.length == 0) {
TableRow row = new TableRow(this);
TextView no_item = new TextView(this);
no_questions.setText("there are no items");
no_questions.setTextSize(35);
row.addView(no_item);
layout.addView(row);
} else {
for (int i = 0; i < items.length; i++) {
TableRow row = new TableRow(this);
final Button btn = new Button(this);
TextView tw = new TextView(this);
tw.setText(items[i].getName());
tw.setTextSize(25);
btn.setBackgroundResource(R.drawable.button_image);
btn.setId(i);
btn.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
int btn_selected = btn.getId();
Intent openItempage = new Intent(MainActivity.this, ItemsActivity.class);
startActivity(openItempage);
}
});
row.addView(btn);
row.addView(tw);
layout.addView(row, params);
items_buttons.add(btn);
items_nameText.add(tw);
}
}
loading.setVisibility(View.GONE);
}

There's an easy way to achieve what you want. Look at this code:
<?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="match_parent"
android:layout_gravity="center_horizontal"
android:orientation="vertical">
<TableLayout
android:id="#+id/tab_lay"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:stretchColumns="*"
android:gravity="center_vertical" />
TabLayout tab_lay = (TableLayout)view.findViewById(R.id.tab_lay);
for(int i = 1; i <= 4; ){
TableRow a = new TableRow(getActivity());
TableRow.LayoutParams param = new TableRow.LayoutParams(
TableRow.LayoutParams.FILL_PARENT,
TableRow.LayoutParams.WRAP_CONTENT, 1.0f);
a.setLayoutParams(param);
a.setGravity(Gravity.CENTER_VERTICAL);
for(int y = 0; (y < 2) && (i <= 4); y++) {
Button x = new Button(getActivity());
x.setText("Text " + i);
x.setGravity(Gravity.CENTER);
TableRow.LayoutParams par = new TableRow.LayoutParams(y);
x.setLayoutParams(par);
int ids = i;
x.setId(ids);
x.setOnClickListener(this);
a.addView(x);
i++;
}
tab_lay.addView(a);
}
If you want more buttons, then just change 4 which is compare to i to your value. Hope I help.

You can implement this using labraries, for instance
FlowLayout
Usage:
<com.wefika.flowlayout.FlowLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="start|top">
<View
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Lorem ipsum" />
</com.wefika.flowlayout.FlowLayout>
Another solution is:
AndroidFlowLayout
Usage:
<com.liangfeizc.flowlayout.FlowLayout
android:id="#+id/flow_layout"
flowlayout:vertical_spacing="10dp"
flowlayout:horizontal_spacing="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content" />

Related

Dynamically add TableRow to above of TableLayout

I want to dynamically add TableRow to above of TableLayout. I use blow code:
In my activity:
TableLayout table = (TableLayout)ChatActivity.this.findViewById(R.id.tblChats);
for(int i = 1; i < 10; ++i)
{
TableRow row = (TableRow)LayoutInflater.from(ChatActivity.this).inflate(R.layout.chat_row, null);
((TextView)row.findViewById(R.id.attrib_name)).setText("A");
((TextView)row.findViewById(R.id.attrib_value)).setText(i + "");
table.addView(row);
}
table.requestLayout();
chat_row.xml:
<?xml version="1.0" encoding="utf-8"?>
<TableRow xmlns:android="http://schemas.android.com/apk/res/android">
<TextView android:id="#+id/attrib_name"
android:textStyle="bold"/>
<TextView android:id="#+id/attrib_value"
android:gravity="right"
android:textStyle="normal"/>
</TableRow>
As you know these codes adds TableRow in the bottom of the TableLayout.
Is there any way to add it to the above of TableLayout?
yes you can add row as runtime in table layout.
use below code like chart.xml
<?xml version="1.0" encoding="utf-8"?>
<TableLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tblChats"
android:layout_width="match_parent"
android:layout_height="match_parent"> </TableLayout>
and make activity like below ..
public class ChartActivity extends AppCompatActivity {
#Override
protected void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.chart_layout);
TableLayout table = findViewById(R.id.tblChats);
for (int i = 0; i < 5; i++) {
TableRow row = new TableRow(this);
TableRow.LayoutParams lp = new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT);
row.setLayoutParams(lp);
TextView textView = new TextView(this);
textView.setText("Name" + " " + i);
EditText editText = new EditText(this);
row.addView(textView);
table.addView(row, i);
}
}
}
According to Android Team's answer I realized I must change this line:
table.addView(row);
to this:
table.addView(row, 0);

How Create more TextView in RelativeLayout in rows android

how to create more TextView in relativelayout like
my code not showing
not like that :
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,
ViewGroup.LayoutParams.WRAP_CONTENT);
params.setMargins(5, 10, 5, 10);
params.setMarginStart(40);
params.setMarginEnd(40);
for (int a = 0; a < alquran.getindokata().length; a++) {
textView = new TextView(context);
textView.setLayoutParams(params);
textView.setId(a);
textView.setGravity(Gravity.CENTER);
textView.setPadding(10, 5, 10, 5);
textView.setBackgroundColor(context.getResources().getColor(R.color.hitam_pudar));
textView.setText(alquran.getarabkata()[a] + "\n" + alquran.getindokata()[a]);
Log.d(TAG, "VerseID " + id_surat +
" getKata " + alquran.getindokata()[a]
);
holder.terjemahankata.addView(textView);
}
From the image you supplied, I suggest you a non-official Google library FlexBoxLayout for this. You got variety of options to choose from:
flexDirection
flexWrap
justifyContent
alignItems
alignContent
and many more!
You can dynamically add elements (TextView, in your case), in FlexBoxLayout, and it will get arranged as you need.
To add more textview to single layout you can use library “FlexboxLayout”.
Following is the code to implement this library to your project:
Add this to your build.gradle file
compile 'com.google.android:flexbox:0.2.6'
Add this to main layout file
<com.google.android.flexbox.FlexboxLayout
android:id="#+id/flexBoxLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:alignContent="flex_start"
app:alignItems="flex_start"
app:flexDirection="row"
app:flexWrap="wrap"
app:justifyContent="flex_start" />
Another textview file
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/tvTag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="Test"
android:background="#drawable/rounded_corner_green"
android:padding="10dp"
android:textColor="#android:color/white"
android:textStyle="bold"
android:textSize="12sp" />
</LinearLayout>
Java Code
public class MainActivity extends AppCompatActivity {
private FlexboxLayout flexBoxLayout;
private List<String> List = new ArrayList<>();
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.flex_activity);
flexBoxLayout = (FlexboxLayout) findViewById(R.id.flexBoxLayout);
List.add("Test Content");
List.add("Content");
List.add("Test Content");
List.add("Test");
List.add("Test Content");
List.add("Content");
List.add("Test Content");
List.add("Test");
setView();
}
public void setView() {
flexBoxLayout.removeAllViews();
for (int i = 0; i < List.size(); i++) {
final int pos = i;
final View tagView = this.getLayoutInflater().inflate(R.layout.item_select_intrest_tag, null);
final TextView tvTag = (TextView) tagView.findViewById(R.id.tvTag);
tvTag.setText(List.get(i));
tvTag.measure(0, 0);
tvTag.getMeasuredWidth();
tvTag.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Toast.makeText(MainActivity.this, "Test Clicked", Toast.LENGTH_SHORT).show();
}
});
flexBoxLayout.addView(tagView);
}
}
}

How to align these 2 buttons next to each other programmatically in Android?

I have written this piece of code. But it is not giving the proper result. Please let me know where is the mistake. And I don't want to use Linear Layout.
Here is the xml file
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<RelativeLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/custom_relativeLayout1"
android:orientation="horizontal"
android:background="#ffffff">
</RelativeLayout>
</LinearLayout>
String[] but = {"Hello", "Bye"};
int buttonCount = 0;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
customLayout = (RelativeLayout) findViewById(R.id.custom_relativeLayout1);
//customLayout is object of relativelayout.
buttonCount = but.length;
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
Button [] butArray = new Button[buttonCount];
for (int i = 0; i < 2; i++)
{
butArray[i] = new Button(this);
butArray[i].setLayoutParams(params);
RelativeLayout.LayoutParams Btnparams = (RelativeLayout.LayoutParams) butArray[i].getLayoutParams();
butArray[i].setText(but[i]);
butArray[i].setId(i+1); // Setting the ids
butArray[i].setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_launcher, 0, 0);
butArray[i].setBackgroundColor(Color.TRANSPARENT);
if (butArray[i].getId() != 1)
{
Btnparams.addRule(RelativeLayout.RIGHT_OF, butArray[i-1].getId());
butArray[i].setLayoutParams(Btnparams);
customLayout.addView(butArray[i]);
}
else
{
butArray[i].setLayoutParams(Btnparams);
customLayout.addView(butArray[i]);
}
}
RelativeLayout.RIGHT_OFhoryzontally or vertically align?
so for vertically
Btnparams.addRule(RelativeLayout.BELOW, butArray[i-1].getId());
customLayout.addView(butArray[i], Btnparams);
or for horizontally
Btnparams.addRule(RelativeLayout.RIGHT_OF, butArray[i-1].getId());
customLayout.addView(butArray[i], Btnparams);
instead of
Btnparams.addRule(RelativeLayout.RIGHT_OF, butArray[i-1].getId());
butArray[i].setLayoutParams(Btnparams);
customLayout.addView(butArray[i]);
LinearLayout is very nice to use if you want do dynamically add Views and scale them the same. For example if you want to add buttons and have max 3 buttons per row, you can also use another LinearLayout to make a new row.
I 'abuse' the LinearLayout row and a Button for layoutparams templating.
Layout file:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ll_root"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout android:id="#+id/ll_row1"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/btn1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button 1"/>
<Button
android:id="#+id/btn2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button 2"/>
</LinearLayout>
</LinearLayout>
Example code:
// Get LL and template params
LinearLayout root = (LinearLayout) findViewById(R.id.ll_root);
LinearLayout row1 = (LinearLayout) findViewById(R.id.ll_row1);
ViewGroup.LayoutParams llRowParams = row1.getLayoutParams();
ViewGroup.LayoutParams btnParams = findViewById(R.id.btn1).getLayoutParams();
// Make new button
Button newBtn = new Button(context);
newBtn.setLayoutParams(btnParams);
newBtn.setText("Button 3");
// Add button to row1
row1.addView(newBtn);
// Add new row
LinearLayout row2 = new LinearLayout(context);
row2.setLayoutParams(llRowParams);
root.addView(row2);
// TODO: add buttons to new row
// TODO: some logic to decide between adding to row or creating new row and adding button
Note: code is not tested, but you should get the idea.
buttonCount = but.length;
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
Button [] butArray = new Button[buttonCount];
for (int i = 0; i < 2; i++)
{
butArray[i] = new Button(this);
butArray[i].setLayoutParams(params);
RelativeLayout.LayoutParams Btnparams = (RelativeLayout.LayoutParams) butArray[i].getLayoutParams();
butArray[i].setText(but[i]);
butArray[i].setId(i+1); // Setting the ids
butArray[i].setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_launcher, 0, 0);
butArray[i].setBackgroundColor(Color.TRANSPARENT);
if (i != 0) {
Btnparams.addRule(RelativeLayout.RIGHT_OF, i-1);
}
customLayout.addView(butArray[i], Btnparams);
}

Create a line with points to draw a "Bus path"

I was trying to create something like this: http://s28.postimg.org/a8zi7d4rx/Stop.jpg
My original idea is to create a CanvasImage and X textviews on the right. Then draw with Canvas some dots.
Now i'm stuck at the beginnig; I can't add 2 textview dynamically, 1 below the first.
Here is my code and the screenshot of the result.
What should i do?
Does someone knows if there is any complete example?
Thanks!
public class MainActivity extends Activity {
final int N = 10; // total number of textviews to add
final TextView[] myTextViews = new TextView[N]; // create an empty array;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
RelativeLayout l = (RelativeLayout) findViewById(R.id.lLayout);
//fist txtview
final TextView rowTextView1 = new TextView(this);
rowTextView1.setText("This is the first row");
RelativeLayout.LayoutParams p1 = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.WRAP_CONTENT,
RelativeLayout.LayoutParams.WRAP_CONTENT);
p1.addRule(RelativeLayout.RIGHT_OF, findViewById(R.id.imageView1).getId());
l.refreshDrawableState();
l.addView(rowTextView1,p1);
l.requestLayout();
myTextViews[0] = rowTextView1;
for (int i = 1; i < N; i++) {
final TextView rowTextView = new TextView(this);
rowTextView.setText("This is row #" + i);
RelativeLayout.LayoutParams p = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.WRAP_CONTENT,
RelativeLayout.LayoutParams.WRAP_CONTENT);
p.addRule(RelativeLayout.RIGHT_OF, findViewById(R.id.imageView1).getId());
//p.addRule(RelativeLayout.ALIGN_BOTTOM, myTextViews[i-1].getId());
p.addRule(RelativeLayout.BELOW, rowTextView1.getId());
p.setMargins(10, 10, 10, 10);
l.addView(rowTextView, p);
l.refreshDrawableState();
myTextViews[i] = rowTextView;
}
}
}
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<RelativeLayout
android:id="#+id/lLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#AEEEEE"
>
<ImageView
android:id="#+id/imageView1"
android:layout_width="10dp"
android:layout_height="fill_parent"
android:background="#000000"
android:contentDescription="Base" />
</RelativeLayout>
and the result is here: http://s18.postimg.org/e1z3yvlpl/Result.png

set two radio buttons in one row then next two radio is on second row and so on

i want to set 2 two radiobuttons one row , then next 2 radiobuttons on second row dynamically(Programmatically) I am new to android any body have idea or sample code of it. What i have do is:
RadioGroup radiogroup = (RadioGroup)findViewById(R.id.RadioGroup01);
for(int i=0;i<10;i++) {
RadioButton rdbtn = new RadioButton(this);
rdbtn.setId(i);
rdbtn.setText("test");
LinearLayout ll = new LinearLayout(this);
ll.setOrientation(LinearLayout.HORIZONTAL);
ll.addView(rdbtn);
radiogroup.addView(rdbtn);
ll.addView(radiogroup);
//i%2 == 0
}
You can use below code:
Activity code:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
for(int row=0; row < 5; row++)
{
LinearLayout ll = new LinearLayout(this);
ll.setOrientation(LinearLayout.HORIZONTAL);
for(int i = 0; i < 2; i++) {
RadioButton rdbtn = new RadioButton(this);
rdbtn.setId((row * 2) + i);
rdbtn.setText("test " + rdbtn.getId());
ll.addView(rdbtn);
}
((ViewGroup)findViewById(R.id.radiogroup)).addView(ll);
}
}
activity_main.xml:
<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"
tools:context=".MainActivity" >
<RadioGroup
android:id="#+id/radiogroup"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"/>
</RelativeLayout>
Output on screen:
Hope this is what you were looking for. Cheers!

Categories

Resources