make EditText below TextView - android

I am trying to make each editText stick to its width and be placed exactly below the score I tried to make them each take have of the width of the screen but the white space of the editText took the whole space.
they are both child LinearLayout of a vertical LinearLayout
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/rightScoreTV"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1"
android:textAlignment="center"
android:text="0"
android:textSize="60sp"
android:paddingTop="8dp"/>
<TextView
android:id="#+id/leftScoreTV"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1"
android:textAlignment="center"
android:text="0"
android:layout_alignParentRight="true"
android:textSize="60sp"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:id="#+id/leftET"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:minHeight="40dp"
android:minWidth="70dp"
android:maxLines="1"
android:background="#android:color/white"
android:inputType="number" />
<EditText
android:id="#+id/rightET"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:minHeight="40dp"
android:minWidth="70dp"
android:maxLines="1"
android:background="#android:color/white"
android:inputType="number" />
</LinearLayout>

you can try this below:
<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">
<TextView
android:id="#+id/rightScoreTV"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="8dp"
android:text="0"
android:textAlignment="center"
android:textSize="60sp"/>
<EditText
android:id="#+id/leftET"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:inputType="number"
android:maxLines="1"
android:minHeight="40dp"
android:minWidth="70dp"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/leftScoreTV"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="0"
android:textAlignment="center"
android:textSize="60sp"
/>
<EditText
android:id="#+id/rightET"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:inputType="number"
android:maxLines="1"
android:minHeight="40dp"
android:minWidth="70dp"/>
</LinearLayout>
</LinearLayout>

You have used wrap_content for your layout_with. From the docs at https://developer.android.com/reference/android/view/View.html
MATCH_PARENT, which means the view wants to be as big as its parent (minus padding)
WRAP_CONTENT, which means that the view wants to be just big enough to enclose its content (plus padding).

You should use layout_weight for your two EditTexts
android:layout_width="0dp"
android:layout_weight="1"

use this:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

Related

layout_weight doesn't behave as expected

