Programmatically added LinearLayouts not equally spaced - android

I am having some spacing trouble when building part of my UI programmatically in Android 4.0. I am trying to add stylized buttons to a stylized LinearLayout. To space the buttons equally, each one is wrapped in a LinearLayout with a weight of 1. I started with a layout defined in XML (somewhat of a proof of concept,) which renders like I expect:
<LinearLayout android:id="#+id/dialog_footer"
android:layout_width="500dp"
android:layout_height="wrap_content"
android:background="#drawable/dialog_footer">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:gravity="center">
<Button android:id="#+id/cancel"
style="#style/Button"
android:layout_width="130dp"
android:layout_height="38dp"
android:text="Cancel" />
</LinearLayout>
<!-- Another LinearLayout with a nested Button like the one above -->
</LinearLayout>
To add buttons programmatically, I removed the inner LinearLayouts and put them in their own layout file that I can inflate and add to the outer LinearLayout in Java. It is nearly identical.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:gravity="center" >
<Button android:id="#+id/button"
style="#style/Button"
android:layout_width="130dp"
android:layout_height="38dp" />
</LinearLayout>
And this is roughly how I'm adding buttons in code:
LinearLayout dialogFooter = (LinearLayout)dialogView.findViewById(R.id.dialog_footer);
LinearLayout wrappedButton = (LinearLayout)getLayoutInflater().inflate(R.layout.dialog_button_wrapped, null);
Button button = (Button)wrappedButton.findViewById(R.id.button);
button.setText(R.string.button_one_text);
// button.setOnClickListener(...);
dialogFooter.addView(wrappedButton);
The buttons appear but now they are grouped together and shifted to the left. Is there something Android does when it parses a Layout that I would need to do myself if I'm adding to the dialog_footer? Since weights come into play here, I thought that calling setWeightSum() on the container I'm adding to (dialog_footer) might be necessary but that didn't help. Does anyone have any ideas what might be causing the difference between the XML and Java approaches?

I believe this is your problem:
LinearLayout wrappedButton = (LinearLayout)getLayoutInflater().inflate(R.layout.dialog_button_wrapped, null);
The null should be replaced with the parent view , so that it will get the layoutParams you want to set for it .
Another thing is about the weight you set - you should set the width/height to 0px so that the weight won't cause the layout process work in a weird/inefficient way .
BTW , you can remove the inner layout (that has the button) and use a single button instead. just set the layout_gravity there to center_horizontal .

Related

Android Layout proplem

I have a layout contain one image and 3 text field
I've tried to align the image to right and text field to left but I've failed
I've used
android:layout_gravity="right" for image and left to text but it did not work also I've used end and start in gravity with no success
this is the layout code:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="2dp"
android:layout_marginBottom="2dp"
android:orientation="vertical"
android:background="#drawable/card_background">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/listthumb"
android:layout_width="80dp"
android:layout_height="50dp"
android:layout_gravity="center_vertical"
android:contentDescription="Rss video thumbnail"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/listtitle"
style="#style/listTitle"
android:maxLines="3"/>
</LinearLayout>
<TextView
android:id="#+id/shortdescription"
android:layout_width="wrap_content"
android:ellipsize="end"
android:maxLines="2"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/listpubdate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="11dp"/>
</LinearLayout>
</FrameLayout>
Try to use a <RelativeLayout> instead of a <LinearLayout>
With the RelativeLayout you could place a widget depending on the position of another widget
Here the Relative Layout description
Hope this will help, I have not had time to test....
One linear layout should have vertical orientation and contain the 3 text fields.
One linear layout should have horizontal orientation and contain both the above linear layout and the image.
To push two views to the edges of the screen, you can also give each a left/right margin and then put a blank view with weight = 1 in between them.
Please read a bit more on how layouts work on Android and the different types available to you. A LinearLayout will stack the containing Views either Horizontally or Vertically one after the other. A FrameLayout is simply a container and the items within have to position themselves. RelativeLayout allow you to position your views with a relative reference to other views (in your case, you can position your ImageView, and then your 3 TextViews relative to where the ImageView is).
If you can use LinearLayout instead of RelativeLayout, you should do so, as RelativeLayout is always slower, due to having to perform two passes prior to rendering as it needs to measure each view and then also perform the layouts based on that. You might be looking for something like (pseudo-code):
<LinearLayout orientation=horizontal>
<LinearLayout orientation=vertical>
<TextView />
<TextView />
<TextView />
</LinearLayout>
<ImageView />
</LinearLayout>
You have not described your question well . Check below code if it works .
You just forgot to add orientation in linear layout containing one text view and a Image view .
Add Orientation to Your Linear Layout.

Android: Using Object to define View in Layout

My post is based on a previous post and greatly simplified.
(Android: Two Views On Top of Each Other Using XML)
The file/object DrawV populates the screen with pink circles and allows one to touch a circle to make it disappear. In another file, private DrawV drawView = new DrawV(this); This populates the screen but does not participate in the layout.
setContentView(drawView) shows the dots,so I know it works. I want to use a layout named setContentView(R.layout.activity_title); which includes two buttons at the top of the screen and dots below. In other words, I was wondering if there is a method to put the dots shown in some sort of View that can be included with buttons in the same layout.
Any help? Please?
Tell me if you need anything.
If DrawV is an Android View (or extends View), you can include it in a regular xml layout file, and then use that layout file with setContentView(int).
To reference the DrawV class in your layout, you'll need to use the fully-qualified name (with the package).
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/buttons"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/button_one"
android:text="One"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.0" />
<Button
android:id="#+id/button_two"
android:text="Two"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.0" />
</LinearLayout>
<com.example.views.DrawV
android:layout_below="#id/buttons"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
Above, the RelativeLayout is your root view. The LinearLayout, buttons, is a ViewGroup just to hold the two buttons and keep them of equal width (note the layout_width=0dp and equal layout_weight). Your DrawV view will be laid out below the buttons View, and then will match the parent container's width and height (fill it).
If you save this under src/main/res/layout/activity_circles.xml, you'll be able to use setContentView(R.layout.activity_circles) in your Activity to set the layout.

