Develop Reference

Three buttons evenly divided linear layout

So, I am trying to use a linear layout to hold three different buttons, each should take up 33% of the width on one line. This linear layout will be below all the other content in my relative layout, which holds all the other widgets on this activity. Unfortunately, when I add the third button into the layout, the other two have a white bar along the bottom of them and the third button (in this case the home button) is positioned higher than the others.
Can someone explain this behavior and how to rectify it? Thanks.
This is the XML file for the linear layout, I've removed all the text for the other widgets. If that would be helpful, I can post it as well.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true">
<Button
android:layout_width="0dp"
android:layout_weight=".33"
android:layout_height="wrap_content"
android:text="#string/adfazsdfasdfadfsagjlfkdlgjklfsadgfjgps"
android:onClick="resetDates"
android:background="#drawable/sumbitstyleing"
android:id="#+id/resetDatesButton" />
<Button
android:layout_width="0dp"
android:layout_weight=".33"
android:layout_height="wrap_content"
android:text="#string/home"
android:onClick="home"
android:id="#+id/homeButtonSearch"
android:background="#drawable/generalbutton" />
<Button
android:layout_weight=".33"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/submitchanges"
android:onClick="submitChanges"
android:background="#drawable/sumbitstyleing"
android:id="#+id/submitchanges" />
</LinearLayout>
The first picture is WITHOUT the third button, the second picture is WITH the third button.

Try this, I have removed Properties you should use with RelativeLayout and unnecessary with LinearLayout, and buttons aligned horizontally,
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
and assigned Weightsum to LinearLayout along with button height to match parents
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:weightSum="1">
<Button
android:id="#+id/resetDatesButton"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".33"
android:onClick="resetDates"
android:text="Rese check dates" />
<Button
android:id="#+id/homeButtonSearch"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".33"
android:onClick="home"
android:text="home" />
<Button
android:id="#+id/submitchanges"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".33"
android:onClick="submitChanges"
android:text="submit changes" />
</LinearLayout>
</RelativeLayout>
Result

Here you can go this way :
<?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"
android:background="#color/white"
>
<LinearLayout
android:layout_width="300dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_centerHorizontal="true"/>
<!--Buttons -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="3"
>
<android.support.v7.widget.AppCompatButton
android:id="#+id/motor_team_send_sms_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/send_sms"
/>
<android.support.v7.widget.AppCompatButton
android:id="#+id/motor_team_sleep_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/sleep"
/>
<android.support.v7.widget.AppCompatButton
android:id="#+id/motor_team_rise_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/rise"
/>
</LinearLayout>
Output is:
This might help you.

Try this, in your LinearLayout add android:gravity="center"
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center">
...
</LinearLayout>

Custom dialog height to match content

This is my custom dialog, there are some textboxs and two buttons.
I'm using a RelativeLayout on it.
I'd like the dialog size to match the content, not all that blank space under there.
I don't want to use explicit pixel heights (it's not good practice).
Another thing, there's a way to have some space between every view?
This is my XML
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/txt_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="8pt"
android:textStyle="italic" />
<TextView
android:id="#+id/txt_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_below="#+id/txt_desc"
android:textSize="8pt" />
<TextView
android:id="#+id/txt_place"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_below="#+id/txt_date"
android:textSize="8pt" />
<Button
android:id="#+id/btn_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/txt_place"
android:layout_toRightOf="#+id/view"
android:text="#string/btn_close" />
<View
android:id="#+id/view"
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_centerHorizontal="true" />
<Button
android:id="#+id/btn_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/txt_place"
android:layout_toLeftOf="#+id/view"
android:drawableLeft="#android:drawable/ic_menu_edit"
android:text="#string/btn_edit" />
</RelativeLayout>

First question
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
Second question
Plus use android:marginTop="5dp" if you want to separate a View from Top for 5 dp.
marginLeft|Right|Bottom are also available.
<TextView
android:id="#+id/txt_place"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp" <-----------------
android:layout_below="#+id/txt_date"
android:textSize="8pt" />
By the way, if I were you, I'd nest some layouts to make order. You can have a general Relative Layout, then 2 linear layouts: one horizontal for TextViews and one vertical for Buttons. You can definely play with your editor and try to make the best appearance for your dialog.
EDIT
Try this one:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#0000"
android:orientation="vertical"
android:paddingBottom="50dp" >
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/txt_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="prova"
android:textSize="8pt"
android:textStyle="italic" />
<TextView
android:id="#+id/txt_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="prova"
android:textSize="8pt" />
<TextView
android:id="#+id/txt_place"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="prova"
android:textSize="8pt" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<Button
android:id="#+id/btn_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableLeft="#android:drawable/ic_menu_edit"
android:text="btn_edit" />
<Button
android:id="#+id/btn_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="btn_close" />
<View
android:id="#+id/view"
android:layout_width="0dp"
android:layout_height="1dp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I've hard-coded the texts. The main idea is to use a big container layout in background, which is trasparent (background=#0000) and in top of that a layout in wrap_content containing your Views.
If this solution doesn't resolve your problem, I think you could edit height directly in your code. Try to relate to this question

