Nested vertical layout in horizontal layout - android

I'm creating an android app and I want to create a layout that has two buttons side by side and three buttons underneath. An example of what I am trying to do can be found here:
http://mycolorscreen.com/2014/11/29/flatdrop-zw-skin/
I am struggling to get the two buttons to be side by side in a horizontal linear layout and also have the three buttons in a vertical linear layout. Since the first linear layout is horizontal it will make my buttons become horizontal as well. My code is as follows:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context=".MainActivity"
android:weightSum="1">
<TextView
android:layout_width="164dp"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/textView2"
android:layout_gravity="left"
android:layout_weight="0.1" />
<TextView
android:layout_width="174dp"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/textView"
android:layout_gravity="right"
android:layout_weight="0.1" />
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
style="#style/AppTheme"
android:longClickable="false"
android:weightSum="1">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/btnFitnessGoalsDefaultString"
android:textColor="#FFFFFF"
android:id="#+id/btnFitnessGoals"
android:background="#drawable/buttondefault"
android:layout_marginBottom="10dp"
android:layout_weight="0.10"
android:layout_gravity="top" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:text="#string/btnNutritionGoalsDefaultString"
android:textColor="#FFFFFF"
android:id="#+id/btnNutritionGoals"
android:background="#drawable/buttondefault"
android:layout_weight="0.10" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/btnBonusEventsDefaultString"
android:textColor="#FFFFFF"
android:id="#+id/btnBonusEvents"
android:background="#drawable/buttondefault"
android:layout_weight="0.10" />
</LinearLayout>
</LinearLayout>

You need to do something like this
<LinearLayout
android:orientation="vertical">
<LinearLayout
android:orientation="horizontal">
<!-- horizontal buttons here -->
</LinearLayout>
<LinearLayout
android:orientation="vertical">
<!-- vertical buttons here -->
</LinearLayout>
</LinearLayout>

Use something like this:
<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" >
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_weight="1"
android:text="Button" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<Button
android:id="#+id/button3"
android:layout_width="match_parent"
android:layout_height="50dp"
android:text="Button" />
<Button
android:id="#+id/button4"
android:layout_width="match_parent"
android:layout_height="50dp"
android:text="Button" />
<Button
android:id="#+id/button5"
android:layout_width="match_parent"
android:layout_height="50dp"
android:text="Button" />
</LinearLayout>
</LinearLayout>

A little bit simpler:
<LinearLayout
android:orientation="vertical">
<LinearLayout
android:orientation="horizontal">
<!-- horizontal buttons here -->
</LinearLayout>
<!-- vertical buttons here -->
</LinearLayout>

This layout will work fine with all device screen. try with it .
<?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" >
<!-- 2 buttons side by side -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal" >
<!-- btn 1 -->
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#00ff00"
android:foreground="?android:attr/selectableItemBackground" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Button 1" />
</FrameLayout>
<!-- btn 2 -->
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#446600"
android:foreground="?android:attr/selectableItemBackground" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Button 2" />
</FrameLayout>
</LinearLayout>
<!-- three buttons underneath -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:orientation="vertical" >
<!-- btn 3 -->
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#dd77ff"
android:foreground="?android:attr/selectableItemBackground" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Button 3" />
</FrameLayout>
<!-- btn 4 -->
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#9977ff"
android:foreground="?android:attr/selectableItemBackground" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Button 4" />
</FrameLayout>
<!-- btn 5 -->
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#1277ff"
android:foreground="?android:attr/selectableItemBackground" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Button 5" />
</FrameLayout>
</LinearLayout>

<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<TextView
android:id="#+id/costOperatingText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Operating cost:" />
<TextView
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="0"/>
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="6">
<TextView
android:id="#+id/earnings"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Daily Earnings: " />
<TextView
android:id="#+id/earningsValue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="0" />
</LinearLayout>

Related

Linear layout inside Frame Layout