Set view in a middle of an other view in android xml

Anyone know how to set a View (Button) in the middle of another View ? For example i want that the two Buttons on the top or adjust with the middle of the Button connexion. I presice that there is something in the left of my parent view so i cannot align with the layout, thanks
what i have :
what i want :
Place both buttons inside a LinearLayout. The LinearLayout's orientation should be horizontal. Give each button layout_weight of 1. Example:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<Button
android:id="#+id/button1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
</LinearLayout>
You can set android:gravity="center"(or just android:gravity="center_vertical" on your demand) to its parent if you are using LinearLayout.
If you are using RelativeLayout, then you can set the view wherever you want by using layout_alignParentBottom, layout_centerHorizontal, ... and other attrs.
I am not very sure where do you want to put the two buttons at, please try above solutions and give more details (maybe your current xml) if it still can not be solved.

Making a desired layout in Eclipse

I am working on the layout of the android app but i have found that all buttons are fixed in a column in Eclipse atuomatically. What should i do to make it to the desired position like the app shown in the link?? thanks
http://www.dcemu.co.uk/vbulletin/threads/335622-Android-oscilloscope
You could use RelativeLayout instead of LinearLayout in the main.xml file.
In this layout, you can place the components at any place in the layout, but the components are placed relatively to one another.
You can use a mixture of layout to make your view look sound. Also try using the Layout Orientation i.e. either Vertical or horizontal,
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
You could get 2 columns of buttons by having a vertical LinearLayout containing several horizontal LinearLayouts, each containing 2 buttons. Give the buttons equal weights to space them evenly, and some margin to make them look less cluttered.
E.g.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Button 1" />
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Button 2" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Button 3" />
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Button 4" />
</LinearLayout>
</LinearLayout>
Or if the columns were going to be very long, you could use a horizontal linear layout containing 2 vertical linear layouts, and add the buttons to those.
Or you could use a TableLayout with 2 columns and have TableRows containing the buttons (I generally find table layouts harder to work with, perhaps that's just me).
I find it easier to write the xml in Eclipse rather than fiddling round with the graphical editor, then just switch over to the graphical editor every now and again to check it displays how you want. Look around online for a few example layouts and you'll soon get the idea.
To emulate that layout exactly, start with a RelativeLayout as mihail suggests, and use that to position your other layouts (such as your linear layout with buttons) and views.

android - last added item to layout is strech vertical. WHY? (Remake)

[Second Edited]
I found where problem is. But i dont know why its doing. It cant be margin on LinearLayout (or just marginLeft). Does anybody know why it cant have ?
[EDITED]
Hello i have xml file in layout like bellow.And iam adding TextViews from any xml layout to horizontal LinearLayout. This layout structure is given and i cant change it.
And last added TextView is streching always verticaly. I dont know why i am in tottaly despair. Too many hours i was try* that but without no idea. I know just its not in programicaly adding TextViews ..
If some body know why its doing i will be thankful.
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/back_border"
>
<RelativeLayout
android:id="#+id/manager_view_table_header"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
>
<LinearLayout
android:id="#+id/layout_for_textViews"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="6px"
android:layout_alignParentTop="true"
android:gravity="center_vertical"
android:background="#drawable/back_border"
>
<!-- horizontal layout, HERE IAM ADDING TEXTVIEWS -->
</LinearLayout>
</RelativeLayout>
<!--What is here its no important
because, there is RelativeLayout with alignBellow relative layout before -->
</RelativeLayout>
and TextView witch iam addig to LinearLayout:
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="15sp"
android:paddingRight="7px"
android:paddingLeft="7px"
android:paddingTop="3px"
android:paddingBottom="3px"
android:layout_marginLeft="5px"
android:gravity="center_horizontal"
android:background="#drawable/background_table"
android:textColor="#330033"
android:text="Some text"
/>
Try to replace the android:layout_margin="6px" from the LinearLayout by android:padding="6px".
I think this will solve your problem. I mean the new LInearLayout should be like this:
<LinearLayout
android:id="#+id/layout_for_textViews"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="6px"
android:layout_alignParentTop="true"
android:gravity="center_vertical"
android:background="#44ff435f"
>
I am confused with your three layouts. Wat's the porpose of all thses nested layouts, try to recreate the text views with a single relative layout, and use the android:layout_above and android:layout_below for placing the text views.
First of all you need to refactor this code.
You might want to use actual ListView to create repeated elements.
and why is xmlns:android="http://schemas.android.com/apk/res/android" declared thrice in this xml code, when it is actually required just once at top root element.
Even with this layout to solve your problem, if other things are not working a nice idea would be to switch to Graphic layout(bottom tab in eclipse when on .xml file) and manually try to set the third TextView (not listview) height manually, you can observe the changes then and finalize them accordingly..

Categories

Resources