Justify-left at linebreak for EditText? - android

I have a EditText, where the text is in the middle of the EditText(gravity:center)
But when a line break happens, the text starts from the middle under the text. What I want is that the text shall start from the left when a linebreak happens.
This picture explains what I want to archive: http://oi61.tinypic.com/zycxut.jpg
I have tried all theese: Text-align:Viewstart/textStart, Gravity: Center | left
without any succses.
<EditText
android:id="#+id/edittext"
android:textColor="#000000"
android:background="#ffffff"
android:layout_width="match_parent"
android:layout_height="320dp"
android:editable="true"
android:layout_below="#id/toolbar"
android:layout_marginTop="44dp"
android:singleLine="false"
android:gravity="center"/>

try this,
you can add android:inputType="textMultiLine"
<EditText
android:id="#+id/edittext"
android:layout_width="match_parent"
android:layout_height="320dp"
android:layout_marginTop="44dp"
android:background="#ffffff"
android:editable="true"
android:gravity="center"
android:inputType="textMultiLine"
android:textColor="#000000" />

OK, so by the looks of your picture, it seems that you want the text left justified and starting in the middle of the EditText. There isn't a way to do this directly, but we can make a work around by using 2 EditTexts, each taking up half of the white block in your image, then ignoring the one on the left. This will give the appearance of text starting from the middle, when in reality it starts from the left edge of the right EditText.
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="320dp"
android:weightSum="2"
android:orientation="horizontal">
<EditText
android:id="#+id/ignore_this_one"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#ffffff"
android:editable="false" />
<EditText
android:id="#+id/put_text_in_here"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#ffffff"
android:editable="true"
android:gravity="center_vertical"
android:inputType="textMultiLine"
android:textColor="#000000" />
</LinearLayout>
First, notice how each EditText has a layout_weight of 1. This tells Android that they should each take up an equal amount of space on the screen, making them each take up half.
Second, notice how the second EditText has a gravity_vertical element. This makes it so text is centered vertically, but not horizontally.

Related

Two TextViews side by side - both TextViews should take always as much space as possible

I have Two TextViews in one LinearLayout and I want both texts take as much space as given in the LinearLayout but without cutting off each other. I tried to work withminWidth but layout_weight ignores it. Here is one example:
<TextView
android:id="#+id/textOrigin"
android:layout_width="0dp"
android:layout_height="match_parent"
android:ellipsize="end"
android:maxLines="1"
android:layout_weight="1"
android:minWidth="170dp". <-- does not work.../>
<TextView
android:id="#+id/textDestination"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:ellipsize="end"
android:maxLines="1"
android:layout_weight="0"
android:gravity="end"/>
The problem is that the second TextView can be very long and if the width is wrap_content It will cut off the first TextView aligned. So I want to set a minWidth.
|<TextView>......<TextView>| --> no cut off normal position
|<TextViewcanbeverylong...><TextView>| --> left one very long. right one should have minWidth of 100 and then ellipsized
|<TextView><TextViewcanbeverylongtoo...>| --> right one very long. left one should have minWidth of 100 and then ellipsized
All three scenarios should work
Two TextViews side by side, only one to ellipsize?
This one is similar but not the same as my question. The Ticket above just solve the not cutting off text in one direction so only if the left text ist long the right text will not be cut off but I want that in both directions.
SOLUTION:
Here is the solution: Just change Width to wrap_content. Then it is possible to use minWidth.
<TextView
android:id="#+id/textOrigin"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:ellipsize="end"
android:maxLines="1"
android:layout_weight="1"
android:minWidth="170dp"/>
<TextView
android:id="#+id/textDestination"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:ellipsize="end"
android:maxLines="1"
android:layout_weight="1"
android:minWidth="170dp"
android:gravity="end"/>
Try this code, maybe it works!
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/textOrigin"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:maxLines="1"
android:layout_weight="0.5"/>
<TextView
android:id="#+id/textDestination"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:maxLines="1"
android:layout_weight="0.5"
android:gravity="end"/>
</LinearLayout>

EditText won't write into single line

