I'm trying to create Buttons in LinearLayout dynamically, and I want to add those in vertical and horizontal way.
At first, add a button A in the layout, and if there's enough space between button A and screen edge, add button B to the right of button A (horizontally). Otherwise, add button B below button A (vertically).
My current layout :
<LinearLayout
android:id="#+id/btn_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
</LinearLayout>
in class :
LinearLayout btnLayout = (LinearLayout) findViewById(R.id.btn_layout);
btnLayout.removeAllViewsInLayout();
for(Tag tag : tagList.getChildTags()) {
Button button = new Button(this);
button.setId(tag.getId());
button.setText(tag.getName());
btnLayout.addView(button);
}
In this case, if I set orientation as horizontal, then some of buttons are not showing (cut-off by screen), and if I set as vertical, it looks pretty bad.
Is there any way to solve this problem? Thanks everyone in advance!
You can achieve this but not in a trivial way. I'll explain how I do something similar (in my case, I add TextViews) to TableRows, if they fit.
With this approach you'll have to use a TableLayout and add TableRows to it with your Buttons. So you might replace your "#+id/btn_layout" LinearLayout to be a TableLayout instead.
Firstly, to get the screen's width, use something like this:
final Display display = getWindowManager().getDefaultDisplay();
final Point size = new Point();
display.getSize(size);
final WindowManager.LayoutParams params = getWindow().getAttributes();
// Your screen's width will be stored within your params.width value
You'll use this to know if the current Button still fits the screen's width within the current TableRow or it has to be added to a new one. So now, use something like this to create your buttons:
int currentRowsWidth = 0;
TableLayout tl = (TableLayout) findViewById(R.id.my_table_layout);
TableRow currentRow = new TableRow();
for (Tag tag : tagList.getChildTags()) {
Button button = new Button(this);
button.setId(tag.getId());
button.setText(tag.getName());
// There's where you check whether it still fits the current `TableRow` or not
if (currentRowsWidth + button.getWidth() < params.width) {
currentRowsWidth += button.getWidth();
currentRow.addView(button);
}
else {
// It doesn't fit, add the currentRow to the table and start a new one
tl.add(currentRow);
currentRow = new TableRow();
currentRow.addView(button);
currentRowsWidth = button.getWidth();
}
}
It might happen that once you get out of the loop there are still Buttons to add in the currentView, simply test it:
if (currentRow.getChildCound() > 0)
tl.add(currentRow);
I'm writing this from head, so some things might not compile at first time, but I hope you get the idea.
Related
I have a header layout that programmatically needs to be divided into 3 equally sized layouts. I tried weights, but nothing showed up, so I hardcoded the height in there and the root layout (extra header) becomes bigger. So they are working but the background color I have assigned them to doesn't show up, the button that is supposed to show inside the right layout doesn't show up and when I use weights instead of hardcoded numbers, the layouts are also not visible. Am I missing something?
private void SetHeader(LinearLayout extraHeader)
{
ImageView btnSettings = new ImageView(this);
btnSettings.SetBackgroundResource(Resource.Drawable.general_btn_dots_horizontal);
btnSettings.LayoutParameters = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WrapContent, LinearLayout.LayoutParams.WrapContent);
LinearLayout lnLeft = new LinearLayout(this);
LinearLayout lnCenter = new LinearLayout(this);
LinearLayout lnRight = new LinearLayout(this);
extraHeader.Orientation = Orientation.Horizontal;
LinearLayout.LayoutParams lpWeights = new LinearLayout.LayoutParams(200, 500);
//lpWeights.Weight = 33;
lnLeft.SetGravity(GravityFlags.Center);
lnCenter.SetGravity(GravityFlags.Center);
lnRight.SetGravity(GravityFlags.Center);
lnLeft.SetBackgroundColor(Android.Graphics.Color.ParseColor("#222222"));
lnCenter.SetBackgroundColor(Android.Graphics.Color.ParseColor("#333333"));
lnRight.SetBackgroundColor(Android.Graphics.Color.ParseColor("#444444"));
lnLeft.LayoutParameters = lpWeights;
lnCenter.LayoutParameters = lpWeights;
lnRight.LayoutParameters = lpWeights;
lnRight.AddView(btnSettings);
extraHeader.AddView(lnLeft);
extraHeader.AddView(lnCenter);
extraHeader.AddView(lnRight);
}
Also: Making the extra header orientation vertical shows my layouts right... only on top of one another and not side by side...
Remember folks: If the layout already has children (i.e.: from the xml) REMOVEALLVIEWS()
I have a piece of code which I use to create a new LinearLayout. Within the layout I wish to add a TextView which contains both a label and a value. Then next to it on the right I want to display the button. I want the button to be located toward the end of the screen, without stretching the button. I am happy with the button width and height as WARP_CONTENT.
How can I achieve this in code? I have barely any XML so using XML is not an option. I am trying to make the app as dynamic as possible, so I decided to steer clear of XML.
Please see the code below:
// Build a button
final Button addButton = new Button(task.getParent());
addButton.setText("Add New");
addButton.setOnClickListener(new View.OnClickListener()
{
#Override
public void onClick(View v)
{
// Open a file picker here to let the user pick a file
}
});
// Build a new layout to hold all the elements
LinearLayout verticalLayout = new LinearLayout(task.getParent());
verticalLayout.setOrientation(LinearLayout.HORIZONTAL);
verticalLayout.addView(sizeTextView);
verticalLayout.addView(addButton);
Thank you guys in advance.
Try this: Add Space (View) between TextView & Button.
// View space = new View(parent_context);
View space = new View(task.getParent());
// Width:0dp, Height:1 & Weight: 1.0
LinearLayout.LayoutParams spaceLP = new LinearLayout.LayoutParams(0, 1, 1.0f);
space.setLayoutParams(spaceLP);
verticalLayout.addView(sizeTextView);
verticalLayout.addView(space);
verticalLayout.addView(addButton);
Add textview with size and gravity,like this:
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,LinearLayout.LayoutParams.WRAP_CONTENT);
params.setLayoutDirection(Gravity.RIGHT|Gravity.CENTER_VERTICAL);
verticalLayout.addView(sizeTextView,params);
To achieve this you should use Relative layout and RelativeLayout.LayoutParams. By using LayoutParams you can set the rule to align your views as per your requirements.
for example
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams)button.getLayoutParams();
params.addRule(RelativeLayout.ALIGN_PARENT_RIGHT);
params.addRule(RelativeLayout.LEFT_OF, R.id.id_to_be_left_of);
button.setLayoutParams(params);
I want to add multiple buttons to a layout programmatically.
However, count of buttons is different every time and I just want them to placed next to each other with a wrap content width. After a line is filled, it should go to next line and continue that way.
What is the cleanest way to achieve that?
Thanks.
LinearLayout verticalLayout = new LinearLayout(context);
verticalLayout.setOrientation(LinearLayout.VERTICAL);
while(isActive) {
LinearLayout horziontalLayout = new LinearLayout(context);
horziontalLayout.setOrientation(LinearLayout.HORIZONTAL);
add buttons here..
//Example Button button = new Button(context);
//horziontalLayout.addView(button);
verticalLayout.addView(horziontalLayout);
isActive = false // when youe done filling up buttons..
}
easiest way should be having a vertical LinearLayout in wich you add multiple horizontal LinearLayout
//vertical one
LinearLayout vlinear = new LinearLayout(this);
vlinear.setOrientation(LinearLayout.VERTICAL);
LayoutParams vlinearParams = new LayoutParams(LayoutParams.MATCH_PARENT,LayoutParams.MATCH_PARENT);
vlinear.setLayoutParams(vlinearParams);
parentgroup.addView(vlinear);
//horizontal lines
for (int i=0;i<numlines){
LinearLayout hlinear = new LinearLayout(this);
hlinear.setOrientation(LinearLayout.HORIZONTAL);
LayoutParams vlinearParams = new LayoutParams(LayoutParams.MATCH_PARENT,LayoutParams.WRAP_CONTENT);
hlinear.setLayoutParams(hlinearParams);
vlinear.addView(hlinear);
///add the loop for adding cells
for...
hlinear.addView(cell);
}
I need to place a dinamic number of buttons in some rows. The number of buttons per row and the size should fit to any screen width.
LinearLayout llh = new LinearLayout(this);
llh.setOrientation(LinearLayout.HORIZONTAL);
for(int i=1; i<=nl; ++i) {
Button b = new Button(this);
b.setText(String.valueOf(i));
if(i>ul) {
b.setFocusable(false);
b.setEnabled(false);
}
llh.addView(b);
}
The problem with this piece of code is that for example, my nl test value is 10, and this only displays 6 buttons, all in the same row, and the last one is smaller than the others.
I need them to stack vertically, like, when there's no space for another button, a new row is created and the rest of the buttons go in there.
Thanks in advance.
Sounds like you are talking about a vertical FlowLayout, where newly added views are stacked vertically until there is no more room, then a new column is started.
Unfortunately Android does not already have a FlowLayout, but you can make your own. Check out this answer by Romain Guy "How can I do something like a FlowLayout in Android?", and watch the video of his talk where he describes how to create one. I learnt a great deal about creating custom layouts by watching this several times until I understood it.
If the width of the screen is less than a certain value, set the weight property to 1 for all buttons. And if the screen width is large enough to fit all your buttons properly, go with the default.
I cannot post the code now as I am far away from my PC.
This is what I came up with. It's not as pretty as I tought but it gets the job done.
Buttons will have fixed size, but that shouldn't be much of a problem.
Thanks for all your help :)
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="top|center_horizontal"
android:orientation="vertical"></LinearLayout>
Display display = getWindowManager().getDefaultDisplay();
Point p = new Point();
display.getSize(p);
int buttonSize = 120;
int n = p.x/buttonSize-1;
LinearLayout llv = (LinearLayout)findViewById(R.id.container);
LinearLayout llh = null;
for(int i=0; i<nl; ++i) {
Button b = new Button(this);
if(i%n==0 || i==0) {
llh = new LinearLayout(this);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
llh.setLayoutParams(params);
llh.setOrientation(LinearLayout.HORIZONTAL);
llv.addView(llh);
}
b.setText(String.valueOf(i+1));
b.setWidth(buttonSize);
if(i>ul) {
b.setFocusable(false);
b.setEnabled(false);
}
llh.addView(b);
}
I have a little issue on what sequence things are being called when adding stuff to a RelativeLayout. I have a class extending Activity (name it RelActivity) where I want to create a RelativeLayout and put several custom Views (name it cusView) into that RelativeLayout. The topMargin and leftMargin of a custom View is calculated by using the position of another custom View (i.e. the first custom View has to be positioned directly by setting a number to topMargin and leftMargin). Please note that the Rules of RelativeLayout is not sufficient in this case.
So, over to the problem. In my RelActivity I do this:
Create a RelativeLayout (name it relLayout)
Iterate a cursor with cusViews recieved from a database
For the first cusView -> Set position by topMargin and leftMargin using a LayoutParameter
For the other cusViews -> calculate their topMargin and leftMargin by using one of the other cusViews and a LayoutParameter
Set RelActivity's contentView to relLayout
What happens is that all cusViews but the first one are squeezed in the top left corner because both leftMargin and topMargin are always calculated to be zero. This happens because I use the width of the cusViews to calculate the topMargin and leftMargin, and the width of the cusView has not given a value yet.
Is the width first calculated in the cusView's overrided method onSizeChanged()? Is the onSizeChanged() method get called first when the layout is presented on the screen? If so, how do I work around this issue? Do I have to calculate the positionings after onSizeChanged() is done?
Edit: Here is a minimum working example:
Here is my onCreate in RelActivity:
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
relLayout = new RelativeLayout(this);
cusViews = new ArrayList<CusView>();
listParams = new ArrayList<RelativeLayout.LayoutParams>();
readDBandSetLayout();
setContentView(relLayout);
}
There is too much information in the readDBandSetLayout() method to present it all here. below are the most important details. If I create the LayoutParams in the following way it works fine, the cusViews are listed downwards and rightwards of eachother:
queryCursor = customApplication.customData.query( number); //Fetches cursor
for ( int i = 0; i < numberOfRows; i++ ){
if ( i == 0 ){
LayoutParams p = new LayoutParams(this.getResources().getDimensionPixelSize(R.dimen.small), this.getResources().getDimensionPixelSize(R.dimen.small));
p.topMargin = 50;
p.leftMargin = 50;
listParams.add(p);
}
else{
LayoutParams p = new LayoutParams(this.getResources().getDimensionPixelSize(R.dimen.large),this.getResources().getDimensionPixelSize(R.dimen.large));
p.addRule(RelativeLayout.BELOW, cusViews.get(i-1).getId());
p.addRule(RelativeLayout.RIGHT_OF, cusViews.get(i-1).getId());
listParams.add(p);
}
relLayout.addView(cusViews.get(i), listParams.get(i));
}
However, what I want to do in the else statement is something like:
else{
LayoutParams p = new LayoutParams(this.getResources().getDimensionPixelSize(R.dimen.large),this.getResources().getDimensionPixelSize(R.dimen.large));
//Here I want to calculate cusView2Topmargin and cusView2Leftmargin based on the widths of the first or previosly positioned cusViews. But here the widths are 0 since they haven't been calculated yet.
p.topMargin = cusView2Topmargin; //Always zero
p.leftMargin = cusView2Leftmargin; //Always zero
listParams.add(p);
}
So the problem lies in that the widths of the cusViews are zero at the point I need them to calculate the layout parameters topMargin and leftMargin.
Unfortunately I cannot use the RelativeLayout's Rules for what I want to achieve. If there were some way to create rules like RelativeLayout.RIGHT_OF and RelativeLayout.BELOW I could do it like that. Is this possible?
Its not very clear what your goal is for this layout. It might well be possible to use a simple LinearLayout to get what you want.
If you want to size these from a database lookup then try simply adding each of the views, using addView() first, storing a reference to each, then go back and sett the margins to place them in the proper positions.