I want to make a layout in xml for a Fragment class. This layout have to be match_parent width and height.
Picture 1
In picture 1, the layout has four items added programatically...
Picture 2
In picture 2 is the same layout but with 6 items.
none of these layouts examples are scrollable, so if i add 8 items, all items has to fit to
the screen size.
how can i do this?
You can uses ScrollView.
if you use GridView now, ScrollView is contain GridView.
Or
You use over scroll mode if ifContentScrolls mode.
You can do it simply: refer to the LinearLayout by id, and add children programatically. If you want its children to have the same height, set their height to 0px and their weight to the same, 1 for instance. Since its children will be Linearlayouts as well, you can add the items manu1, menu2, etc to them without problem. I don't know you exact usage, but it's a start.
You can do this using layout_weight attribute in LinearLayout as below...
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="horizontal" >
<TextView
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#000000"
android:text="Menu 1" />
<TextView
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#FFFFFF"
android:text="Menu 2" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="horizontal" >
<TextView
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#FFFFFF"
android:text="Menu 1" />
<TextView
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#000000"
android:text="Menu 2" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="horizontal" >
<TextView
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#000000"
android:text="Menu 3" />
<TextView
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#FFFFFF"
android:text="Menu 4" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="horizontal" >
<TextView
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#FFFFFF"
android:text="Menu 5" />
<TextView
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#000000"
android:text="Menu 6" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="horizontal" >
<TextView
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#000000"
android:text="Menu 7" />
<TextView
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#FFFFFF"
android:text="Menu 8" />
</LinearLayout>
</LinearLayout>
Related
Trying to align button at Bottom using LinearLayout, but getting just below TextView.
To set button at bottom, I am using android:layout_gravity="bottom" but still not done
LinearLayout xml
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"/>
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_gravity="bottom"
android:layout_height="wrap_content">
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Bottom" />
</LinearLayout>
</LinearLayout>
Change second linear layout to
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal" >
This will put the button at the bottom and this layout will take the rest of the space
Yoy have to use like this....
<RelativeLayout
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center">
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Bottom" />
</RelativeLayout>
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"/>
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"/>
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:layout_width="fill_parent"
android:layout_gravity="bottom"
android:layout_height="wrap_content">
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Bottom" />
</LinearLayout>
</LinearLayout>
I could not use the suggested answer as I had multiples of 3 vertical ones (each with specific weights) inside a horizontal one. So, ended up using margin top for specific button/widget instead. Working fine so far.
Did not want to change to RelativeLayout as that meant many changes in this scenario.
This question already has answers here:
Why are nested weights bad for performance? Alternatives?
(6 answers)
Closed 4 years ago.
I want to display an organized grid. So I use LinearLayout and Layout Weight option, every thing works perfectly, but I don't understand how to avoid this warning in the Button A and the Button C:
Nested weights are bad for performance
And this is my XML code :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<!-- First row. -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:weightSum="2" >
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="A" />
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="B" />
</LinearLayout>
<!-- Second row. -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:weightSum="2" >
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="C" />
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="D" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
How can I avoid this error please ?
You can only ignore this warning if you want to keep this layout.
Add to the root of your layout: xmlns:tools="http://schemas.android.com/tools". Then in your buttons add tools:ignore="NestedWeights".
This can be also done in eclipse by putting the cursor on the yellow line and pressing ctrl + 1. You can choose ignore.
If you want to improve performance, you can use a TableLayout
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/tableLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TableRow
android:id="#+id/tableRow1"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:padding="5dip" >
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="A" />
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="B" />
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:padding="5dip" >
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="C" />
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="D" />
</TableRow>
</TableLayout>
This occurs because you could have performance impact while rendering the component, to be accomodate Layout to fix in parent a letter Button to fix accordingly Buttons to space of LinearLayout,just remove layout_weightof the LinearLayout
One way to avoid this warning is to flatten your layout by replacing the outer LinearLayout with a RelativeLayout.
The other thing that pops out to me is that the first child LinearLayout is completely unnecessary. It has only one child (another LinearLayout), so it isn't really doing anything.
With a RelativeLayout, you can simplify this layout to:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/row1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2" >
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="A" />
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="B" />
</LinearLayout>
<LinearLayout
android:id="#+id/row2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_below="#+id/row1"
android:weightSum="2" >
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="C" />
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="D" />
</LinearLayout>
</RelativeLayout>
I've tried various solutions asked here on stackoverflow for the same problem but nothing is working for me. I want to display two text views under two list views. My code is this
<LinearLayout
....>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:weightSum="2" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2" >
<ListView
android:id="#+id/lv1InBS"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1" >
</ListView>
<ListView
android:id="#+id/lv2InBS"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1" >
</ListView>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2" >
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="TextView"
android:textColor="#800000"
android:typeface="serif" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="TextView"
android:textColor="#800000"
android:typeface="serif" />
</LinearLayout>
</LinearLayout>
....
Please help. I've been sick trying to correct it.
Thanks.
ok you should try this methodology,
first take a simple linear layout with vertical orientation,
than add two list view and two text views in the way you want it on the screen,
than go to grafical editor and select first component, either listview or text view than click on the distribute waight evenly button given on the upper panel of the graphical editor.
This will work for sure.
<LinearLayout 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:orientation="vertical"
tools:context=".MainActivity" >
<TextView
android:id="#+id/welcome"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/hello_world" />
<ListView
android:id="#+id/listView1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
</ListView>
<ListView
android:id="#+id/listView2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
</ListView>
<TextView
android:id="#+id/welcome"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/hello_world" />
<TextView
android:id="#+id/welcome"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/hello_world" />
add this in your xml and have a look,because it is working for me.
Ok , here is a way to do it, by combining the Weight attribute of android views and Horizontal/Vertical LinearLayouts
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical" >
<ListView
android:id="#+id/ListView01"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
</ListView>
<TextView
android:id="#+id/TextView01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical" >
<ListView
android:id="#+id/listView1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
</ListView>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
</LinearLayout>
The first Horizontal Linearlayout acts as a container for the two parallel rows.
inside each row there are two vertical layouts ( by using equal weights and *layout_width="0"*) the layouts would split the screen in half.
Inside each LinearLayout a listView item (with height set to zero and weight to 1) and a textview item with any values you want.
How to display the layout with a ListView at top and mutliple Buttons at the bottom (as in pic)
Below is the code that I tried (Problem is the buttons are overlapping the list which is somewhat visible behind the buttons & the 3 buttons are not equal is size though I used the weight sum):
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:weightSum="3" >
<Button
android:id="#+id/bDone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Done" />
<Button
android:id="#+id/bCancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Cancel" />
<Button
android:id="#+id/bSelAll"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Select All" />
</LinearLayout>
<ListView
android:id="#android:id/list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" >
</ListView>
</RelativeLayout>
What I did is basically do a 2 linear layouts, 1 for the list and 1 for the button. Also setting the weight = 1 and the width = 0 will make them equal size
This code worked for me:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="5dip"
android:layout_marginBottom="5dip"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_above="#+id/footerlayout"
android:id="#+id/listviewlayout">
<ListView
android:id="#+id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
</ListView>
</LinearLayout>
<LinearLayout android:id="#+id/footerlayout"
android:layout_marginTop="3dip"
android:layout_height="45dip"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:gravity="center"
android:layout_alignParentBottom="true">
<Button
android:id="#+id/bDone"
android:text="Done"
android:layout_width="0dip"
android:layout_height="40dip"
android:layout_weight="1">
</Button>
<Button
android:id="#+id/bCancel"
android:text="Cancel"
android:layout_width="0dip"
android:layout_height="40dip"
android:layout_weight="1"
>
</Button>
<Button
android:id="#+id/bSelAll"
android:text="Select All"
android:layout_width="0dip"
android:layout_height="40dip"
android:layout_weight="1"
>
</Button>
</LinearLayout>
</RelativeLayout>
Add to LinearLayout id property and add this to ListView
android:layout_above="#id/linear_layout_id"
To make buttons equal size change in their properties this
android:layout_width="wrap_content"
to this
android:layout_width="match_parent"
I am trying to create a custom tabbed layout with a viewflipper. Therefore, I need two buttons side-by-side at the top of the screen. I have this. However, I am trying to get the viewFlipper content below these two buttons. Here is my current XML (which does not show the textviews)
<LinearLayout
android:id="#+id/linearLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#FAFAFA"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
android:id="#+id/linearLayout02"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button android:id="#+id/button1" android:text="button 1" android:layout_height="wrap_content" android:layout_width="0dip" layout_weight = ".5"/>
<Button android:id="#+id/button2" android:text="button 2" android:layout_height="wrap_content" android:layout_width="0dip" layout_weight = ".5"/>
</LinearLayout>
<RelativeLayout
android:id="#+id/relativeLayout01"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:layout_below="#id/linearLayout02">
<ViewFlipper
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:id="#+id/viewFlipper01">
<include
android:id="#+id/one"
layout="#layout/view_one" />
<include
android:id="#+id/two"
layout="#layout/view_two" />
</ViewFlipper>
</RelativeLayout>
</LinearLayout>
Your LinearLayout that contains the buttons has a layout_height="fill_parent". You need to set that to wrap_content and also specify the orientation="vertical" in the parent LinearLayout. You'll also need to specify a layout_weight for the view that you want to stretch to fill.
Because linearLayout01 LinearLayout has its layout_height set to fill_parent, android is going to make it take up the reset of the screen. The content below that will not be visible at all because it is off the screen.
<LinearLayout
android:id="#+id/linearLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
android:id="#+id/linearLayout02"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button android:id="#+id/button01" android:layout_height="wrap_content" android:text="Button 1" android:layout_width="0dip" android:layout_weight="1"></Button>
<Button android:id="#+id/button02" android:layout_height="wrap_content" android:text="Button 2" android:layout_width="0dip" android:layout_weight="1"></Button>
</LinearLayout>
<RelativeLayout
android:id="#+id/relativeLayout01"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ViewFlipper
android:id="#+id/flipper01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:id="#+id/textview01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text"
/>
<TextView
android:id="#+id/textview02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text2"
/>
</ViewFlipper>
</RelativeLayout>
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<Button android:id="#+id/button01"
android:layout_height="wrap_content"
android:text="Button 1"
android:layout_width="0dip"
android:layout_weight="1" />
<Button android:id="#+id/button02"
android:layout_height="wrap_content"
android:text="Button 2"
android:layout_width="0dip"
android:layout_weight="1" />
<ViewFlipper
android:id="#+id/flipper01"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<RelativeLayout
android:id="#+id/relativeLayout01"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1">
<!-- Screen 1: Wherever view you want to display on the first screen -->
</RelativeLayout>
<RelativeLayout
android:id="#+id/relativeLayout02"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1">
<!-- Screen 2: Wherever view you want to display on the second screen -->
</RelativeLayout>
</ViewFlipper></LinearLayout>
Generally, you have to ViewFlipper that contains the two or more layout that you want to display when, for example, click a buttom and whatever you want to see in all of screen, write outside of ViewPager tag.