I'm trying to get user comment and after pressing the enter button, the text just gets hide due to a line change. I
m trying to expand my EditText View so that I can show at least 4 lines of comment.
<LinearLayout
android:id="#+id/comments_body_box"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:background="#fff"
android:elevation="8dp"
android:gravity="right"
android:maxHeight="150dp"
android:orientation="horizontal"
android:weightSum="10"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<EditText
android:id="#+id/comments_text_body"
android:layout_width="151dp"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_weight="8"
android:inputType="textCapSentences|textMultiLine"
android:maxHeight="100dp"
android:maxLength="2000"
android:maxLines="4"
android:paddingBottom="12dp"
android:paddingEnd="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="16dp" />
<ImageView
android:id="#+id/comment_send"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="12dp"
app:srcCompat="#drawable/ic_send_black_24dp" />
</LinearLayout>
Above is my current code, can someone tell me what's wrong with my XML file?
I added the following two attributes too
android:maxLength="2000"
android:maxLines="4"
You need to add this into your EditText attribute
android:lines="4"
Also, set height to wrap_content
android:layout_height="wrap_content"
First I cleaned up your code
<LinearLayout
android:id="#+id/comments_body_box"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:background="#fff"
android:elevation="8dp"
android:gravity="right"
android:maxHeight="150dp"
android:orientation="horizontal"
android:weightSum="10"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<EditText
android:id="#+id/comments_text_body"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="8"
android:inputType="textCapSentences|textMultiLine"
android:maxHeight="100dp"
android:maxLength="2000"
android:maxLines="4"
android:paddingBottom="12dp"
android:paddingEnd="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="16dp" />
<ImageView
android:id="#+id/comment_send"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="12dp"
app:srcCompat="#drawable/ic_send_black_24dp" />
1) You should use layout_width="0dp" as you use layout_weight in the LinearLayout
2) do NOT use android:layout_alignParentBottom="true" and android:layout_alignParentEnd="true" as it doesn't make sense in the LinearLayout
3) And use layout_height="wrap_content" is the EditText
It looks like you have the EditText set to match_parent.
Try changing
android:layout_height="match_parent"
to
android:layout_height="wrap_content"
Before starting, you need to make a few changes to your code.
If you are using android:layout_weight attribute, you should always set your width attribute as android:layout_width="0dp"
Since you are using a LinearLayout remove the attributes android:layout_alignParentBottom and android:layout_alignParentEnd. They are invalid for this case.
Since you are using an ImageView under the EditText, it would be better if you assigned a height to your view instead of match_parent, or just use wrap_content if you don't need a fixed size.
You mentioned you needed to display at least 4 lines of text in your EditText. If that is required for all use cases, add the attribute android:minLines="4" to your EditText. If you want a maximum of 4 lines to be displayed, then your code android:maxLines="4" works perfectly.
To prevent the issue where the text gets hidden as the number of lines increases, add the attribute android:scrollbars="vertical" to the EditText.
Your final EditText XML may look something like (assuming 4 lines are needed at a minimum. If not, just remove the android:minLines attribute)
<EditText
android:id="#+id/comments_text_body"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="8"
android:inputType="textCapSentences|textMultiLine"
android:maxHeight="100dp"
android:minLength="2000"
android:minLines="4"
android:scrollbars="vertical"
android:paddingBottom="12dp"
android:paddingEnd="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="16dp" />
Related
I have a requirement to create UI like below
You can see here the number is the highlighted part and it is in center always.
And we scroll it from left to right or vice versa.
I want to achieve this So, I wrote some code like below. But I don't have any Idea on how to add scroll effect to it and bring highlighted text to center
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
app:layout_constraintBottom_toTopOf="#+id/idCameraControlBottom"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<TextView
android:id="#+id/idZoom1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="50dp"
android:text="."
android:textAlignment="textEnd"
android:textSize="20sp"
android:textStyle="bold" />
<TextView
android:id="#+id/idZoom2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="50dp"
android:background="#drawable/circle_shade"
android:gravity="center"
android:text="1X"
android:textSize="16sp" />
<TextView
android:id="#+id/idZoom3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="."
android:textAlignment="viewStart"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
Any Idea/Help is greatly appreciated.
You can create it like so:
<RelativeLayout
android:layout_centerInParent="true"
android:layout_width="100dp"
android:layout_height="wrap_content">
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"/>
</LinearLayout>
</HorizontalScrollView>
<TextView
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#000"
android:textColor="#fff"
android:text="1"/>
</RelativeLayout>
Change it as you see fit, basically, the relative layout parent holds within the horizonal scrollable scrollview, within it you have your needed-to-be-scrolled views. After if you define your number view, being inside a relative layout it will simply be ordered above it. You can then center it to appear above your scrollable scrollView.
Do note the following 2 this:
The scroll will only be performed if the user touched the scrollable view. As in, if the user tries to swipe from pressing on the number it self, it will not scroll.
The content behind the number will be hidden behind it, it won't "skip" from 1 side to the other so you can have "invisible" content that way.
i have an interface with two ImageButtons and a TextView among them. The TextView contains a number and the two ImageButtons control that number, adding or removing 1.
The problem is when the number becomes two digits: the TextView width increase and one of two ImageButtons moves.
As you can see when the number is one digit there isn't any type of problem, but when it becomes two digits the ImageButton moves from his place. I already tried with android:layout_gravity and with android:gravity but they doesn't function. There is a way to keep the TextView "centered" and make sure the ImageButton doesn't move?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:autofit="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingStart="5dp">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center_vertical"
android:orientation="vertical">
<TextView
android:id="#+id/foodName"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginEnd="10dp"
android:gravity="center_vertical"
android:hint="food_name"
android:maxLines="2"
android:textAllCaps="false"
android:textColor="#android:color/black"
android:textSize="18sp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:gravity="end"
android:orientation="horizontal"
android:padding="5dp">
<ImageButton
android:id="#+id/addFood"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
app:srcCompat="#drawable/ic_add_black_40dp" />
<TextView
android:id="#+id/foodQuantity"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|center_horizontal"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:gravity="center|center_horizontal"
android:maxLength="2"
android:text="0"
android:textColor="#707070"
android:textSize="20sp"
android:textStyle="bold" />
<ImageButton
android:id="#+id/removeFood"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
app:srcCompat="#drawable/ic_remove_black_40dp" />
</LinearLayout>
</LinearLayout>
This is my code and this is the layout of a RecyclerView member, because I created a personalized element.
Thanks a lot.
Since you have wrap_content on your foodQuantity TextView, addFood is going to move to accommodate for the extra spacing required to add multiple digits. If you want to keep the position of the button fixed, and make sure the buttons don't move, then you are going to have to give your TextView a fixed width to accommodate for the maximum number of characters you can expect.
I would suggest you to use android:layout_weight so you can define which element is filling the remaining space if necessary. So when setting the TextView a layout_weight of 1 and the ImageButtons a layout_weight of 0 you can afterwards set the android:gravity of the TextView that is defining the gravity inside of the TextView to center and it will always be centered.
BUT: you need to set the width of the LinearLayout to match_parent so it fills the parent. Without that the LinearLayout will never get some remaining space since it always shrinks to the size that all elements need together
...
...
<LinearLayout
android:id="#+id/layout_count"
android:layout_width="200dp"
or android:layout_width="match_parent
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_complete" />
<TextView
android:layout_width="match_parent"
android:layout_weight="1"
android:gravity="center"
android:layout_height="wrap_content"
android:text="1" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_complete" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_complete" />
<TextView
android:layout_width="match_parent"
android:layout_weight="1"
android:gravity="center"
android:layout_height="wrap_content"
android:text="1" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_complete" />
</LinearLayout>
</LinearLayout>
I have 2 rows of "buttons" which are composed of a vertical LinearLayout of an ImageView and a TextView. The problem I'm having right now is trying to set the ImageView aspect ratio without hardcoding its dimensions.
I have already tried playing with the layout weights but it still forces the TextView to be partially cut off.
The xml structure I have is 2 horizontal LinearLayouts and each button is described above.
I've included a picture of my problem. You can see the first button is forcing the TextView out of the bounds. The rest of the buttons you see are hardcoded dimensions, but I don't want to do that because smaller screen sizes won't work.
Here is my layout for one button:
<LinearLayout
android:gravity="center_horizontal"
android:layout_weight="1"
android:padding="5dp"
android:orientation="vertical"
android:layout_width="0dip"
android:layout_height="match_parent">
<ImageView
android:id="#+id/setting_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:background="#null"
android:clickable="true"
android:onClick="openSettings"
android:src="#drawable/menu" />
<TextView
android:id="#+id/setting_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Settings"
android:textAlignment="center"
android:textColor="#android:color/white"
android:autoSizeTextType="uniform" />
</LinearLayout>
Try using images with lower dimensions.
Try using a RelativeLayout and setting the TextView as anchor for the image:
<RelativeLayout
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:padding="5dp">
<TextView
android:id="#+id/setting_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:text="Settings"
android:textAlignment="center"
android:textColor="#android:color/white"
android:autoSizeTextType="uniform" />
<ImageView
android:id="#+id/setting_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_above="#id/setting_text"
android:scaleType="centerInside"
android:adjustViewBounds="true"
android:background="#null"
android:clickable="true"
android:onClick="openSettings"
android:src="#drawable/menu" />
</RelativeLayout>
Please have a look at the following simple code.
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="John Jonathan Samuwell Abbruzzi"
android:singleLine="true"
android:scrollHorizontally="true"
android:textSize="50sp" />
The text in TextView is larger than the width of the screen and should be in single line. I added android:scrollHorizontally="true", so the user can scroll it to see the rest of the text. But, it is not happening. What have I done wrong?
Put your textview inside the HorizontalScrollView its working i am tested..
<HorizontalScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="John Jonathan Samuwell Abbruzzi"
android:singleLine="true"
android:scrollHorizontally="true"
android:textSize="50sp" />
</HorizontalScrollView>
You need to use HorizontalScrollView with single line. If you want horizontal scrollbar for multiple views then you can create layout in HorizontalScrollView and scroll complete. HorizontalScrollView can only hold one direct child.
<HorizontalScrollView
android:id="#+id/horizontalScrollView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="40dp" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="91dp"
android:singleLine="true"
android:text="my view" />
</HorizontalScrollView>
Here's what I want to achieve:
I have at table with a lot of table rows. Each row should have two text view with a product title and subtitle on top of each other (subtitle not implementet yet). The should be left aligned. To the right I want a spinner to select the quantity.
The texts come from the database and are of course of different lengths.
Here is what I've come up with so far:
<ScrollView android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/barmenu"
android:background="#99ffff"
android:scrollbars="vertical">
<TableRow
android:layout_height="wrap_content"
android:background="#ffff99"
android:layout_width="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:background="#0000ff">
<TextView
android:id="#+id/productTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#88ffff"
android:ellipsize="end"
android:padding="2dp"
android:singleLine="true"
android:text="Product name"
android:textColor="#000000"
android:gravity="left"
android:textSize="13sp"
android:textStyle="bold" />
<Spinner
android:gravity="right"
android:layout_height="40dp"
android:layout_toRightOf="#id/productTitle"
android:width="100dp"
android:layout_width="wrap_content" />
</RelativeLayout>
</TableRow>
<TableRow
android:layout_height="wrap_content"
android:background="#ffff99"
android:layout_width="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:background="#0000ff">
<TextView
android:id="#+id/productTitle2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#88ffff"
android:ellipsize="end"
android:padding="2dp"
android:singleLine="true"
android:text="Some long long long long name"
android:textColor="#000000"
android:gravity="left"
android:textSize="13sp"
android:textStyle="bold" />
<Spinner
android:gravity="right"
android:layout_height="40dp"
android:layout_toRightOf="#id/productTitle2"
android:width="100dp"
android:layout_width="wrap_content" />
</RelativeLayout>
</TableRow>
</TableLayout>
</ScrollView>
Screendump:
First problem is that the RelativeLayout doesn't fill out the width of the table row. And the second problem: the spinners are not right aligned.
What am I missing?
best regards
Allan
android:fillViewport="true"
add this line to your ScollView attributes and you're done :)
I'd make it simpler and lighter. Just use RelativeLayout for all these 4 views. Align to right both spinners and make textview's with - match_parent and add toLeftOf the relative spinner. I think you will see what you want.
Add android:layout_weight="1" to your relativelayout