Set your relative layout's height to wrap_content.
For example:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- More XML -->
</RelativeLayout>
Also be aware that fill_parent is deprecated for widths and heights.
You can add either margin (extra space outside a view) or padding (extra space inside a view) with android:layout_margin or android:padding respectively. There are also variants such as layout_marginTop that only apply to a specific side of the view.

Is there a way to offset a view from center?

I'm trying to possition my button not exactly in center, but let's say in the 2/5s of the screen height, I was looking for attribute unsuccessfully, so I tried this approach
<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:background="#drawable/background"
android:padding="20dp" >
<ImageButton
android:id="#+id/flashlight_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_above="#+id/fakeView"
android:background="#null"
android:contentDescription="#string/flashlight_button_description"
android:src="#drawable/freeml_bright" />
<View
android:id="#+id/fakeView"
android:layout_width="10dp"
android:layout_height="10dp"
android:layout_centerInParent="true"
android:background="#FFAABB" />
</RelativeLayout>
However it does not work, even if I set margin on the fake view.
Padding attribute works, however as it is a big image and if I want it to start at 2/5ths of screen height, it covers the center point of screen, so if I use padding attribute it works but it pushes it away from center and does not allow it to cover it.
Alhough, I made it work using LinearLayout, which I wanted to avoid because there are more Views on top and bottom next to each other so it would lead to nested views using linear layout. Unfortunately I think its the only option.
It basically it uses another linear layout that fills the remaining space left unused by top and bottom views with height=0dp and weight=1 and sets its gravity to center.
<?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"
android:padding="20dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/application_logo_description"
android:src="#drawable/mylight" />
<ImageButton
android:id="#+id/settings_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:background="#null"
android:contentDescription="#string/settings_button_description"
android:src="#drawable/settings_button" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" >
<ImageButton
android:id="#+id/flashlight_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
android:contentDescription="#string/flashlight_button_description"
android:src="#drawable/flashlight_button_selector" />
<View
android:id="#+id/fakeView"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="60dp"
android:background="#FFAABB" />
</LinearLayout>
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:contentDescription="#string/powered_by_description"
android:src="#drawable/powered_by" />
<ImageButton
android:id="#+id/ad_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:background="#null"
android:contentDescription="#string/ad_button_description"
android:src="#drawable/freeml" />
</LinearLayout>

Depending on the screen size of the target device, padding by X dp might move it more than just a fifth of the height.
You might have to code this movement yourself. However, nothing prevents you from doing:
<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:background="#drawable/background"
android:padding="20dp" >
<View
android:id="#+id/fakeView"
android:layout_width="10dp"
android:layout_height="10dp"
android:layout_centerInParent="true"
android:background="#FFAABB" />
<ImageButton
android:id="#+id/flashlight_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_above="#+id/fakeView"
android:marginBottom="50dp"
android:background="#null"
android:contentDescription="#string/flashlight_button_description"
android:src="#drawable/freeml_bright" />
</RelativeLayout>

Don't use margin, use padding (top), like so:
<View
android:id="#+id/fakeView"
android:layout_width="10dp"
android:layout_height="10dp"
android:layout_centerInParent="true"
android:paddingTop="80dp"
android:background="#FFAABB" />
That should work, though I've not tested it!

try using attribute android:layout_toLeftOf="#+id/fakeView"

Android text will not align to center

I have a TextView and 3 Buttons centered in a RelativeLayout, and the text in all three of them is left-justified with the parent center as the leftmost line.
I've tried changing the gravity of the TextView, Buttons, and layout but nothing is working and I'm baffled because I've never seen Android align text like this before.
I want the Button text to be centered within each Button and the top text to be center-justified.
An image of what it looks like is here: http://i.stack.imgur.com/9lHEd.png
Here's 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" >
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_margin="20dp"
android:gravity="center_horizontal"
android:text="#string/greeting"
android:textAppearance="?android:attr/textAppearanceLarge" />
<Button
android:id="#+id/startQuizButton"
android:layout_width="280dp"
android:layout_height="wrap_content"
android:layout_below="#+id/textView1"
android:layout_centerHorizontal="true"
android:onClick="#string/startQuiz"
android:text="#string/start_quiz" />
<Button
android:id="#+id/lessonsButton"
android:layout_width="280dp"
android:layout_height="wrap_content"
android:layout_below="#+id/startQuizButton"
android:layout_centerHorizontal="true"
android:onClick="#string/startLesson"
android:text="#string/lessonsString" />
<Button
android:id="#+id/viewAllButton"
android:layout_width="280dp"
android:layout_height="wrap_content"
android:layout_below="#+id/lessonsButton"
android:layout_centerHorizontal="true"
android:onClick="#string/showAll"
android:text="#string/view_all" />

I included a RelativeLayout because you have it as your parent layout. However, i am not sure that it is needed. See if the following code is what you are looking for.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="Greetings" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Start Quiz" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Lessons" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="View all questions" />
</LinearLayout>
</RelativeLayout>

add in button tab android:gravity="center"...see if it works..