I have the following code in Android Studio in which I have two Linear Layouts inside a Frame layout. However, the buttons in both layout map on top of each other. Is it possible to have the two linear layouts (including the buttons) placed next to each other vertically rather than being mapped on top of peach other?
<FrameLayout 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"
android:background="#FFFFFF"
tools:context="com.dji.GSDemo.GoogleMap.MainActivity">
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent"
class="com.google.android.gms.maps.SupportMapFragment" />
<FrameLayout
android:id="#+id/fram_map"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/locate"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Locate"
android:layout_weight="1"/>
<Button
android:id="#+id/add"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Add"
android:layout_weight="1"/>
<Button
android:id="#+id/clear"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Clear"
android:layout_weight="1"/>
<Button
android:id="#+id/btn_draw_State"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Free Draw" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/config"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Config"
android:layout_weight="0.9"/>
<Button
android:id="#+id/upload"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Upload"
android:layout_weight="0.9"/>
<Button
android:id="#+id/start"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Start"
android:layout_weight="1"/>
<Button
android:id="#+id/stop"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Stop"
android:layout_weight="1"/>
</LinearLayout>
</FrameLayout>
The following is a screenshot of how the buttons appears.
Try to change FrameLayout to LinearLayout in the root of xml code .
And set android:orientation="vertical"
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/fram_map"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/locate"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Locate" />
<Button
android:id="#+id/add"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Add" />
<Button
android:id="#+id/clear"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Clear" />
<Button
android:id="#+id/btn_draw_State"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Free Draw" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/config"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.9"
android:text="Config" />
<Button
android:id="#+id/upload"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.9"
android:text="Upload" />
<Button
android:id="#+id/start"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Start" />
<Button
android:id="#+id/stop"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Stop" />
</LinearLayout>
</LinearLayout>
FrameLayout will layout all children in the same frame on screen.
If you want multiple children to stack vertically or horizontally, you can wrap them in a LinearLayout instead. In this case, you can simply replace that root FrameLayout with a LinearLayout with android:orientation="vertical" to stack the two LinearLayouts vertically.

Align android layout with equal margin

I am adding a footer to my app which will contain three buttons with image. I want similar to below view. I have tried android:layout_gravity="right/left/center" but seems not working.
Below is my XML
<RelativeLayout 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"
>
<!-- Root element should wrap to parent size. -->
<!-- Your view xml codes. -->
<!--Bottom bar layout should be in root element. Parent should be Relative layout so that we can always align to parent bottom-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:weightSum="4">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="left"
android:orientation="vertical"
>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/brands"
/>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="brands"
/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
android:layout_gravity="center_horizontal"
>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/stores"
/>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="brands"
/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="1"
android:layout_gravity="right"
>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/coupons"
/>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="brands"
/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
<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">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/brands"
/>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="brands"
/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/shops"
/>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="shops"
/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/coupons"
/>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="coupons"
/>
</LinearLayout>
</LinearLayout>
Try Something like this,
LinearLayout(Horizontal)
- LinearLayout(Vertical)
- ImageView (for the image)
- Textview (for title)
- LinearLayout(Vertical)
- ImageView (for the image)
- Textview (for title)
- LinearLayout(Vertical)
- ImageView (for the image)
- Textview (for title)
Your parent LinearLayouthave android:weightSum="4" and your child LinearLayout all sum is 3.
so change your parent LinearLayout weightSum android:weightSum="4" to android:weightSum="3".
Update :
add this way
<RelativeLayout 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"
>
<!-- Root element should wrap to parent size. -->
<!-- Your view xml codes. -->
<!--Bottom bar layout should be in root element. Parent should be Relative layout so that we can always align to parent bottom-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:weightSum="3">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/brands"
android:layout_gravity="center_horizontal"
/>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="brands"
android:layout_gravity="center_horizontal"
/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/stores"
android:layout_gravity="center_horizontal"
/>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="brands"
android:layout_gravity="center_horizontal"
/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="1">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/coupons"
android:layout_gravity="center_horizontal"
/>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="brands"
android:layout_gravity="center_horizontal"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
<RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- Root element should wrap to parent size. -->
<!-- Your view xml codes. -->
<!--Bottom bar layout should be in root element. Parent should be Relative layout so that we can always align to parent bottom-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:weightSum="3">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/brands" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="brands" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/stores" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="brands" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/coupons" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="brands" />
</LinearLayout>
</LinearLayout>
Try this. I think it will solve your problem.
Please try this
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:weightSum="3">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical"
android:padding="5dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/brands" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="brands" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical"
android:padding="5dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/stores" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Stores" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical"
android:padding="5dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/coupons" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Coupons" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Give equal weight to layouts
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical"
android:layout_height="wrap_content">
<ImageView
android:layout_width="24dp"
android:src="#android:drawable/ic_menu_rotate"
android:layout_height="24dp" />
<TextView
android:layout_width="wrap_content"
android:text="#string/description"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical"
android:layout_height="wrap_content">
<ImageView
android:layout_width="24dp"
android:src="#android:drawable/ic_menu_rotate"
android:layout_height="24dp" />
<TextView
android:layout_width="wrap_content"
android:text="#string/description"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical"
android:layout_height="wrap_content">
<ImageView
android:layout_width="24dp"
android:src="#android:drawable/ic_menu_rotate"
android:layout_height="24dp" />
<TextView
android:layout_width="wrap_content"
android:text="#string/description"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
change all inner layouts
android:layout_gravity="left"
android:layout_margin="10dp"//as required
and change
android:weightSum="3"
in parent layout

