Develop Reference

Unable to implement when try to center horizontal edittext in linearlayout and add a textview at its left side

I have a LinearLayout horizontal and have an EditText center_horizontal and everything is ok but when I try to add a TextView to its left side (of the EditText) the EditText moves to the right because both control TextView and EditText get centered. My problem is that I want that the EditText keeps in the center and the TextView to its left without moving the center position of the EditText. this is my code without the TextView
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/txtTituloFechaAgenda"
android:orientation="horizontal"
android:weightSum="2"
android:id="#+id/ll1agenda"
android:background="#color/azul"
android:gravity="center_horizontal"
>
<EditText
android:inputType="date"
android:ems="10"
android:layout_alignParentTop="true"
android:id="#+id/etFechaAgenda"
style="#style/textoETFecha"
android:background="#drawable/style_edit_text1"
android:layout_height="37dp"
android:gravity="center_horizontal"
android:layout_width="150dp" />
</LinearLayout>
up to there the EditText is centered ok. next I added the TextView:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/txtTituloFechaAgenda"
android:orientation="horizontal"
android:weightSum="2"
android:id="#+id/ll1agenda"
android:background="#color/azul"
android:gravity="center_horizontal"
>
<TextView
android:text="Fecha: "
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/linearLayout"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
style="#style/textoTitulosBlanco"
android:id="#+id/txtFechaAgenda" />
<EditText
android:inputType="date"
android:ems="10"
android:layout_alignParentTop="true"
android:id="#+id/etFechaAgenda"
style="#style/textoETFecha"
android:background="#drawable/style_edit_text1"
android:layout_height="37dp"
android:gravity="center_horizontal"
android:layout_width="150dp" />
</LinearLayout>
so when I add the TextView both elements are centered and my EditText moves to the right and lose the center position. I hope you can help me. thanks in advance...

One possible solution to your problem could be, (what I understood from the question) to add a third view on right side of edittext and set it's visibility to invisible. (So that it doesn't show itself but takes the space)

These do not work in Linear Layout. They work in Relative Layout
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
Use layout_weight to arrange editText and TextView
<TextView
android:text="Fecha: "
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
style="#style/textoTitulosBlanco"
android:id="#+id/txtFechaAgenda" />
<EditText
android:inputType="date"
android:ems="10"
android:id="#+id/etFechaAgenda"
style="#style/textoETFecha"
android:background="#drawable/style_edit_text1"
android:layout_height="37dp"
android:layout_width="0dp"
android:layout_weight="2"/>

android:layout_centerHorizontal="true"
Make center horizontal true for the edit text using Relative Layout. Try bellow code segment.
<?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:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:padding="4dp"
android:text="Fecha:" />
<EditText
android:id="#+id/editText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:padding="4dp"
android:text="Edit Text" />
</RelativeLayout>

Button not fitting its text

I have a LinearLayout with two buttons. But, when a button has some longer text that needs breaking, the button's height does not expand to fit the text. Instead it crops the text.
Here's what I have:
<LinearLayout
style="?android:attr/buttonBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<Button
android:id="#+id/previous_button"
style="?android:attr/buttonBarButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:text="#string/previous_button"
android:textColor="#color/light_blue" />
<Button
android:id="#+id/next_button"
style="?android:attr/buttonBarButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:text="#string/next_button"
android:textColor="#color/light_blue" />
</LinearLayout>
Any help on why button crops the text?

Try adding android:singleLine="false" property to the problematic button. Hope this solve your problem.
If it doesn't work, probably you'll need to remove the button's default padding by adding android:padding="0dp"

You can make the text to align in multi-lines.
A horizontal LinearLayout aligns the baselines of all its child controls by default. So the first line of text in your multi-line button is vertically aligned with the single line of text in the other buttons.
To disable this behaviour, set android:baselineAligned="false" on the LinearLayout
For Example,
<LinearLayout
android:id="#+id/bottom_linear_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:baselineAligned="false"
android:orientation="horizontal">
<Button
android:id="#+id/two_board_btn_continue"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#drawable/rounded_corner_blue_button"
android:text="#string/continue_bidding"
android:textColor="#android:color/white" />
<Button
android:id="#+id/two_board_btn_checkOut"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#drawable/rounded_corner_blue_button"
android:text="#string/checkout"
android:textColor="#android:color/white" />
<Button
android:id="#+id/two_board_btn_cart"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#drawable/rounded_corner_blue_button"
android:text="#string/add_to_cart"
android:textColor="#android:color/white" />
</LinearLayout>

Just remove #style from Both the buttons.

How much long your Button name. you have already used the match parent. So, only you can do to reduce the textSize of Button. That's All.

How to achieve no padding between two edittext's underlines

Below is part of my current layout
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginBottom="6dp"
android:id="#+id/domainContainer"
android:weightSum="1.0">
<EditText
android:layout_width="wrap_content"
android:layout_height="44dp"
android:inputType="text|textNoSuggestions"
android:id="#+id/txtDomain"
android:theme="#style/LoginEditText"
android:drawableLeft="#drawable/ic_globe"
android:hint="#string/domain"
android:layout_marginRight="0dp"
android:textColorHint="#4F4F4F"
android:paddingRight="0dp"
android:textSize="16sp"
android:gravity="center_vertical|right" />
<EditText
android:layout_weight="1.0"
android:layout_height="44dp"
android:paddingLeft="0dp"
android:layout_marginLeft="0dp"
android:inputType="none|textNoSuggestions"
android:id="#+id/txtHostname"
android:theme="#style/LoginEditText"
android:hint=".mydomain.com"
android:textColor="#9E9E9E"
android:textSize="16sp"
android:clickable="false"
android:cursorVisible="false"
android:focusable="false"
android:focusableInTouchMode="false"
android:layout_width="wrap_content"
android:layout_marginBottom="6dip"
android:gravity="center_vertical|left" />
</LinearLayout>
I have zero padding between the text of the two edittexts, but how would I achieve zero padding between the two underlines of the two edittext views (i.e. so it looks like one long line underline).

