How can I programmatically generate textviews inside layout - java

I need to generate TextView inside a layout from a random, API generated, ArrayList. I cant seem to find a way in which they appear in one line, like a String, one after the other and also shift below once the line has reached the max layout width limit. I want each TextView to be sperate as I want to click them.
Would like to achieve something like this...
This is the current code but the line stops and I don't know how to shift it below. Currently I am using a relative layout as the base layout but it is not necessary.
for (int i = 0; i < abc.size(); i++) {
titleText = new TextView(this);
titleText.setId(i);
titleText.setText(abc.get(i));
relativeLayout.addView(titleText, i);
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.WRAP_CONTENT,
RelativeLayout.LayoutParams.WRAP_CONTENT);
layoutParams.setMargins(10, 10, 10, 10);
layoutParams.addRule(RelativeLayout.RIGHT_OF, titleText.getId() - 1);
titleText.setLayoutParams(layoutParams);
titleText.setTextColor(getResources().getColor(R.color.teal_700));
tvArray.add(titleText);
}

Example
In your xml
<LinearLayout
android:id="#+id/my_ll"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
</LinearLayout>
And write code in yourjava.class
LinearLayout my_ll = (LinearLayout) findViewById(R.id.my_ll);
for(int i=0;i<your_number_of_textviews;i++)
{
TextView text = new TextView(this);
text.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT));
text.setText(""+i);
my_ll.addView(text);
}

I think this solution would have solved it. First before the loop retrieve somewhere the width of the screen by using -
Point screenSizePoint = new Point();
// this gives you the furthest point from 0,0 e.g. 1440x3168
getWindowManager().getDefaultDisplay().getSize(screenSizePoint);
int sum = 0;
Then you retrieve your abc list somewhere.
And then you always compute the width of the current TextView by using this
titleText.measure(View.MeasureSpec.UNSPECIFIED, View.MeasureSpec.UNSPECIFIED);
int width = titleText.getMeasuredWidth();
sum += width;
if (sum >= screenSizePoint.x) {
// shift to next line
}
and sum it up with the width of text views placed before and if the width is bigger than the screen width you just begin on another line.

Related

place images inside a layout android

I want to place some images (triggered on click action) inside a layout. I have to place them such that they don't get out of the parent layout.
Code I'm using to add a new image on clicking the layout:
LinearLayout layout = (LinearLayout) findViewById(R.id.layout);
ImageView image = new ImageView(this);
LinearLayout.LayoutParams coordinates = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
image.setLayoutParams(coordinates);
image.setImageResource(R.drawable.image);
layout.addView(image);
If I press on the layout , I must see my imageView put randomly.
Random random = new Random();
int x = random.nextInt(layout.getWidth());
int y = random.nextInt(layout.getHeight());
image.setX(x);
image.setY(y);
But this won't do it. And I see those images outside my layout too.
You are setting x & y which are upper left-top corner - starting point of image to display it. As x/y value can be right/bottom corner, therefore, your image goes out of layout in that case.
Please note - x, y are starting point from where your image will be drawn.
You need to make sure that layoutWidth - x >= imageWidth and layoutHeight - y >= imageHeight.

How to set random TextView's position inside linear layout?

I have a linearlayout on xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rootlayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
</LinearLayout>
And I add dynamic 100 textviews inside it by code below:
llayout = (LinearLayout) findViewById(R.id.rootlayout);
for (int i = 0; i < 100; i++) {
TextView tv = new TextView(this);
tv.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT,
LayoutParams.WRAP_CONTENT));
int randomInt = new Random().nextInt(100) +1 ;
tv.setText(""+randomInt);
llayout.addView(tv);
}
The result is 100 textviews added and display vertically. This is not as my expect. I want these textviews display with random position inside the layout look like the image below:
How to do it? Thank you!
LinearLayout is for layouting its children linearly (as the name suggests).
As there is no RandomLayout, you can use a RelativeLayout with random left and top layout margins, or an AbsoluteLayout and set random x and y.
Edit: Avoid overlapping texts
Random positions can of course lead to overlapping and it would be up to you to adjust the positions or ignore positions too similar to previous ones. Or you might actually compare the bounding boxes (left, top, width, height) of the view you're about to add to all other views in the container and if there is any overlapping, find another place for it.
You can use tv.setX(position) and tv.setY(position) for show view on specific position

How I can create buttons one next to the other inside Relativelayout usigin Java code?

I am creating many button from JSON using java code
Relativelayout rl = (Relativelayout) findById(R.id.layout_productos);
...
JSONArray jsonArray = new JSONArray(tmp.getString("productos"));
Button bt[] = new Button[jsonArray.length()];
for (int i = 0; i < jsonArray.length(); i ++){
final float scale = getResources().getDisplayMetrics().density;
int padding_40dp = (int) (40 * scale + 0.5f);
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, padding_40dp);
bt[i] = new Button(DetalleServicioActivity.this);
bt[i].setText(jsonArray.getJSONObject(i).getString("nombre"));
bt[i].setTag(jsonArray.getJSONObject(i).getString("id_producto"));
bt[i].setTextColor(Color.parseColor("#FFFFFF"));
bt[i].setBackgroundColor(Color.parseColor("#D8D8D8"));
bt[i].setLayoutParams(params);
bt[i].setEnabled(false);
bt[i].setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
}
});
rl.addView(bt[i]);
}
inside Relativelayout
<RelativeLayout
android:id="#+id/layout_productos"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
>
</RelativeLayout>
The problem is when is run the app, the buttons are created one upon another one.
But I need that they are located one next to the other and when the screen of a line jump approaches the edge to continue
How can I do that??
You need to add rule in order to have them aligned next to eachother. Rules are up to you.
params.addRule(RelativeLayout.RIGHT_OF, previousViewId);