In my application I want to position elements under a card view, using layout_weight with values .3 and .7. However It seems that, the space it takes is dependant on the text lengh that my card view holds. Here's the example code:
First card view:
<androidx.cardview.widget.CardView
android:id="#+id/card_view_terminal"
android:layout_width="match_parent"
android:layout_height="118dp"
card_view:cardBackgroundColor="#android:color/white"
card_view:cardCornerRadius="5dp"
android:layout_marginHorizontal="15dp"
card_view:cardElevation="4dp"
android:layout_marginTop="22dp">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginHorizontal="14dp"
android:gravity="center_vertical"
android:weightSum="1">
<androidx.appcompat.widget.AppCompatImageView
android:layout_width="69dp"
android:layout_height="60dp"
android:src="#drawable/use_card_reader"
android:scaleType="centerInside"
android:layout_weight=".3"
android:background="#color/colorAccent"
/>
<LinearLayout
android:background="#87ceeb"
android:layout_weight="0.7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Read Card"
android:textColor="#color/navy"
android:textSize="17sp"
android:textStyle="bold"
android:textAlignment="center"
card_view:fontFamily="#font/assistant_semibold" />
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Click here to read the card"
android:textSize="14sp"
android:fontFamily="#font/assistant"
android:textColor="#color/navy"
android:textAlignment="textStart"
/>
</LinearLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>
Second Card view:
[![<androidx.cardview.widget.CardView
android:id="#+id/manual_entry"
android:layout_width="match_parent"
android:layout_height="118dp"
card_view:cardBackgroundColor="#android:color/white"
card_view:cardCornerRadius="5dp"
android:layout_marginHorizontal="15dp"
card_view:cardElevation="4dp"
android:layout_marginTop="22dp"
>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="14dp"
android:weightSum="1"
android:gravity="center_vertical"
android:layout_marginEnd="14dp">
<androidx.appcompat.widget.AppCompatImageView
android:layout_width="69dp"
android:layout_height="54dp"
android:src="#drawable/manual_fill"
android:scaleType="centerInside"
android:layout_weight=".3"
android:background="#color/colorAccent"
/>
<LinearLayout
android:background="#87ceeb"
android:layout_weight="0.7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Read Paper"
android:textColor="#color/navy"
android:textSize="17sp"
android:textStyle="bold"
android:textAlignment="center"
card_view:fontFamily="#font/assistant_semibold" />
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is some long explanation text"
android:textSize="14sp"
android:fontFamily="#font/assistant"
android:textColor="#color/navy"
android:textAlignment="textStart"
/>
</LinearLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>
Here's the attached image:
As you can see, the second card has an image that is shorter in length, because the text on the right side is longer. How can I fix this that the views will take exactly .3 and .7 of the space, regardless of the text that comes after?
You need to take static layout height.
<androidx.cardview.widget.CardView
android:id="#+id/card_view_terminal"
android:layout_width="match_parent"
android:layout_height="match_parent"
card_view:cardBackgroundColor="#android:color/white"
card_view:cardCornerRadius="5dp"
android:layout_marginHorizontal="15dp"
card_view:cardElevation="4dp"
android:layout_marginTop="22dp">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="118dp"
android:layout_marginHorizontal="14dp"
android:gravity="center_vertical"
android:weightSum="1">
<androidx.appcompat.widget.AppCompatImageView
android:layout_width="69dp"
android:layout_height="60dp"
android:src="#drawable/use_card_reader"
android:scaleType="centerInside"
android:layout_weight=".3"
android:background="#color/colorAccent"
/>
<LinearLayout
android:background="#87ceeb"
android:layout_weight="0.7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Read Card"
android:textColor="#color/navy"
android:textSize="17sp"
android:textStyle="bold"
android:textAlignment="center"
card_view:fontFamily="#font/assistant_semibold" />
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Click here to read the card"
android:textSize="14sp"
android:fontFamily="#font/assistant"
android:textColor="#color/navy"
android:textAlignment="textStart"
/>
</LinearLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>
layout_weight in LinerLayout to make it work as expected u should take care of this:
if the LinerLayout orientation is vertical then the child's height should be 0dp and the layout_weight value will determine the height of the child
if the LinerLayout orientation is horizontal then the child's width should be 0dp and the layout_weight value will determine the width of the child
so in your code the child should look like this:
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="14dp"
android:weightSum="1"
android:gravity="center_vertical"
android:layout_marginEnd="14dp">
<androidx.appcompat.widget.AppCompatImageView
android:layout_width="odp"
android:layout_height="54dp"
android:src="#drawable/manual_fill"
android:scaleType="centerInside"
android:layout_weight=".3"
android:background="#color/colorAccent"
/>
<LinearLayout
android:background="#87ceeb"
android:layout_weight="0.7"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Read Paper"
android:textColor="#color/navy"
android:textSize="17sp"
android:textStyle="bold"
android:textAlignment="center"
card_view:fontFamily="#font/assistant_semibold" />
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is some long explanation text"
android:textSize="14sp"
android:fontFamily="#font/assistant"
android:textColor="#color/navy"
android:textAlignment="textStart"
/>
</LinearLayout>
</LinearLayout>

RecyclerView is taking full screen to show one message

i am working on a layout for chat screen in which i am using RecyclerView to show messages sent and receive by user but the problem which i am facing is RecyclerView is showing only one message in whole screen and to see other message i have to scroll down or scroll up. i want to show messages next to eachother vertically.
Here is my xml code:-
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/chatparent"
android:background="#color/background">
<include layout="#layout/chattoolbar"/>
<android.support.v7.widget.RecyclerView
android:id="#+id/rv_messages"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:scrollbars="vertical"
android:scrollbarStyle="outsideOverlay"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="bottom">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<FrameLayout
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_weight="0.80"
android:background="#color/colorPrimary" />
<FrameLayout
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_weight="0.20"
android:background="#color/black"/>
</LinearLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/rl_typing"
android:background="#drawable/chatbox"
android:orientation="horizontal"
android:paddingLeft="5dp"
android:paddingRight="10dp"
android:layout_marginStart="15dp"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_marginEnd="2dp"
>
<Button
android:layout_width="20dp"
android:layout_height="20dp"
android:background="#drawable/ic_emoticons"
android:layout_marginTop="8dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:gravity="bottom"
android:id="#+id/btn_emoji"
/>
<EditText
android:layout_width="190dp"
android:layout_height="wrap_content"
android:inputType="textMultiLine"
android:minLines="1"
android:maxLines="20"
android:lines="8"
android:imeActionId="#+id/send"
android:imeActionLabel="actionSend"
android:imeOptions="actionSend"
android:scrollbars="vertical"
android:textColor="#color/monsoon"
android:textColorHint="#color/dark_gray"
android:id="#+id/et_message"
android:textSize="13sp"
android:hint=" Type Your Message Here..."
android:layout_toEndOf="#id/btn_emoji"
tools:ignore="HardcodedText" />
<Button
android:layout_width="20dp"
android:layout_height="20dp"
android:background="#drawable/ic_attachment"
android:layout_marginTop="8dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:gravity="bottom"
android:id="#+id/btn_attach"
android:layout_toEndOf="#id/et_message"/>
<Button
android:layout_width="20dp"
android:layout_height="20dp"
android:background="#drawable/ic_camera"
android:layout_marginTop="8dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:id="#+id/btn_camera"
android:layout_toEndOf="#id/btn_attach"/>
</RelativeLayout>
<Button
android:layout_width="30dp"
android:layout_height="35dp"
android:id="#+id/btn_send"
android:layout_alignParentTop="true"
android:layout_marginTop="7.5dp"
android:layout_centerHorizontal="true"
android:layout_marginStart="3dp"
android:layout_toEndOf="#id/rl_typing"
android:background="#drawable/ic_send" />
</RelativeLayout>
</LinearLayout>
Here is the recyclerView_item.xml :-
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="5dp"
android:paddingTop="5dp"
android:paddingLeft="10dp">
<TextView
android:id="#+id/username"
style="?android:textAppearanceMedium"
android:textColor="?android:textColorPrimary"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:textStyle="bold"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/txtOther"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16dp"
android:textColor="#color/black"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:background="#drawable/chat_in"/>
<TextView
android:id="#+id/message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/chat_out"
android:paddingBottom="5dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:paddingTop="5dp"
android:textColor="#color/white"
android:textSize="16dp" />
<TextView
android:id="#+id/lblDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="12dp"
android:textColor="#color/colorprimarylight"
android:textStyle="italic"
android:padding="5dp"
/>
</LinearLayout>
</LinearLayout>
Here is the screenshot in which you can see how much space it is producing in between two messages.
set recyclerview item's main layout height "wrap_content"
In child view of recyclerView set xml root to "wrap_content". If you set a flag match_parent it will take all space and you need to scroll your parent view.
In recyclerView_item.xml, you must set your 'main' LinearLayout's height and width match_parent to wrap_content

Android text alignment inside textview is wrong

I'm trying to align text inside textview to the center (both vertical and horizontal).
Altought the vertical alignment working properlly in the Android Studio preview, it fails on the emulator.
The design:
The android studio preview:
The emulator:
The code:
<RelativeLayout
android:id="#+id/teamsBox"
android:layout_width="match_parent"
android:layout_height="185dp">
<LinearLayout
android:layout_width="154dp"
android:layout_height="wrap_content"
android:background="#drawable/team_bg"
android:padding="6dp"
android:layout_alignParentLeft="true"
android:orientation="vertical">
<EditText
android:id="#+id/teamOneName"
android:layout_width="143dp"
android:layout_height="42dp"
android:text="HOME"
android:textColor="#color/my_white"
android:background="#color/my_transparent"
android:textSize="23sp"
android:singleLine="true"
android:gravity="center"/>
<TextView
android:id="#+id/teamOneScore"
android:layout_width="143dp"
android:layout_height="132dp"
android:text="3"
android:textColor="#color/my_green"
android:textSize="127sp"
android:gravity="center"/>
</LinearLayout>
<LinearLayout
android:layout_width="154dp"
android:layout_height="match_parent"
android:background="#drawable/team_bg"
android:padding="6dp"
android:layout_alignParentRight="true"
android:orientation="vertical">
<EditText
android:id="#+id/teamTwoName"
android:layout_width="match_parent"
android:layout_height="42dp"
android:text="AWAY"
android:textColor="#color/my_white"
android:background="#color/my_transparent"
android:textSize="23sp"
android:singleLine="true"
android:gravity="center"/>
<TextView
android:id="#+id/teamTwoScore"
android:layout_width="fill_parent"
android:layout_height="132dp"
android:text="1"
android:textColor="#color/my_green"
android:textSize="127sp"
android:gravity="center"
android:layout_gravity="center"/>
</LinearLayout>
</RelativeLayout>
Edit: I've changed to layout according to the answers, but the bug is still happening.
This is my new layout:
<RelativeLayout
android:id="#+id/teamsBox"
android:layout_width="match_parent"
android:layout_height="185dp">
<LinearLayout
android:layout_width="154dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:background="#drawable/team_bg"
android:orientation="vertical"
android:padding="6dp" >
<EditText
android:id="#+id/teamOneName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="HOME"
android:textColor="#color/my_white"
android:background="#color/my_transparent"
android:textSize="23sp"
android:singleLine="true"
android:padding="8dp"
android:gravity="center"/>
<TextView
android:id="#+id/teamOneScore"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="3"
android:textColor="#color/my_green"
android:textSize="127sp"
android:gravity="center_vertical|center_horizontal"/>
</LinearLayout>
<LinearLayout
android:layout_width="154dp"
android:layout_height="match_parent"
android:background="#drawable/team_bg"
android:padding="6dp"
android:layout_alignParentRight="true"
android:orientation="vertical">
<EditText
android:id="#+id/teamTwoName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="AWAY"
android:textColor="#color/my_white"
android:background="#color/my_transparent"
android:textSize="23sp"
android:singleLine="true"
android:padding="8dp"
android:gravity="center"/>
<TextView
android:id="#+id/teamTwoScore"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="1"
android:textColor="#color/my_green"
android:textSize="127sp"
android:gravity="center"
android:layout_gravity="center"/>
</LinearLayout>
</RelativeLayout>
To problem is in the TextView itself, the large size of the text is not calculated by the gravity attribute.
Try adding this attribute to your text view android:includeFontPadding="false"
set your textView's android:gravity to center_vertical | center_horizontal
<TextView
android:id="#+id/teamOneScore"
android:layout_width="143dp"
android:layout_height="132dp"
android:text="3"
android:textColor="#color/my_green"
android:textSize="127sp"
android:gravity="center_vertical | center_horizontal" />
Remove hard coded width and height and use weight.Try the following data
<RelativeLayout
android:id="#+id/teamsBox"
android:layout_width="match_parent"
android:layout_height="185dp" >
<LinearLayout
android:layout_width="154dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:background="#drawable/button_background"
android:orientation="vertical"
android:padding="6dp" >
<EditText
android:id="#+id/teamOneName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#123456"
android:gravity="center"
android:singleLine="true"
android:text="HOME"
android:textSize="23sp" />
<TextView
android:id="#+id/teamOneScore"
android:layout_width="match_parent"
android:layout_height="0dp"
android:gravity="center_vertical|center_horizontal"
android:text="3"
android:layout_weight="1"
android:textSize="127sp" />
</LinearLayout>
<LinearLayout
android:layout_width="154dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:background="#drawable/button_background"
android:orientation="vertical"
android:padding="6dp" >
<EditText
android:id="#+id/teamTwoName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#123456"
android:gravity="center"
android:singleLine="true"
android:text="AWAY"
android:textSize="23sp" />
<TextView
android:id="#+id/teamTwoScore"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center"
android:gravity="center_vertical|center_horizontal"
android:text="1"
android:layout_weight="1"
android:textSize="127sp" />
</LinearLayout>
</RelativeLayout>
Hope this works
try this it may help you,
<?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="wrap_content"
android:background="#android:color/holo_green_light" >
<LinearLayout
android:layout_width="154dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:orientation="vertical"
android:padding="6dp" >
<EditText
android:id="#+id/teamOneName"
android:layout_width="143dp"
android:layout_height="42dp"
android:background="#android:color/holo_green_dark"
android:gravity="center"
android:singleLine="true"
android:text="HOME"
android:textColor="#android:color/white"
android:textSize="23sp" />
<TextView
android:id="#+id/teamOneScore"
android:layout_width="143dp"
android:layout_height="132dp"
android:gravity="center"
android:text="3"
android:background="#android:color/white"
android:textSize="127sp" />
</LinearLayout>
<LinearLayout
android:layout_width="154dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:orientation="vertical"
android:padding="6dp" >
<EditText
android:id="#+id/teamTwoName"
android:layout_width="match_parent"
android:layout_height="42dp"
android:background="#android:color/holo_green_dark"
android:gravity="center"
android:singleLine="true"
android:text="AWAY"
android:textColor="#android:color/white"
android:textSize="23sp" />
<TextView
android:id="#+id/teamTwoScore"
android:layout_width="fill_parent"
android:layout_height="132dp"
android:layout_gravity="center"
android:gravity="center"
android:text="1"
android:background="#android:color/white"
android:textSize="127sp" />
</LinearLayout>
</RelativeLayout>
Just use match_parent as the height of the textview.
Your linear layout which is having the edit text and one text view height is lesser than you have given height to its children. Please calculate height for the edit text and text view and accordingly adjust height of your linear layout.
Here You just need to give wrap_content to you text view and .
1. change in text view
android:layout_height="132dp"
To
android:layout_height="wrap_content"
2. Increase you linear layout height to
android:layout_width="184dp"
3. remove below pading tag from your linear layout
android:padding="6dp"
it will fix your issue.

How do I align a button with the bottom of an EditText in an Android layout?

With my layout, I would like the EditTexts to fill all of the horizontal space on their row, but leave the remaining space for a button to its right.
I would also like the buttons to be aligned to the bottom of the EditText that is on its row.
Currently, the buttons are not aligned to the bottom of their EditText, and I would like to know how I can achieve this.
Here is a screenshot:
And here is my XML:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="12dp"
android:layout_marginRight="12dp" >
<LinearLayout
android:id="#+id/nameLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/nameEditText"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_marginBottom="5dp"
android:ems="8"
android:textSize="15sp"
android:hint="enter name" />
<ImageButton
android:id="#+id/micNameButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:src="#drawable/ic_mic" />
</LinearLayout>
<LinearLayout
android:id="#+id/editLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/nameLayout">
<EditText
android:id="#+id/notesEditText"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:ems="8"
android:textSize="15sp"
android:hint="enter notes" />
<ImageButton
android:id="#+id/micNotesButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:src="#drawable/ic_mic" />
</LinearLayout>
</RelativeLayout>
Try keeping your margin attributes in the LinearLayout, and not in the actual EditText or ImageButton. And set the gravity of the layout to bottom.
(Edit: Also notice that I added android:orientation="horizontal" to the LinearLayouts. You should always have an orientation when child views use layout_weight)
It should look something like this:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="12dp"
android:layout_marginRight="12dp" >
<LinearLayout
android:id="#+id/nameLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_orientation="horizontal"
android:layout_marginTop="10dp"
android:layout_marginBottom="5dp"
android:gravity="bottom" >
<EditText
android:id="#+id/nameEditText"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:ems="8"
android:textSize="15sp"
android:hint="enter name" />
<ImageButton
android:id="#+id/micNameButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:src="#drawable/ic_mic" />
</LinearLayout>
<LinearLayout
android:id="#+id/editLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_orientation="horizontal"
android:layout_marginTop="10dp"
android:layout_marginBottom="5dp"
android:gravity="bottom"
android:layout_below="#+id/nameLayout">
<EditText
android:id="#+id/notesEditText"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:ems="8"
android:textSize="15sp"
android:hint="enter notes" />
<ImageButton
android:id="#+id/micNotesButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:src="#drawable/ic_mic" />
</LinearLayout>
</RelativeLayout>

Android XML Layout - percentage + wrap_content

I want to make some part of layout like ex.:
[_____EditText1_____] / [_____EditText2_____]
and I didn't want to set width in dp/px etc.
I want to wrap_content fo width for 'slash' sign "/" and divide remaining width for (50% to 50%) for EditText1 and EditText2.
It's simple for only EditText1 and EditText2, just setting in both of them:
android:layout_width="0dp"
android:layout_weight=".5"
but how to set TextView "/" and for width wrap_content, between two EditTexts?
<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"
>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=".5"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="/" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=".5"
/>
</LinearLayout>
Try this:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.48" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="/"
android:layout_weight="0.04" />
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.48" />
</LinearLayout>
You can try this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<EditText
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="/"/>
<EditText
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"/>
</LinearLayout>
TextView will occupy its space and the remainning will be distributed among EditViews equally.
Hope this helps.
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="fill_parent">
<TextView
android:layout_weight="1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="0"
android:gravity="center_vertical|center_horizontal" />
<TextView
android:layout_weight="1.5"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="/"
android:gravity="center_vertical|center_horizontal" />
<TextView
android:layout_weight="1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="0"
android:gravity="center_vertical|center_horizontal" />
</LinearLayout>
The key is to increase layout_weight value of the middle element ;)

Categories

Resources