You can try to set a negative margin to bring the edittext widgets closer. Be careful as you could cause overlap though.
android:layout_marginRight="-8dp"
That said, I would discourage you from doing that as it can be confusing to the user to have 2 edittext views when it appears to be a single one.

Set Textview + Edittext + Button

I want to put in the same row a TextView, and Edittext and a button but I am having the problem that the button is not aligned properly to left and in small screens edittext fills entire with.
Small screen:
Big Screen:
My codification is as follows:
<LinearLayout
android:id="#+id/layout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/address_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/address_textview"
android:textStyle="bold" />
<EditText
android:id="#+id/address_edittext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="#string/address_textview_hint"
android:imeActionLabel="#string/search_button"
android:imeOptions="actionDone"
android:inputType="textCapWords"
android:nextFocusDown="#id/address_edittext"
android:nextFocusUp="#id/address_edittext"
android:singleLine="true" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="right" >
<Button
android:id="#+id/go_button"
android:layout_width="50dp"
android:layout_height="35dp"
android:text="Go" />
</RelativeLayout>
</LinearLayout>

Apply a weight to your EditText so it will take up as much room as it can while letting the other two elements do the normal wrap_content. To do this, remove the relative layout container and then change the EditText width to "0dp" and give it a layout_weight of "1" as follows:
<LinearLayout
android:id="#+id/layout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/address_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/address_textview"
android:textStyle="bold" />
<EditText
android:id="#+id/address_edittext"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:hint="#string/address_textview_hint"
android:imeActionLabel="#string/search_button"
android:imeOptions="actionDone"
android:inputType="textCapWords"
android:nextFocusDown="#id/address_edittext"
android:nextFocusUp="#id/address_edittext"
android:singleLine="true" />
<Button
android:id="#+id/go_button"
android:layout_width="50dp"
android:layout_height="35dp"
android:text="Go" />
</LinearLayout>

First, many people will tell you that hint is Android's solution for not needing the label. I don't care if you use the label or not but it does save you space, especially on smaller screens. That was just an FYI.
Now, your RelativeLayout that only has a Button appears to be useless...I would remove that. You can use layout_weight so that each View takes up the appropriate amount of space. Make sure to make the layout_width="0dp". So it may look something like
<LinearLayout
android:id="#+id/layout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/address_textview"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:gravity="center"
android:text="#string/address_textview"
android:textStyle="bold" />
<EditText
android:id="#+id/address_edittext"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:hint="#string/address_textview_hint"
android:imeActionLabel="#string/search_button"
android:imeOptions="actionDone"
android:inputType="textCapWords"
android:nextFocusDown="#id/address_edittext"
android:nextFocusUp="#id/address_edittext"
android:singleLine="true" />
<Button
android:id="#+id/go_button"
android:layout_width="0dp"
android:layout_height="35dp"
android:layout_weight="1"
android:text="Go" />
</LinearLayout>
Here I used 2,3,1 for the weights of your TextView, EditText, and Button respectively. You may need to change those to get exactly what you want but that should give you a start.

Layout weigth is ideal for designing layouts that adjust to screen size. However, make sure to set layout_width to 0dp, or it won't work properly.
Use like this:
android:layout_width="0dp"
android:layout_weight="1"

I'm going to assume you mean the button is not properly aligned to the right.
It's because your RelativeLayout's android:width="wrap_content", but it should be android:width="match_parent".
Also, you'd be better off setting your EditText's android:width="0dp" and adding android:weight="1" so that it expands/contracts between screen sizes.

How to set up a layout for EditText and Button aligned by the topline?

I'm trying to create a kind of "Buttoned Edit" control, when EditText and Button controls are placed in the same line. I used a simple LinearLayout:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<EditText
android:id="#+id/editTextFileName"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:ems="10"
android:hint="Database file name"
android:inputType="textUri" />
<Button
android:id="#+id/buttonFileSelect"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minWidth="46dip"
android:text="..." />
</LinearLayout>
The problem is edit box and button are not aligned on the same "topline":
A closer look:
On a different emulators I'm getting a different spacing.
How to make both EditText and Button to be aligned on a topline always?
SOLUTION (thanks to #steevoo and #Mohamed_AbdAllah):
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/buttonFileSelect"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minWidth="46dip"
android:layout_alignParentRight="true"
android:text="..." />
<EditText
android:id="#+id/editTextFileName"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:ems="10"
android:layout_toLeftOf="#id/buttonFileSelect"
android:layout_alignTop="#id/buttonFileSelect"
android:hint="Database file name"
android:inputType="textUri" />
</RelativeLayout>

Try using a RelativeLayout instead and use android:layout_alignTop to align the tops of the Button and the EditText. Also, you can give them the same fixed height (46dip) but this can cause text to be clipped in the EditText