TextViews fill the available space but never clip the content - android

I have (horizontal) scrollview with some textview. I want these textview to fill all the space on the screen and divide the space between them evenly. Sort of like a viewpagerstrip
However, I have realized that in some languages the translation of my strings are longer than the textview and clips the text. Is there a way to make sure the content of a (single line) textview is never clipped.
The remaning textview should just divide the remaning space. If there is not space enough I want them to go outside the screen.

before oncreate
TextView ticker;
in oncreate
ticker = findViewById(R.id.ticker);
ticker.setFocusable(true);
ticker.requestFocus();
ticker.setSelected(true);
here is the xml
<TextView
android:id="#+id/ticker"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:background="#fff000"
android:ellipsize="marquee"
android:fadingEdge="horizontal"
android:fadingEdgeLength="5dp"
android:focusable="false"
android:gravity="bottom"
android:lines="1"
android:marqueeRepeatLimit="marquee_forever"
android:singleLine="true"
android:text="#string/ticker"
android:textColor="#000000"
android:textColorHighlight="#FFFFFF"
android:textSize="30sp" />

Related

Android: How to align an ImageView to the right of a TextView and make sure the ImageView is always visible

I need to have an Android layout with two views. The first view is a TextView while the second is an ImageView. The ImageView should always be aligned to the right of the TextView. The TextView should be able to expand to fill any remaining space depending on the size of the text. The ImageView should never be hidden by the TextView if the text is too big. The text should be tail truncated in this case.
Here's a visual of what I'm trying to accomplish:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="bottom | center_vertical">
<TextView
android:id="#+id/myText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/black"
android:ellipsize="end"
android:singleLine="true"/>
<ImageView
android:id="#+id/myImage"
android:layout_width="12dp"
android:layout_height="12dp"
android:src="#drawable/myImageDrawable"
android:layout_toRightOf="#id/myText"/>
</RelativeLayout>
The above XML does not work because TextView hides the ImageView when its text is too big. How can I fix this code? I'm willing to use a different layout as well. Note that the TextView must be a single line.
The below xml is enough to achieve what you want. Just set singleLine to true and use drawableEnd to set your image. Also, replace the text in my code with yours. That's all.
<TextView
android:singleLine="true"
android:text=" HehhsasasashasgghgahgshagshgahsghagshaghsgahsghaHehhsasasashasgghgahgshagshgahsghagshaghsgahsgha shgasagsasghag shahsghag"
android:layout_width="wrap_content"
android:drawableEnd="#drawable/myImageDrawable"
android:layout_height="wrap_content"/>

Automatic horizontal scroll in textview with layout_weight

I have been looking at other threads but I couldn't find an answer so here comes my question:
Is it possible to create a automatically horizontal scrolling TextView with a button to the right of it using layout_weight?
"My incredibly long search text here" "The button"
I have tried to make a scrollable textview with "fill_parent" instead of 0dp and layout_weight as well but then the entire text takes up the "row" (obviously since it is fill_parent) and the button is not shown AND the text didn't scroll horizontally even then when I ran it in the android virtual device.
Edit: forgot to write how I tried to make the scrollable textview
<TextView
android:singleLine="true"
android:scrollHorizontally="true"
android:ellipsize="marquee"
android:marqueeRepeatLimit="marquee_forever"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/searchResult"
android:focusable="true"
android:focusableInTouchMode="true"/>
Of course it's possible. Something like this will do:
<LinearLayout
android:layout_widht="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="0px"
android:layout_weight="7"
.../>
<Button
android:layout_width="0px"
android:layout_weight="3"
... />
</LinearLayout>
Key here is make the width zero so that there's all horizontal space remaining when the weight mechanism assigns all remaining space to linear layout components in relation to their layout weight.

Multiline TextView with width "wrap_content"

I am wondering how to have a TextView display its content on several lines without hardcoding the width in the XML.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="false"
android:text="Long multiline text"/>
<TextView
android:textColor="#color/text_color"
android:layout_width="130dp"
android:layout_height="wrap_content"
/>
</LinearLayout>
Any thought welcome.
EDIT: my problem is that when the text exceeds the width set (because it reaches the end of the screen) a portion of the text is just not displayed. I would expect the text to be split on two lines
Though I cannot reproduce the not wrapping problem, you can fix the positioning problem by using a weight on the first TextView. Using the following XML gives the expected output in the graphical layout view in Eclipse:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right"
android:orientation="horizontal">
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:singleLine="false"
android:text="Long multiline text"/>
<TextView
android:textColor="#color/text_color"
android:layout_width="130dp"
android:layout_height="wrap_content"
/>
</LinearLayout>
Also add
android:minLines="2"
android:scrollHorizontally="false"
You could try
android:inputType="textMultiLine"
in your TextView XML. This worked for me.
I think I had very similar problem. I had a TextView with a text, where I was not sure how much lines will it take. It was encapsulated by a LinearLayout having android:layout_width="match_parent" to ensure my text will fill out all the space horizontally. However, the problem was that my text did not fit into 1 line and when it did break into a new line, the next view component below it did not move downwards to give enough space for the second line to be viewable fully.
I could achieve the solution by changing the LinearLayout that was containing my TextView into a RelativeLayout. By this way, the element below the text (actually below the Layout itself) was moved automatically to give enough space for the multi-line text.