Equal width of all buttons

I want to achieve the following layout.
How do I make the button 0 equal to rest of the buttons. Please note that I have used layout_weight = "1" so that all of the rest of the buttons are of equal length while matching the parent. Since, I have created button 0 on a different layout so I can't seem to make it of equal length with other buttons.
Here's my code so far
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/seven"
android:layout_gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="wrap_content" />
<Button
android:id="#+id/eight"
android:layout_gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="wrap_content" />
<Button
android:id="#+id/nine"
android:layout_gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/zero"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
Take the zero button out of the LinearLayout, I assume there is another layout all this are defined in, like a relative layout? and try something to this effect.
<RelativeLayout 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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin" tools:context=".MainActivity">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout">
<Button
android:id="#+id/seven"
android:layout_gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="wrap_content" />
<Button
android:id="#+id/eight"
android:layout_gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="wrap_content" />
<Button
android:id="#+id/nine"
android:layout_gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="wrap_content" />
</LinearLayout>
<Button
android:id="#+id/zero"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/linearLayout"
android:layout_marginTop="98dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
Take the last button in another linearlayout and further add linearlayout in it with weight, try this code....
<?xml version="1.0" encoding="utf-8"?>
<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"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/seven"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="1" />
<Button
android:id="#+id/eight"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="1" />
<Button
android:id="#+id/nine"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"></LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<Button
android:id="#+id/zero"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"></LinearLayout>
</LinearLayout>
here is the output

Position of buttons in LinearLayout

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>

Text Positioning below titlebar

I need to display some text just below title bar has shown below ,few text on left side and few on right side,how to align accordingly.
<?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:background="#android:color/white">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ShowRoom"
android:textColor="#android:color/black"
android:textStyle="bold"/>
</LinearLayout>
I have to us this textview for the entire layout but need to postion one below the other in left left and right side has in image
titlebar.xml
<?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:orientation="horizontal"
android:id="#+id/titlebar" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
android:weight="1" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:text="Showroom" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
android:weight="1" />
</LinearLayout>
activity_text.xml
<?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" >
<include layout="#layout/titlebar" />
<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"
android:layout_margin="10dp" >
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:text="12345617890" />
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:text="Ramakrisha Trippp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:text="9876543210" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="right"
android:layout_weight="1"
android:layout_margin="10dp"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:text="13/1/2015" />
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:text="Rohit Sharma" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
Add this in your layout before setcontentView to hide your default action bar
this.requestWindowFeature(Window.FEATURE_NO_TITLE);

Categories

Resources