Trouble laying out ImageViews programmatically in RelativeLayout

I'm trying to add five or so ImageViews to a RelativeLayout, with each new one being to the right of the previous one. However, what I get is (apparently) all of them stacked up on each other, as if they were all ALIGN_PARENT_LEFT. Relevant code snippet:
ImageView[] foo = new ImageView[levels];
for (int i = 0; i < levels; i++) {
foo[i] = new ImageView(context);
layoutFoo.addView(foo[i]);
foo[i].setId(10 + i);
if (i == 0) {
RelativeLayout.LayoutParams fooParams = (RelativeLayout.LayoutParams) foo[i].getLayoutParams();
fooParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
foo[i].setLayoutParams(fooParams);
} else {
RelativeLayout.LayoutParams fooParams = (RelativeLayout.LayoutParams) foo[i].getLayoutParams();
fooParams.addRule(RelativeLayout.RIGHT_OF, foo[i-1].getId());
foo[i].setLayoutParams(fooParams);
}
}
Any hints what I'm doing wrong? It shouldn't matter that the ImageViews don't have any width (because I haven't assigned a bitmap to them) yet, right?
Edit: the problem turned out to be not setting a height and width for the ImageView. Solution is to set them either with setLayoutParams() or with the constructor as in JustWork's example.
You must add your ImageViews after setting properties them.
Move this code to end of the for loop:
layoutFoo.addView(foo[i]);
By the way you don't need to ImageView[]. You can accomplish it with one ImageView.
UPDATE:
Here is the code you can do same thing with:
ImageView foo;
RelativeLayout.LayoutParams fooParams;
for (int i = 0; i < levels; i++) {
foo = new ImageView(context);
foo.setId(10 + i);
fooParams = (RelativeLayout.LayoutParams) foo.getLayoutParams(); // I don't understand why you are trying to get params of which hasn't been specified before.
// If I were you, I would do like:
fooParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
if (i == 0) {
fooParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
} else {
fooParams.addRule(RelativeLayout.RIGHT_OF, foo.getId()-1);
}
foo.setImageBitmap(yourBitmap); // Set bitmap.
foo.setLayoutParams(fooParams);
layoutFoo.addView(foo);
}
I think the easiest way to place those images will be using a gallery. Although it's deprecated, I think it's a better idea to do it that way.

How to fix my TableLayout and TableRow into specific positions dynamically?

I'm having problems setting up my TableRow with some TextViews in TableLayout dynamically. I have two pictures, one is my current situation shown, and the other is my mockup, expected situation (the goal which I need to achieve). I do not have any XML layouts; All of these are created programmatically, which is also something I need to achieve.
The snapshots shown are for a High Score screen, where I get a list of players with high scores, and display them altogether in a TableLayout. I'm just having trouble with the row/column positions.
Here's my code:
public void onResume() {
super.onResume();
//=============================================
TextView number = new TextView(this);
number.setText("1");
TextView place = new TextView(this);
place.setText("4th");
TextView testScore = new TextView(this);
testScore.setText("113489");
table = new TableLayout(this);
//rows = new Stack<TableRow>();
TableRow row = new TableRow(this);
row.addView(number);
row.addView(place);
row.addView(testScore);
table.addView(row);
this.setContentView(table);
}
If anyone knows how I should change my code from the Current Situation to the mockup Expected Situation, I gladly appreciate it. If I'm doing something wrong, please post a comment. Thanks in advance.
Set the layout weight of each textview to 1 and the layout width to 0dp. That will cause them to split the available space equally. You could use layout gravity left, center and right as appropriate to further ensure maximum separation.
I just found a good link about TableLayout and TableRow, creating specific positions dynamically. Link is here. Of course, the code here is just the barebones of it, used to demostrate a simple position layout.
Here's my code and the given picture of the result:
public void onResume() {
super.onResume();
//=============================================
dip = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, (float) 1, this.getResources().getDisplayMetrics());
if (dip <= 0)
dip = 1;
TextView number = new TextView(this);
TextView place = new TextView(this);
TextView testScore = new TextView(this);
number.setText("1");
place.setText("4th");
testScore.setText("113489");
number.setWidth(50 * dip);
place.setWidth(75 * dip);
testScore.setWidth(150 * dip);
number.setPadding(20*dip, 0, 0, 0);
table = new TableLayout(this);
TableRow row = new TableRow(this);
row.addView(number);
row.addView(place);
row.addView(testScore);
table.addView(row, new TableLayout.LayoutParams(TableLayout.LayoutParams.WRAP_CONTENT, TableLayout.LayoutParams.WRAP_CONTENT));
this.setContentView(table);
}
I'm actually astonished that there's a method for obtaining the DIP unit. Should've searched for that in the first place. :P

Categories