I'm trying to follow the guidelines laid out by the Android team from this document:
https://docs.google.com/file/d/0Bz3qX4EBhUvwZWlHekI3Y0wxSUk/edit
According to the doc I should use these framework resources.
This is my code, but none of the borders show. Any ideas?
<LinearLayout
android:id="#+id/buttonLayout"
style="?android:buttonBarButtonStyle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:divider="?android:dividerVertical"
android:orientation="horizontal"
android:showDividers="middle" >
<Button
android:id="#+id/button1"
style="?android:buttonBarButtonStyle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Test" />
<Button
android:id="#+id/button2"
style="?android:buttonBarButtonStyle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Test" />
</LinearLayout>
Note: I understand there is a similar/exact question, but my resource seems to be more recent, yet the solution presented by the Google team doesn't work.
The top border is a "divider" which separates elements in a linear layout. If your buttons bar is on the bottom of a vertical layout, you have to activate the display of the divider, in the vertical layout. Generally, I do that by adding these attributes:
android:showDividers="middle"
android:divider="?android:dividerHorizontal"
android:dividerPadding="8dp"
The full layout code:
<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:divider="?android:dividerHorizontal"
android:dividerPadding="8dp"
android:orientation="vertical"
android:showDividers="middle" >
<TextView
android:id="#+id/url"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:text="dummyText" />
<LinearLayout
style="?android:buttonBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/button1"
style="?android:buttonBarButtonStyle"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button1" />
<Button
android:id="#+id/button2"
style="?android:buttonBarButtonStyle"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button2" />
</LinearLayout>
</LinearLayout>
You have the wrong style in LinearLayout. It should be
style="?android:buttonBarStyle"
Not...
style="?android:buttonBarButtonStyle"
Example:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/buttonLayout"
style="?android:attr/buttonBarStyle"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Test"/>
<TextView
android:layout_height="wrap_content"
android:text="TextView (Place Holder)"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:layout_margin="15dp"/>
<LinearLayout
style="?android:attr/buttonBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/button2"
style="?android:attr/buttonBarButtonStyle"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Test"/>
<Button
android:id="#+id/button3"
style="?android:attr/buttonBarButtonStyle"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Test"/>
</LinearLayout>
</LinearLayout>
Example 2 (ListView):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/buttonLayout"
style="?android:attr/buttonBarStyle"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ListView
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_weight="1.0"/>
<LinearLayout
style="?android:attr/buttonBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/button2"
style="?android:attr/buttonBarButtonStyle"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Test"/>
<Button
android:id="#+id/button3"
style="?android:attr/buttonBarButtonStyle"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Test"/>
</LinearLayout>
</LinearLayout>
I ran into the same issue following the document. The solution provided by user3055552 will give the middle divider but no top divider when there aren't other views on buttons.
Try:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical">
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="?android:attr/dividerVertical"/>
<LinearLayout style="?android:buttonBarStyle"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button style="?android:buttonBarButtonStyle"
android:id="#+id/back"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="#string/back"/>
<Button style="?android:buttonBarButtonStyle"
android:id="#+id/next"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="#string/next"/>
</LinearLayout>
</LinearLayout>
Preview
You can create this without using a button with just color of views.Try this
<LinearLayout
android:id="#+id/bottom_bar"
android:layout_width="match_parent"
android:layout_height="48dp"
android:layout_alignParentBottom="true"
android:background="#2B1B17" >
<TextView
android:id="#+id/tv_cancel"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="Cancel"
android:textColor="#drawable/text_changepassword_selector"
android:textSize="19sp" />
<View
style="#style/Divider"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp" />
<TextView
android:id="#+id/tv_apply"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="Select"
android:textColor="#drawable/text_changepassword_selector"
android:textSize="19sp" />
</LinearLayout>
Related
I've added 5 buttons (see below), I need that reset button should be equally align as that of the above two buttons in order to maintain uniformity. Also I am not able to align submit button exact below of GoodButton.
<LinearLayout
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:orientation="horizontal">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="2dp"
android:layout_weight="0"
android:text="1" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="4dp"
android:layout_weight="0"
android:text="1" />
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:layout_weight="0"
android:background="#android:color/darker_gray"></View>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="4dp"
android:layout_weight="2"
android:text="Good" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="4dp"
android:layout_weight="1"
android:text="Reset" />
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:layout_weight="0"
android:background="#android:color/darker_gray"></View>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="4dp"
android:layout_weight="1"
android:text="Submit" />
</LinearLayout>
</LinearLayout>
I feel it is due to extra layout margin space i have added on top buttons.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_weight="1"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<Button android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"></Button>
<Button android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"></Button>
</LinearLayout>
<Button android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"></Button>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_weight="1"
android:layout_height="match_parent">
<Button android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"></Button>
<Button android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"></Button>
</LinearLayout>
</LinearLayout>
Use it, exactly what you need
Using nested weight can bring performance issues.
This design can easily be achieved by using Relative layout.
Check this code
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="wrap_content" android:orientation="horizontal" android:weightSum="1"
android:layout_margin="10dp">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.25"
android:text="1" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.25"
android:text="2" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="5"
android:text="3" />
</LinearLayout>
<LinearLayout
android:layout_below="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="wrap_content" android:orientation="horizontal" android:weightSum="1"
android:layout_margin="5dp">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:text="4" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:text="5" />
</LinearLayout>
your problem is that you are not distributing well the weight of the views.
You must apply weight to both horizontal LinearLayout and then try to distribute the weight of their child views equally.
See my example above:
<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:padding="5dp"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="2"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1">
<Button
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight=".5"/>
<Button
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight=".5" />
</LinearLayout>
<Button
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Good" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_marginRight="4dp"
android:layout_weight="1"
android:text="Reset" />
<Button
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="Submit" />
</LinearLayout>
You can also use a TableLayout like this:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TableRow>
<Button
android:layout_marginRight="2dp"
android:text="1" />
<Button
android:layout_marginRight="4dp"
android:text="1" />
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#android:color/darker_gray" />
<Button
android:layout_marginLeft="4dp"
android:layout_weight="1"
android:text="Good" />
</TableRow>
<TableRow>
<Button
android:layout_marginRight="4dp"
android:layout_span="2"
android:text="Reset" />
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#android:color/darker_gray" />
<Button
android:layout_marginLeft="4dp"
android:layout_weight="1"
android:text="Submit" />
</TableRow>
</TableLayout>
I am doing Fragment with picker elements. I have two pickers (NumberPicker and TimePicker) in a LinearLayout and I want to align them.
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="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<Switch
android:id="#+id/buscar_instalaciones_horario_fragment_switch1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" />
<TextView
android:id="#+id/buscar_instalaciones_horario_fragment_tv_subtitulo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="30dp"
android:text="#string/del_14_de_junio_al_31_de_agosto"
android:textAppearance="?android:attr/textAppearanceSmall" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_horizontal">
<RadioGroup
android:id="#+id/buscar_instalaciones_horario_fragment_radiogroup"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<RadioButton
android:id="#+id/buscar_instalaciones_horario_fragment_radiobutton_abierto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Apertura"
android:checked="true"
android:layout_weight="1"/>
<RadioButton
android:id="#+id/buscar_instalaciones_horario_fragment_radiobutton_cerrado"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Cierre"
android:layout_weight="1"/>
</RadioGroup>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal">
<NumberPicker
android:id="#+id/buscar_instalaciones_horario_fragment_diasdelasemanaPicker"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1" />
<TimePicker android:id="#+id/buscar_instalaciones_horario_fragment_timePicker"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"/>
</LinearLayout>
</LinearLayout>
Now this is the screen:
As you can see, the two pickers are not aligned.
Change this Piece of code
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="horizontal">
<NumberPicker
android:id="#+id/buscar_instalaciones_horario_fragment_diasdelasemanaPicker"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" />
<TimePicker android:id="#+id/buscar_instalaciones_horario_fragment_timePicker"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
</LinearLayout>
edited:
Solved by Adding this line in LinearLayout
android:gravity="center_vertical"
Currently I having some trouble putting a thin line between my two buttons and a line above both of them similar to the one from the action bar.
Right now my buttons looks like this:
I am trying to get this:
Not exactly sure what to do. I am trying to implement this but no luck:
android how to make some space between buttons and make white line above each of them
Here is my xml file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Button
android:id="#+id/block_button"
style="?android:attr/borderlessButtonStyle"
android:layout_width="170dp"
android:layout_height="100dp"
android:layout_weight="1"
android:drawableLeft="#drawable/ic_action"
android:gravity="center_horizontal|center_vertical"
android:text="#string/block_apps"
android:textSize="20sp"
android:layout_alignTop="#+id/start_button"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
<Button
android:id="#+id/start_button"
style="?android:attr/borderlessButtonStyle"
android:layout_width="170dp"
android:layout_height="100dp"
android:layout_gravity="right"
android:layout_weight="1"
android:drawableLeft="#drawable/ic_timer"
android:gravity="center_horizontal|center_vertical"
android:text="#string/start_apps"
android:textSize="20sp"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
</RelativeLayout>
you just have to draw a line with width set to 1 and height to match_parent`
<LinearLayout
android:layout_marginTop="20sp"
android:orientation="horizontal"
android:background="#color/app_yellow"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:gravity="center"
android:layout_width="0sp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Login"
android:id="#+id/btnlogin"
android:layout_gravity="center_vertical"
android:background="#color/app_yellow"
android:textColor="#color/white"
android:onClick="Login"
android:stateListAnimator="#null"
/>
<View
android:background="#ffffff"
android:layout_marginTop="4sp"
android:layout_marginBottom="4sp"
android:layout_width="1sp"
android:layout_height="match_parent"/>
<Button
android:layout_width="0sp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Register"
android:id="#+id/button7"
android:background="#color/app_yellow"
android:layout_gravity="center_vertical"
android:textColor="#color/white"
android:onClick="goDash"
android:stateListAnimator="#null"
/>
</LinearLayout>`
Use FrameLayout as delimiter.
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#dddddd"
android:layout_marginBottom="5dp">
</FrameLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/button"
android:layout_weight="1"/>
<FrameLayout
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#dddddd"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp">
</FrameLayout>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/button2"
android:layout_weight="1"
/>
</LinearLayout>
</LinearLayout>
I need to have buttons appear below a listview. Any help will be greatly appreciated. I've tried different ways to get this specific layout to appear correctly on android, but so far I haven't been able to figure this out. I want to be able to display a listview in the middle of the app and have buttons under the listview. The problem is that I have other things that need to be displayed on the screen on top of the listview such as tabs and spinners. All of the items in the listview will have both an image and some text to the right of the image. The image that I'd like to achieve is like this image...
android layout image
Here's my code so far...
<?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:maxLines="100"
android:orientation="vertical"
android:scrollbars="vertical" >
<Button
android:id="#+id/readWebpage"
android:layout_width="match_parent"
android:layout_height="40dp"
android:onClick="onClick"
android:text="Load Webpage" >
</Button>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:maxLines="100"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_centerInParent="true"
android:orientation="horizontal">
<Spinner
android:id="#+id/genre"
android:entries="#array/genre_list"
android:layout_weight="0.40"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="1dp" />
<Spinner
android:id="#+id/sort"
android:entries="#array/sort_list"
android:layout_weight="0.40"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="1dp" />
<Spinner
android:id="#+id/page"
android:entries="#array/page_list"
android:layout_weight="0.20"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="1dp" />
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView" />
<Button
android:id="#+id/previousPage"
android:layout_weight="0.50"
android:layout_width="0dp"
android:layout_height="40dp"
android:onClick="onClick"
android:layout_alignParentBottom="true"
android:text="Previous Page" >
</Button>
<Button
android:id="#+id/nextPage"
android:layout_weight="0.50"
android:layout_width="0dp"
android:layout_height="40dp"
android:onClick="onClick"
android:layout_alignParentBottom="true"
android:text="Next Page" >
</Button>
</LinearLayout>
</LinearLayout>
Use RelativeLayout to control the position of ListView.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<Button
android:id="#+id/readWebpage"
android:layout_width="match_parent"
android:layout_height="40dp"
android:onClick="onClick"
android:text="Load Webpage" >
</Button>
<LinearLayout
android:id="#+id/spinner"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/readWebpage"
android:layout_marginTop="1dp"
android:orientation="horizontal" >
<Spinner
android:id="#+id/genre"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.40"
android:entries="#array/genre_list" />
<Spinner
android:id="#+id/sort"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.40"
android:entries="#array/sort_list" />
<Spinner
android:id="#+id/page"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.20"
android:entries="#array/page_list" />
</LinearLayout>
<ListView
android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/button"
android:layout_below="#+id/spinner" />
<LinearLayout
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal" >
<Button
android:id="#+id/previousPage"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_weight="0.50"
android:onClick="onClick"
android:text="Previous Page" >
</Button>
<Button
android:id="#+id/nextPage"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_weight="0.50"
android:onClick="onClick"
android:text="Next Page" >
</Button>
</LinearLayout>
</RelativeLayout>
Set the layout_weight of the buttons to 0 and then set the layout_weight of the listview to 1. The layout_weight is use to allocate extra space, so the buttons will keep their 40dip height and the listview will expand to take up the remaining space
Use the following 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:maxLines="100"
android:orientation="vertical"
android:scrollbars="vertical" >
<Button
android:id="#+id/readWebpage"
android:layout_width="match_parent"
android:layout_height="40dp"
android:onClick="onClick"
android:text="Load Webpage" >
</Button>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerInParent="true"
android:gravity="center"
android:maxLines="100"
android:orientation="horizontal" >
<Spinner
android:id="#+id/genre"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="1dp"
android:layout_weight="0.40"
android:entries="#array/genre_list" />
<Spinner
android:id="#+id/sort"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="1dp"
android:layout_weight="0.40"
android:entries="#array/sort_list" />
<Spinner
android:id="#+id/page"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="1dp"
android:layout_weight="0.20"
android:entries="#array/page_list" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ListView
android:id="#+id/listView"
android:layout_weight="3"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight="1" >
<Button
android:id="#+id/previousPage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_weight="1"
android:onClick="onClick"
android:text="Previous Page" >
</Button>
<Button
android:id="#+id/nextPage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_weight="1"
android:onClick="onClick"
android:text="Next Page" >
</Button>
</LinearLayout>
</LinearLayout>
</LinearLayout>
I want to have several layouts inside a layout so that I can better organize the UI. What I want is the layout to be horizontal. I need the layout to be split in half horizontally down the middle and the 4 buttons and text box to be on one side and copied on the other side as well so it can keep track of two totals. I only have one set of buttons right now because I cant get the layouts right.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="250.0dip"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="vertical" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#id/button_add"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="1.0"
android:text="+1" />
<Button
android:id="#id/button_add_5"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="1.0"
android:text="+5" />
</LinearLayout>
<EditText
android:id="#id/currentlife"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:inputType="number"
android:minWidth="120.0dip"
android:text="20"
android:textSize="40.0dip" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#id/button_minus"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="1.0"
android:text="-1" />
<Button
android:id="#id/button_minus_5"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="1.0"
android:text="-5" />
</LinearLayout>
</LinearLayout>
How about this (fix id's so they aren't duplicate):
<?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:orientation="horizontal" >
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1.0"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:gravity="center"
>
<EditText
android:id="#+id/currentlife"
android:layout_width="wrap_content"
android:gravity="center"
android:minWidth="120dp"
android:layout_height="wrap_content"
android:inputType="number"
android:text="20"
android:textSize="40dp" />
</LinearLayout>
<LinearLayout
android:layout_height="0dp"
android:layout_width="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content"
android:gravity="center"
>
<Button
android:id="#+id/button_add"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:text="+1" />
<Button
android:id="#+id/button_add_5"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:text="+5" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:orientation="horizontal"
android:gravity="center"
>
<Button
android:id="#+id/button_minus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="-1" />
<Button
android:id="+#id/button_minus_5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="-5" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#android:color/black"/>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1.0"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:gravity="center"
>
<EditText
android:id="#+id/currentlife"
android:layout_width="wrap_content"
android:gravity="center"
android:layout_height="wrap_content"
android:inputType="number"
android:minWidth="120dp"
android:text="20"
android:textSize="40dp" />
</LinearLayout>
<LinearLayout
android:layout_height="0dp"
android:layout_width="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
android:layout_gravity="right"
>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content"
android:gravity="center"
>
<Button
android:id="#+id/button_add"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:text="+1" />
<Button
android:id="#+id/button_add_5"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:text="+5" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:orientation="horizontal"
android:gravity="center"
>
<Button
android:id="#+id/button_minus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="-1" />
<Button
android:id="+#id/button_minus_5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="-5" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
Give weight for two horizontal layouts.
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight="1.0">
// try this and let me know is it ok for ur requirement ?
<?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="wrap_content"
android:padding="5dp"
android:gravity="center" >
<Button
android:id="#+id/button_add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="+1" />
<Button
android:id="#+id/button_add_5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="+5" />
<EditText
android:id="#+id/currentlife"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:inputType="number"
android:gravity="center"
android:text="20"
android:textSize="40dp" />
<Button
android:id="#+id/button_minus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="-1" />
<Button
android:id="#+id/button_minus_5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="-5" />
</LinearLayout>
You can create left and right layouts as separate layouts and inflate it in the main layout. This will simplify the layout design.
And try to start the design with android:layout_width="fill_parent" instead of android:layout_width="250.0dip"
Once you get the layout you want, then try to adjust the width as you need.