u need to set layout width and height to fill_parent and everything will work fine
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:text="your text" />

if you want to centre some text, then you could also do it this way:
<TextView
android:text="Quantity"
android:textSize="34sp"
android:textColor="#ffffff"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="sans-serif-light"
android:layout_centerHorizontal="true"
android:paddingTop="10dp"/>
here i have changed made it horozontal by using android:layout_centerHorizontal="true"which takes a boolean value of true or false, by making it true, it will automatically be centred on all devices
hope that helps

android LinearLayout

I want to lay two TextView to the left, and one button to the right inside a linear layout, is this possible?
The following is my code where I had to hardcode the leftMargin of the button, this is inflexible. Is it possible to layout children that flows in different directions?
<LinearLayout
android:id="#+id/widget43"
android:layout_width="fill_parent"
android:layout_height="100px"
>
<TextView
android:id="#+id/tc_buttom_text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Time elapsed"
>
</TextView>
<TextView
android:id="#+id/tc_buttom_text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="00:00:00 00"
>
</TextView>
<Button
android:id="#+id/tc2_home"
android:layout_width="70px"
android:layout_height="wrap_content"
android:layout_marginLeft="200px"
android:layout_marginRight="10px"
android:text="Home"
android:layout_weight="0.5"
>
</Button>
</LinearLayout>

I want to lay two TextView to the
left, and one button to the right
inside a linear layout, is this
possible?
Not with a single LinearLayout. You either need two LinearLayouts (one for a column of two TextViews on the left), or one RelativeLayout.
Is it possible to layout children that
flows in different directions?
If by "different directions" you mean both vertical and horizontal simultaneously, a single LinearLayout can only go in one direction. Either use nested LinearLayouts or a RelativeLayout.

Either use two linear layout(one with horizontal orientation and other with vertical orientation) or use Relative Layout. Relative Layout is stronger than linear and easy to use

You need to use Table layout. look at table layout example in API demos.
Table layout - with 'stretch columns' = 1,
-- Table row - with width = fill_parent,
-- Text View,
-- Text View,
-- Button,
This will keep your right button pushed to the right edge of the screen

Use Following:
<LinearLayout
android:id="#+id/widget43"
android:layout_width="fill_parent"
android:layout_height="100px"
android:layout_margin="16dp"
android:orientation="horizontal">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/tc_buttom_text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Time elapsed"></TextView>
<TextView
android:id="#+id/tc_buttom_text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="00:00:00 00"></TextView>
</LinearLayout>
<Button
android:id="#+id/tc2_home"
android:layout_width="70px"
android:layout_height="wrap_content"
android:layout_marginLeft="200px"
android:layout_marginRight="10px"
android:layout_weight="0.5"
android:text="Home"></Button>
</LinearLayout>
For More Android Layouts Tutorial and Example: http://www.viralandroid.com/2015/11/android-layouts.html

LinearLayout has an orientation attribute. Try something like this:
<LinearLayout
android:id="#+id/widget43"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="100px"
>

I use two LinearLayouts like this:
<?xml version="1.0" encoding="utf-8"?>
<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:background="#0099cc"
tools:context=".FullscreenActivity">
<!-- The primary full-screen view. This can be replaced with whatever view
is needed to present your content, e.g. VideoView, SurfaceView,
TextureView, etc. -->
<TextView
android:id="#+id/fullscreen_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:keepScreenOn="true"
android:text="#string/dummy_content"
android:textColor="#33b5e5"
android:textSize="50sp"
android:textStyle="bold" />
<!-- This FrameLayout insets its children based on system windows using
android:fitsSystemWindows. -->
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/background_dark"
android:fitsSystemWindows="true">
<LinearLayout
android:id="#+id/fullscreen_content_controls"
style="?metaButtonBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:background="#color/black_overlay"
android:baselineAligned="false"
android:orientation="vertical"
tools:ignore="UselessParent">
<LinearLayout
android:id="#+id/fullscreen_choose_controls"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal">
<TextView
android:id="#+id/fullscreen_esop"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center"
android:text="#string/vs_esop"
android:textAllCaps="false"
android:textColor="#android:color/holo_blue_dark"
android:textSize="50sp"
android:textStyle="bold" />
<Button
android:id="#+id/dummy_button"
style="?metaButtonBarButtonStyle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="0.3"
android:ellipsize="end"
android:gravity="center"
android:text="#string/dummy_button"
android:textColor="#android:color/holo_red_dark"
android:textSize="20sp"
android:textStyle="bold" />
<TextView
android:id="#+id/fullscreen_android"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center"
android:text="#string/vs_android"
android:textAllCaps="false"
android:textColor="#android:color/holo_blue_dark"
android:textSize="50sp"
android:textStyle="bold" />
</LinearLayout>
<TextView
android:id="#+id/fullscreen_make_your_choice"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center"
android:text="#string/vs_make_your_choice"
android:textColor="#android:color/holo_red_dark"
android:textSize="50sp"
android:textStyle="bold" />
</LinearLayout>
</FrameLayout>
</FrameLayout>
Demo