I'm making a calculator and user input is contained in EditText. Input is typed through buttons on screen, so Android keyboard is disabled. However, I want it to write all input in one line and when line reaches border, it needs to be ellipsized and then horizontally scrollable so you can reach whole text.
I tried doing this by setting android:maxLines="1" and android:ellipsize="end", but that doesn't work. Text is still in multiple lines, but only one line is visible and you need to scroll vertically to see other lines. I also tried using android:singleLine="true", but that makes EditText completely unusable.
This is EditText XML:
<EditText
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="end"
android:background="#color/colorBlue"
android:textAlignment="textEnd"
android:textSize="40sp" />
I think this will work for you. Let me know if it works.
<EditText
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="end"
android:background="#color/colorBlue"
android:textAlignment="textEnd"
android:textSize="40sp"
android:inputType="text"
android:maxLines="1"
android:lines="1"
android:scrollHorizontally="true"
android:ellipsize="end"/>
This post might help you as well.
For single line in EditText, you just need to set two properties:
android:inputType="text"
android:maxLines="1"
Adding this line in the edittext make scrollable singleline text.
android:inputType="textShortMessage"
**This example helps you to create multiline EditText in Android.**
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/rl"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp"
tools:context=".MainActivity"
>
<!--
android:scrollbars="vertical"
It will display a vertical scrollbar if the EditText text exceed
3 lines (android:maxLines).
-->
<EditText
android:id="#+id/et"
android:layout_width="250dp"
android:layout_height="wrap_content"
android:padding="10dp"
android:layout_marginBottom="10dp"
android:hint="Multiline EditText by XML layout"
android:fontFamily="sans-serif-condensed"
android:background="#d3d7b6"
android:minLines="2"
android:maxLines="3"
android:scrollbars="vertical"
android:inputType="textMultiLine"
/>
<EditText
android:id="#+id/et2"
android:layout_width="250dp"
android:layout_height="wrap_content"
android:padding="10dp"
android:fontFamily="sans-serif-condensed"
android:hint="Multiline EditText programmatically"
android:background="#d4d7a5"
android:layout_below="#+id/et"
/>
</RelativeLayout>

Texts always in center and right, how?

I am sorry I know it's simple question but I can't make this happen now.
I want one text always will be in center and another in right.
But when texts is too loo long they come to each other.
Let's say I want second text always be in the right and first text is in center but when one of these texts is too long the centered texts have to move left.
How could I do this?
I write this but it doesn't work properly.
<RelativeLayout
android:id="#+id/workout_footer_text"
android:layout_width="match_parent"
android:layout_height="#dimen/workout_header_height"
android:background="#color/green"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingLeft="#dimen/activity_horizontal_margin">
<TextView
android:id="#+id/review_comments_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/text_color_white"
android:textSize="#dimen/review_top_text_size"
android:singleLine="true"
android:gravity="center"
android:layout_toLeftOf="#+id/review_write_label"
android:layout_centerInParent="true"
android:layout_gravity="center"/>
<TextView
android:id="#+id/review_write_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/text_color_white"
android:layout_alignParentRight="true"
android:gravity="center_vertical"
android:singleLine="true"
android:layout_marginLeft="20dp"
android:textSize="#dimen/review_top_text_size"
android:layout_centerVertical="true"/>
</RelativeLayout>
Instead of layout_toLeftOf="#+id/review_write_label" in your first TextView, remove that line and add layout_toRightOf="#id/review_comments_label" to your second TextView to make sure the first view stays centered and the second view stays to the right.
Update
Then make the second view's width match parent and set it's gravity to right. This will right justify the text in a container that stretches from the right edge of the centered TextView to the right edge of the parent thanks to the match_parent width.
You can try this:
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:orientation="horizontal">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="text1" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="text2" />
</LinearLayout>

android make left textview to be shorten and right remain fully visible

