I am creating a view where the user can enter text like a notepad and when user presses ENTER, the cursor will go to the next line. I have tried many configurations with EditText by exploring inputType, imeOptions maxLines etc. with no luck.
The text always stays in a single line. If the line length is more than the view, it simply grows to the right.
Is there a way to make sure the EditText
Accepts new lines and display text with line breaks?
Wraps to the width of the container
<LinearLayout
android:id="#+id/container_text"
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"
android:orientation="vertical"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentBottom="true"
android:gravity="top"
android:layout_above="#+id/button_box">
<TextView
android:id="#+id/act_date"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text= "April 12, 2015 2:45 PM"
android:paddingBottom="4dp"
android:textColor="?attr/attrColorNewEntryChangedDate"
android:gravity="center"
android:visibility="gone"/>
<View
android:id="#+id/act_change_date_border"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_alignParentBottom="true"
android:background="?attr/attrColorBorder"
android:visibility="gone"/>
<EditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="top"
android:inputType="textMultiLine"
android:imeOptions="actionNone"
android:ems="10"
android:id="#+id/editText"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginLeft="0dp"
android:layout_marginStart="0dp"
android:layout_marginBottom="50dp"
/>
</LinearLayout>
you can try this
android:layout_width="wrap_content"
android:maxLines="3"
Related
I have a list of data displayed as , one below the other:
name James
phone 032-432-4556
street line 1
line 2
etc.
email me#my.com
The most logical (I guess) is to position the email below the street , as the edittext is variabel in length and left align it with previous textviews. Whichever combination of layout params I've tried, "Email" remains immediatly below the "street" label. Even the margin is not respected. Who knows the correct combination of layout params and referred to items?
This is my layout and below it the screen as it shows:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context=".DisplayContact" >
<RelativeLayout
android:id="#+id/oneContact"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<TextView
android:id="#+id/textTextName"
.............
<EditText
android:id="#+id/editTextName"
.............
</EditText>
<TextView
android:id="#+id/textTextPhone"
.............
<EditText
android:id="#+id/editTextPhone"
.............
<TextView
android:id="#+id/textTextStreet"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textTextPhone"
android:layout_alignLeft="#id/textTextName"
android:layout_alignStart="#id/textTextName"
android:layout_marginTop="#dimen/field_vertical_margin"
android:text="#string/street"
android:textAppearance="?android:attr/textAppearanceMedium" />
<EditText
android:id="#+id/editTextStreet"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#id/textTextStreet"
android:layout_alignLeft="#id/editTextName"
android:layout_alignStart="#id/editTextName"
android:ems="10"
android:inputType="textMultiLine" />
<TextView
android:id="#+id/textTextEmail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/editTextStreet"
android:layout_alignLeft="#id/textTextName"
android:layout_alignStart="#id/textTextName"
android:layout_marginTop="#dimen/field_vertical_margin"
android:text="#string/email"
android:textAppearance="?android:attr/textAppearanceMedium" />
<EditText
android:id="#+id/editTextEmail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#id/textTextEmail"
android:layout_alignLeft="#id/editTextName"
android:layout_alignStart="#id/editTextName"
android:ems="10"
android:inputType="textEmailAddress" />
<TextView
android:id="#+id/textTextCity"
.............
<EditText
android:id="#+id/editTextCity"
.............
</RelativeLayout>
I recommend using a vertical LinearLayout as your root, instead of RelativeLayout and creating a layout as described here Android: creating two columns in a linearlayout
You can also try a Table https://developer.android.com/guide/topics/ui/layout/grid.html.
I have a sentence, user has to put his data into sentence (one word).
I tried to use for it LinearLayout with TextView (beginning of the sentence), EditText with ems=5(here user should put his data), then TextView(end of the sentence) (See the code below). But in this realization it doesn't look appropriate, when we use long sentence and it moves part of it to the next line.
On emulator it looks like:
|Blablabla ________ blablabla|
| blabla. |
It puts the end of the sentence under the second TextView. But I need that the second line starts from the beginning of new line, like:
|Blablabla ________ blablabla|
|blabla. |
I tried to use the solution from Git-Hub: flow-text but got that kind of result:
How can I solve this problem? Thanks for watching this post!
XML:
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginTop="4dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="15dp"
android:paddingRight="5dp"
android:textSize="20sp"
android:text="#string/firstPart_1"
android:id="#+id/textView1"/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/name"
android:textSize="20sp"
android:inputType="textCapSentences"
android:paddingTop="2dp"
android:paddingBottom="6dp"
android:ems="7"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="15dp"
android:paddingRight="5dp"
android:textSize="20sp"
android:text="#string/firstPart_2"
android:id="#+id/textView2"/>
</LinearLayout>
XML (flow-text):
<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"
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">
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1" >
<uk.co.deanwild.flowtextview.FlowTextView
android:id="#+id/ftv"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingRight="5dp"
android:textSize="20sp"
android:text="блабла"
android:id="#+id/textView1"/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/name"
android:textSize="20sp"
android:inputType="textCapSentences"
android:ems="5"/>
</LinearLayout>
</uk.co.deanwild.flowtextview.FlowTextView>
</ScrollView>
I think you should use the linear layout (horizontal) for a single line.
<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:text="fill in the blanks:" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Your name is: "/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="5"/>
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Hello Brother, how are you" />
</LinearLayout>
It is working as you want. :)
Since your text is going to be of rich format as shown in the picture, you can consider using a WebView.
In this case, you can arrange your elements using HTML and use rich texts using CSS styling.
Also you can use WebView mechanisms provided for communication between Java side and JavaScript side, in order to make a bridge from that text box to your Java logics. (Example)
I have been looking at Facebook comment activity:
I keep wondering how do they manage to make their edittext increase in size from one single line to a maximum of 4 lines, and at the same time, the recyclerview that contains the posts also adjust upwards and reduces in size. This happens automatically when you type in the text.
I'm trying to duplicate their layout myself by doing the following but I can not display more then 2 lines. It keeps on limiting itself to the size of the "Send" arrow, but the edittext never goes over the recyclerview in my example below.
The following is my xml layout code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:tools="http://schemas.android.com/tools"
android:background="#color/white"
>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/like_box"
android:text="Number of Likes goes here"
android:maxLines="1"
android:minLines="1"
android:layout_margin="16dp"
/>
<View
android:layout_width="match_parent"
android:layout_height="0.2dp"
android:id="#+id/divider"
android:layout_below="#+id/like_box"
android:background="#color/half_black"/>
<android.support.v7.widget.RecyclerView
android:id="#+id/my_recycler_view"
android:layout_below="#+id/divider"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/commenttext" />
<View
android:layout_width="match_parent"
android:layout_height="0.2dp"
android:id="#+id/divider2"
android:layout_below="#+id/my_recycler_view"
android:background="#color/half_black"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/commenttext"
android:layout_toLeftOf="#+id/send"
android:background="#null"
android:paddingLeft="16dp"
android:textSize="16sp"
android:hint="Add a comment here"
android:layout_alignTop="#+id/send"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentBottom="true" />
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/send"
android:src="#drawable/ic_action_send_now"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>
Does anyone know what the correct xml layout code is to ensure that both the edittext and recyclerview adjust upwards when text is entered? I thought it would just be something simple like setting "wrap_content" to my edittext which I have already done but it still does not adjust properly.
Anoop M's answer seems to be the closest to what I want to do but the recyclerview does not adjust properly - see image below. Imagine if the blue portion of the screen was filled with text, the edittext will end up hiding the text in the blue section when you enter more than 4 lines. The edittext just seems to go over the recyclerview. This does not happen on the facebook app, comments are fully shown as the recyclerview adjust upwards when the edittext size increases.
I suggest using a LinearLayout as the parent container. You can then achieve the desired result by applying layout_weights on all child views:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/like_box"
android:text="Number of Likes goes here"
android:maxLines="1"
android:minLines="1"
android:layout_margin="16dp"
android:layout_weight="0"/>
<View
android:layout_width="match_parent"
android:layout_height="0.2dp"
android:id="#+id/divider"
android:background="#color/half_black"
android:layout_weight="0"/>
<android.support.v7.widget.RecyclerView
android:id="#+id/my_recycler_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
<View
android:layout_width="match_parent"
android:layout_height="0.2dp"
android:id="#+id/divider2"
android:background="#color/half_black"
android:layout_weight="0"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:orientation="horizontal">
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/commenttext"
android:background="#null"
android:paddingLeft="16dp"
android:textSize="16sp"
android:maxLines="4"
android:inputType="textMultiLine"
android:hint="Add a comment here" />
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/send"
android:src="="#drawable/ic_action_send_now"
android:layout_weight="0" />
</LinearLayout>
</LinearLayout>
Notable changes:
parent container is now LinearLayout
all child views have layout_weights assigned
the EditText and the send button have been housed inside a horizontal LinearLayout.
maxLines attribute of the EditText has been set to 4 as per your requirements. this way, the EditText will keep growing in height until its 4 lines tall, after which it will start to scroll. The send button will remain aligned to the first line.
inputType="textMultiLine" has been added to the EditText to indicate that the content of this EditText can span multiple lines.
the RecyclerView will shrink when the EditText's line-count increases and vice-versa.
when you are defining your activity in manifest add code given below,
<activity
android:name="com.companyname.applicationname"
android:windowSoftInputMode="adjustResize|adjustPan">
And also you can use you edit text as given below.
<EditText
android:inputType="textMultiLine" <!-- Multiline input -->
android:lines="8" <!-- Total Lines prior display -->
android:minLines="6" <!-- Minimum lines -->
android:gravity="top|left" <!-- Cursor Position -->
android:maxLines="10" <!-- Maximum Lines -->
android:layout_height="wrap_content" <!-- Height determined by content -->
/>
You need to have singleLine = false attribute set for Edit Text
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/commenttext"
android:layout_toLeftOf="#+id/send"
android:background="#null"
android:paddingLeft="16dp"
android:textSize="16sp"
android:singleLine="false"
android:hint="Add a comment here"
android:layout_alignTop="#+id/send"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentBottom="true" />
Try this out.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="65dp"
android:fadeScrollbars="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp">
<LinearLayout
android:id="#+id/topedittext_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:orientation="vertical">
<!--Your Contents Goes Here-->
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Your Contents Goes Here" />
</LinearLayout>
</RelativeLayout>
</ScrollView>
<RelativeLayout
android:id="#+id/tos_text_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="20dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#null"
android:gravity="center"
android:hint="Type message"
android:maxLines="4"
android:minHeight="60dp"
android:padding="7dp"
android:singleLine="false"
android:textColor="#88000000"
android:textColorHint="#bdbdbd"
android:textSize="15sp" />
</RelativeLayout>
</RelativeLayout>
For set the max and min lines in XML use.
android:maxlines="your choice" // in integer
android:minlines="your choice" // in integer
or if you want to show text in one line use:
android:ellipsize
When I type into the EditText box, the RelativeLayout containing it does not expand. The problem is I want it to.
Here's a visual display of the problem:
There's about 5 lines of gibberish typed in there and you can see the 2nd to last line cut off. Up to a maximum of 5 lines should be showing, but they're not, most likely because they're inside a layout whose height is set to wrap the contents. How can I make the parent layout expand when the EditText expands?
Here is the problem xml displaying the message box you see in the picture:
<RelativeLayout
android:id="#+id/group_chat_form"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginTop="5dp"
android:background="#drawable/transparent_background2" >
<TextView
android:id="#+id/send_msg_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:background="#drawable/transparent_background2"
android:text="Send" />
<EditText
android:id="#+id/group_chat_input_box"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignBottom="#id/send_msg_button"
android:layout_toLeftOf="#id/send_msg_button"
android:background="#00000000"
android:hint="Type a message..."
android:textColorHint="#EEEEEE"
android:inputType="textMultiLine"
android:maxLines="5"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingTop="4dp"
android:paddingBottom="4dp"
android:textColor="#FFFFFF"
android:textSize="20sp"
android:shadowColor="#000000"
android:shadowRadius="3"
android:shadowDx="3"
android:shadowDy="3"/>
</RelativeLayout>
How can I make the parent layout expand when the EditText expands?
This isn't working because the EditText is anchored to the TextView with
android:layout_alignBottom="#id/send_msg_button"
The EditText is trying to expand down but it can't since it isn't allowed to go below that point.
Removing this and anchoring it to the top of the TextView will solve that issue but creates other problems with the placement of the TextView if the EditText grows too much.
I've tested some of my suggestions from comments and it seems to give what you want. You will find my example below with some changes in bg and colors just to work with my test project.
<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">
<RelativeLayout
android:id="#+id/group_chat_form"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginTop="5dp"
android:background="#drawable/abc_item_background_holo_dark" >
<TextView
android:id="#+id/send_msg_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignBottom="#id/group_chat_input_box"
android:background="#drawable/abc_item_background_holo_light"
android:text="Send" />
<EditText
android:id="#+id/group_chat_input_box"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#id/send_msg_button"
android:background="#FFFFFF"
android:hint="Type a message...Type a message...Type a message...Type a message...Type a message...Type a message...
Type a message...Type a..."
android:inputType="textMultiLine"
android:maxLines="5"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingTop="4dp"
android:paddingBottom="4dp"
android:textColor="#FFFFFF"
android:textSize="20sp"
android:shadowColor="#000000"
android:shadowRadius="3"
android:shadowDx="3"
android:shadowDy="3"/>
</RelativeLayout>
</RelativeLayout>
actually humm...let me try to explain...
I was following the tutorial for android app starters and
with this code the EditText part the there will be a default message which was set in the string but the default message is grey and when we use the phone and click on the EditText part the grey message will be gone....I tried doing this again but what I get is that the default message is black and when I click on the EditText on the phone the message will stay instead of gone which means I have to delete the message manually to enter what is wanted. Anyone can give me a hand with it?
<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="horizontal" >
<EditText android:id="#+id/edit_message"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:hint="#string/edit_message" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_send"
android:onClick="sendMessage" />
</LinearLayout>
The above is something I want and the below is what I have,
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity" >
/*have a few more EditText, Buttons and TextView here but don't think it's relevant so didn't paste*/
<EditText
android:id="#+id/edit_percentage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/editText1"
android:layout_alignParentBottom="true"
android:ems="10"
android:inputType="numberDecimal"
android:text="#string/edit_percentage" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/edit_percentage"
android:layout_alignRight="#+id/editText1"
android:text="#string/button3" />
</RelativeLayout>
I did thought if it's because of the relativelayout and linearlayout but didn't seem to be the problem.
It sounds like you want hint. Add this line
android:hint="#string/edit_percentage"
instead of
android:text="#string/edit_percentage"
Use android:text attribute.
<EditText android:id="#+id/edit_message"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/edit_message" />