Android TextView and Button side-by-side, ellipsize left TextView

I have a left-aligned TextView and a right-aligned button side-by-side. I want the button to take up as much space as it needs on the right (depending on the text that goes in it) and the left text to fill as much as it can and ellipsize on any overflow.
|Long title that may or may not ellipsi... <Button with text>|
I've read and tried lots of other posts that seem to have similar problems, none of which have worked for me. I've tried both using a LinearLayout with weights as well as a RelativeLayout with layout_toLeftOf assigned, none of which is resulting in what I need.
This is my LinearLayout code (with unnecessary parts taken out) where I give the left TextView a layout_weight of 1 and the button a layout_weight of 0. This should give the right-side button all the space it needs and give the TextView the rest, but instead the left title stops showing up and the right button gets smushed to the side and cut off. I've tried replacing the widths of both the Text and button to 0dip as I've seen suggested, which doesn't change anything.
<LinearLayout
android:layout_height="#dimen/title_bar_height"
android:layout_width="fill_parent"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:ellipsize="end"
android:layout_gravity="left|center_vertical"
android:gravity="left|center_vertical"
android:textSize="22sp"
android:lines="1"/>
<include layout="#layout/action_buttons"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"/>
</LinearLayout>
Replacing the layout_weight of the TextView with 0 actually allows the right-side button to properly fit on the screen fully, but the left text still does not show up. If I have both layout_weights set to 0 for the TextView and button and I then change the TextView's width from 0dip to wrap_content, everything shows up but the button instead is squished to fill the remaining space (and the text inside is truncated).
Here is my attempt with a RelativeLayout:
<RelativeLayout
android:layout_height="#dimen/title_bar_height"
android:layout_width="wrap_content">
<include layout="#layout/action_buttons"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#layout/action_buttons"
android:gravity="center_vertical"
android:scaleType="center"
android:textSize="22sp"
android:ellipsize="end"
android:lines="1"/>
</RelativeLayout>
Everything aligns fine and shows up, except that the left TextView (when it's too long) overlaps and appears on top of the button rather than truncating and ellipsizing. Shouldn't android:layout_toLeftOf"#layout/action_buttons" specify that the TextView should stay to the left boundary of the button?
I've tried seemingly everything I can find on this site related to this issue, and I still can't get a solution. Any help would be greatly appreciated!
This will do the trick for you:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="left|center_vertical"
android:layout_weight="1"
android:ellipsize="end"
android:gravity="left|center_vertical"
android:singleLine="true"
android:text="Some really long textttttttttt tooooooooooo make the ellipsize work in the preview"
android:textSize="22sp" />
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button Text" />
</LinearLayout>
Here's what it looks like when run:
And again with a button with more text:

Android: Content goes off screen

He is an example of my TextView, which goes off the right side of the screen. I tried setting paddings and stuff, but nothing seemed to work. Any ideas? Here is my hierarchy,
ScrollView,TableLayout
<TableRow>
<TextView
android:layout_column="1"
android:id="#+id/text_price"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:inputType="textCapCharacters"
android:padding="2dip"
android:text="#string/game_price"
/>
<EditText
android:id="#+id/gameprice"
android:inputType="textCapCharacters"
android:gravity="right"
android:minWidth="120dip"
/>
</TableRow>
Try setting the width of the textview to wrap_content, remove the layout_column=1 (not necessary, afaik), and set the height and width of the edittext to wrap_content.
Anyway it's weird to have a textview filling the screen and an edittext to its right with a width of at least 120dip. If you stick to a TableLayout maybe you'll have to play with the weights of the elements, tho I'm not too sure of how this works in a tableLayout. To fill the width of the screen, define that in the TableLayout with fill_parent.
If what you want is a TextView taking all the space left by the EditText placed to the right, a RelativeLayout would do the work
<RelativeLayout>
<EditText
android:id="#+id/gameprice"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="textCapCharacters"
android:gravity="right"
android:minWidth="120dip"/>
<TextView
android:id="#+id/text_price"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:inputType="textCapCharacters"
android:padding="2dip"
android:text="#string/game_price"
android:layout_toLeftOf="#id/gameprice"/>
</RelativeLayout>
You'll need to play with the placement of the EditText, the TextView will stick to its left.

Categories

Resources