I need to display two single-line TextViews horizontally. The left TextView (let's name it 1) may have a longer text which may shortened and finished with "...". The right text view (2) has a short text and should never get shortened.
I want the 1 to remain aligned to the left end of the parent. The 2 aligned to the right side of 1.
There are now 2 conditions that I have to meet
a) if the 1 has a short text then the 2 should get aligned to the right of 1 (none of the gets shortened).
b) but if the 1 has a too long text then the text of 1 should be shortened by '...' while the view 2 is moved maximally to the right of the parent but still remains fully visible (no ...)
My current solution is the following below. The scenario b) is fine with mine, but in case of a) the problem is that the view 2 is moved to the right side of the parent and the 1 to the left side - both are short and there's pretty much space in between which looks odd. I want 2 to move to the further left (next to 1) and leave this space on the right side.
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_marginTop="1dp"
android:layout_weight="0.5">
<TextView
android:id="#+id/ns_in_txt"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:gravity="top|left"
android:maxLines="1"
android:singleLine="true"
android:textColor="#00a2ff"
android:textSize="18sp" />
<TextView
android:id="#+id/ns_txt"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#id/ns_in_txt"
android:gravity="top|left"
android:maxLines="1"
android:singleLine="true"
android:textColor="#00a2ff"
android:textSize="18sp" />
</RelativeLayout>
Try doing this
<RelativeLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_context"
android:layout_marginTop="1dp">
<TextView
android:id="#+id/ns_in_txt"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_alignParentRight="true"
android:gravity="left"
android:maxLines="1"
android:ellipsize="end"
android:singleLine="true"
android:textColor="#00a2ff"
android:textSize="18sp" />
<TextView
android:id="#+id/ns_txt"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#id/ns_in_txt"
android:gravity="left"
android:maxLines="1"
android:singleLine="true"
android:textColor="#00a2ff"
android:textSize="18sp" />
</RelativeLayout>
Apparently, you want two scenarios which require to set a different orientation to the parent layout: first horizontal, second vertical. Maybe I'm wrong (and I hope so but) in static xml, there will be difficult to do this.
Try the code below to test if I'm wrong:
Scenario 1: orientation horizontal = the text 1 is not big enough
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="1dp"
android:orientation="horizontal" >
<TextView
android:id="#+id/textLong"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:ellipsize="end"
android:singleLine="true"
android:textColor="#00a2ff"
android:textSize="18sp"
android:text="This is a normal text not big" />
<TextView
android:id="#+id/textShort"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:singleLine="true"
android:textColor="#00a2ff"
android:textSize="18sp"
android:text="short text" />
</LinearLayout>
Scenario 2: orientation vertical = the text 1 is too big
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="1dp"
android:orientation="vertical" >
<TextView
android:id="#+id/textLong"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:ellipsize="end"
android:singleLine="true"
android:textColor="#00a2ff"
android:textSize="18sp"
android:text="This is a biiiggg loooonnng teeeeexxxxxtttt" />
<TextView
android:id="#+id/textShort"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:singleLine="true"
android:textColor="#00a2ff"
android:textSize="18sp"
android:text="short text" />
</LinearLayout>
To resolved your issue, you can try 2 solutions.
First, try to create a maxLenght limit, which calculate in your Activity and change the parent orientation of the LinearLayout. Get the number of chars that you have and display the orientation as well.
Second, customise your own class extend TextView. And create a getWidth method which return the width of the long TextView in comparison to it parent and change the orientation.
Maybe the following questions/answers could be useful (I think there are not solutions but more as inspiration):
In Android how to get the width of the Textview which is set to Wrap_Content
Get the size of a text in TextView
How to find android TextView number of characters per line?
Auto Scale TextView Text to Fit within Bounds
EDIT:
I found a solution with the last url that I writed above. See this answer where the dev wanted to make the same as you. So he decided to create a autoresizable textview. Take a look here: Move two side by side textviews to be one under another if text is too long
I hope this will help you.
May I suggest to use combination of LinearLayout and a little bit of coding. The idea is to have them side by side regardless of the size. and after the right textview is measured and laid out, set the max width of the left textview to whatever space left.
Here is the layout file, nothing special here:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/ns_in_txt"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:ellipsize="end"
android:gravity="top|left"
android:maxLines="1"
android:singleLine="true"
android:textColor="#00a2ff"
android:textSize="18sp" />
<TextView
android:id="#+id/ns_txt"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:ellipsize="none"
android:gravity="top|left"
android:maxLines="1"
android:singleLine="true"
android:textColor="#00a2ff"
android:textSize="18sp" />
</LinearLayout>
and add some codes to the activity/fragment:
final TextView tvLeft = (TextView) findViewById(R.id.ns_txt);
final TextView tvRight = (TextView) findViewById(R.id.ns_in_txt);
ViewTreeObserver obs = tvRight.getViewTreeObserver();
obs.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
#Override
public void onGlobalLayout() {
tvLeft.setMaxWidth(SCREEN_WIDTH - tvRight.getWidth());
}
});

TextView pushes buttons off screen with HorizontalScrollView

I am aiming for a layout similar to the native calculator app. I want text to trail off the left of the screen without moving the buttons on the right. Currently my text moves to the left until filling the screen at which point the buttons are pushed off the right edge.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:layout_weight="1"
android:gravity="right"
android:orientation="horizontal" >
<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scrollbars="none" >
<TextView
android:id="#+id/display_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:textColor="#android:color/white"
android:textIsSelectable="true"
android:textSize="30sp" />
</HorizontalScrollView>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<Button
android:id="#+id/delete_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:onClick="onDelete"
android:text="#string/delete_button" />
<Button
android:id="#+id/equate_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:onClick="onEquate"
android:text="#string/equate_button" />
</LinearLayout>
</LinearLayout>
You don't need to put your TextView into a HorizontalScrollView, it will automatically become scrollable when the text exceeds the bounds. See docs: http://developer.android.com/reference/android/widget/TextView.html#attr_android:scrollHorizontally
Just add android:scrollHorizontally="true" to the TextView in the layout.
You may also need to change the text view's layout_weight to 0 or set its layout_width to something fixed (like 100dp).
To get the text to go right-to-left, set the gravity on the TextView to be android:gravity="right|center_vertical"
I also humbly refer you the source of the calculator app you are trying to emulate: https://github.com/android/platform_packages_apps_calculator/tree/master/src

Categories

Resources