I have a rather simple ListView row:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/tournament_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:textSize="25dp" />
<TextView
android:id="#+id/tournament_winner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:textSize="25dp" />
</RelativeLayout>
When the text of "#+id/tournament_name"is long - it overlaps with the one from "#+id/tournament_winner" and I don't understand why.
I tried using android:singleLine="false"to no avail. I also tried using android:inputType="textMultiLine"as the docu says android:singleLine="false" is deprecated but then I get the warning: Attribute android:inputType should not be used with <TextView>: Change element type to
<EditText> ? so no good here as well.
I also tried using android:ellipsize="end" but this doesn't work. I assume it is because the text in the left TextView ("#+id/tournament_name") is NOT long enough to fill up the full width of the ListView (which code is not sowing here).
I was sure that if I use android:layout_width="wrap_content"the two TextView fields shouldn't overlap.
Here is an example (see the second line):
Any further ideas how this could be fixed?
android:layout_toLeftOf="#id/tournament_winner" in First TextView.
Also set android:maxLines="1" and Fix width for tournament winner because when it gets long tournament name cant see...
row.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/tournament_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#id/tournament_winner"
android:maxLines="1"
android:text="NAMEEEEEEEEEEEEEEEEEEEEEEEEEEE"
android:textSize="25dp" />
<TextView
android:id="#+id/tournament_winner"
android:layout_width="wrap_content" android:layout_marginLeft="10dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="WINER"
android:textSize="25dp" />
</RelativeLayout>
Thank you very much for your answer - sorry it took me some time to respond. I ended up using your android:layout_toLeftOf="#+id/tournament_winner" but left the single line and the margin to the left unused, as the result seemed perfect to me (hope this is also the case for other devices).
One thing though - in the first text view (tournament_name) I had to use android:layout_toLeftOf="#+id/tournament_winner"and not android:layout_toLeftOf="#id/tournament_winner" - pay attention to the added +. For some reason I get an error using android:layout_toLeftOf="#id/tournament_winner": Error: No resource found that matches the given name... so it seems that it is possible and NEEDED to define the resource in the time of calling it because the system doesn't know it before it was defined.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/tournament_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/tournament_winner"
android:layout_alignParentLeft="true"
android:textSize="25dp" />
<TextView
android:id="#+id/tournament_winner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:textSize="25dp" />
</RelativeLayout>
You can use single text view in place of two and simply display both strings in one text view !!
Related
I am using a custom Toast and sometimes the text view gets clipped off if the field is too long:
XML:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/toast" >
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_gravity="fill_horizontal"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/someotherview"
android:layout_alignBottom="#+id/someotherview"
android:layout_alignLeft="#+id/someotherview"
android:text=""
android:textAppearance="?android:attr/textAppearanceMedium"
android:textStyle="bold" />
</RelativeLayout>
I have tried virtually everything starting from android:gravity="fill" to android:ellipsize="marquee". Nothing seems to work. Does anyone know why?
Perhaps something like this would help you: http://www.androidviews.net/2012/12/autoscale-textview/
It re-sizes the textview (and the text) to fit in your other view.
Okay I have a full week of frustration behind me, it is the third time that the layout behaves random.
For example:
<TextView
android:id="#+id/tvGebiedHead"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="18dp"
android:layout_marginTop="16dp"
android:text="Geef gebied op"
android:textAppearance="?android:attr/textAppearanceLarge" />
<ListView
android:id="#+id/lvGebieden"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_alignLeft="#+id/textView1"
android:layout_alignParentRight="true"
android:layout_below="#+id/textView1" >
</ListView>
produces a result where the listview is displayed on top of the textview (making both items unreadable). The code down here produces the desired result, the listview is rendered under the textview. It is not the eclipse graphical editor, but it happens on a real phone as well. Note that the only difference between the two snippets is the id of the TextView.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="18dp"
android:layout_marginTop="16dp"
android:text="Geef gebied op"
android:textAppearance="?android:attr/textAppearanceLarge" />
<ListView
android:id="#+id/lvGebieden"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_alignLeft="#+id/textView1"
android:layout_alignParentRight="true"
android:layout_below="#+id/textView1" >
</ListView>
Earlier this week I had a fight with the layout of four togglebuttons which (all!!) changed size, text align on the button, and even location when I clicked one, while the on and off text was exactly the same. Please tell me I am doing something wrong and android is not broken.
In the example on the top, your ListView's layout_below still refers to #id/textView1 which doesn't exist. It does, however, in your example at the bottom, so the bottom is working. FYI, instead of #+id/textView1 you should use #id\textView1 in the layout_below.
I have a layout in which two TextViews are to be displayed on the same line such that
If TextView1 is a short text, TextView2 should be immediately right to TextView1(IMAGE1) and if the TextView1 is a long text, TextView2 should be at right corner of the Layout on the same line(IMAGE2)
How can I achieve this ?
i use simple horizontal LinearLayout with android:layout_weight attribute and it worked like you want.
Example:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<TextView
android:id="#+id/text1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="teeeeeeeext1"/>
<TextView
android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="text2"/>
</LinearLayout>
Use a layout like this..
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<EditText
android:id="#+id/editText1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" >
<requestFocus />
</EditText>
<EditText
android:id="#+id/editText2"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginLeft="38dp"
android:layout_toRightOf="#+id/editText1" />
</RelativeLayout>
edittext 1 will push edittext2 to its right...depending on text in it..
You can set android:maxWidth property for first text view. So your layout would look like this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxWidth="200dp"
android:text="sdfksdofsdfsdfsdfsadfgwagrswargweqrgeqrgqwergeqrgeqrg"
/>
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/textView1"
android:text="text2"
/>
Edit:
I apparently misread (or did not read fully) your question. Just don't mind my answer - I vote for mxy's :)
The last time I had the same problem, I wasn't able to find or hack away a straightforward solution. Counting pixels was not an option (at least not for me). But I found a workaround that eventually led to the same display concept, and that was to use SpannableStringBuilder.
As I'm assuming you want two different TextViews because you want them to have different colors (or size, or style, or typeface).
The idea is to use a single TextView for the whole thing, and prepare a SpannableString before doing setText on your view.
By using combinations of ForegroundColorSpan, TextAppearanceSpan, etc, you can make your single TextView look like different TextViews with different styles, sitting side by side, wrapping to the next line as necessary.
Links:
Setting font color at runtime
TextAppearanceSpan sample
https://docs.google.com/document/d/1SDDnAG-jkQjC6F85iPgfv3Et1pYl8t03k-TkCN3YcCw/edit
I have an Android preference page containing a mixture of stock, and custom List Items. The custom list items "Mood" and "Mixed Mood" can be seen in the screen shot in the referenced Google Doc, and function in the following way. (The external link is because, without a reputation of at leat 10, I'm not allowed to post images in stackoverflow...)
1) Before a user has chosen a value, they simply display their title. (either Mood or MixedMood)
2) After a user has chosen a value, they display their title AND a custom tool tip (the little colored squares), indicating their choice.
THE PROBLEM: You can see from the screen shot that before a user has chosen a value, the "Mood" text is not centered. I would like for it to be centered, and then dynamically make room for the custom tool tip after a choice is made. In other words, I would like
<TextView android:id="#+android:id/title"
To respond to
android:gravity="center_vertical".
Is this possible?
My layout file looks like this.
<?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:minHeight="60dip"
android:gravity="center_vertical"
android:paddingRight="?android:attr/scrollbarSize">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:layout_marginLeft="15dip"
android:layout_marginRight="6dip">
<TextView android:id="#+android:id/title"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:gravity="center_vertical"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textSize="18sp"/>
<!-- This image represents the dropdown arrow -->
<ImageView
android:gravity="center_vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_toRightOf="#android:id/title"
android:scaleType="fitEnd"
android:src="#drawable/ic_btn_round_more_normal_cropped" />
<monarca_rct.client.customcomponents.MoodScalePresentation
android:id="#+android:id/hpmp_mood_scale"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#android:id/title"
android:paddingTop="4.0dp"/>
</RelativeLayout>
</LinearLayout>
If i get your question right:
You can set android:layout_alignWithParentIfMissing="true" in <TextView android:id="#+android:id/title" for more info visit http://developer.android.com/resources/articles/layout-tricks-efficiency.html
I can't exactly try this out but I think it might be something like this:
<?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:minHeight="60dip"
//REMOVED GRAVITY
android:paddingRight="?android:attr/scrollbarSize">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
//REMOVED GRAVITY
android:layout_marginLeft="15dip"
android:layout_marginRight="6dip">
<TextView android:id="#+android:id/title"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:gravity="center_vertical|left"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textSize="18sp"/>
<!-- This image represents the dropdown arrow -->
<ImageView
android:gravity="center_vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_toRightOf="#android:id/title"
android:scaleType="fitEnd"
android:src="#drawable/ic_btn_round_more_normal_cropped" />
<monarca_rct.client.customcomponents.MoodScalePresentation
android:id="#+android:id/hpmp_mood_scale"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#android:id/title"
android:paddingTop="4.0dp"/>
</RelativeLayout>
</LinearLayout>
The reason to go from center_vertical to center_vertical|left is because your parent layout is like a grid and you can "choose" your position. So if you have:
(1) (2) (3)
(4) (5) (6)
(7) (8) (9)
[Don't mind the white spaces between each line, for some reason if I don't do it like that it gets displayed all in one line.]
The 4 is where you want your text. As you can see, the 4 is on the left but also vertically centered hence the combination:
android:gravity="center_vertical|left"
Quick question, why do you need a RelativeLayout inside a LinearLayout? You could do without the LinearLayout altogether from the looks of it.
I have a problem with two Textviews on the same height in a RelativeLayout running into each other.
I use the following Layout.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:id="#+id/logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="centerInside"
android:src="#drawable/icon" />
<TextView
android:id="#+id/name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="NameNameNameNameNameNameName"
android:layout_alignParentTop="true"
android:layout_toRightOf="#id/logo"
android:gravity="clip_horizontal"
android:lines="1" />
<TextView
android:id="#+id/information"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Distance"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true" />
<TextView
android:id="#+id/nrcoupons"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Number"
android:layout_alignRight="#id/information"
android:layout_alignBottom="#id/logo" />
<TextView
android:id="#+id/subcategory"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Subcategory"
android:layout_alignLeft="#id/name"
android:layout_alignBottom="#id/logo" />
</RelativeLayout>
This gives me this view:
alt text http://janusz.de/~janusz/view.png
Everything is as I need it except the two textviews name and information are displayed on the same screen space with the one on top of the other.
How can I avoid this?
For your #+id/name TextView, add android:layout_toLeftOf="..." for whatever TextView is on the right. The screenshot and the XML do not seem to line up (screenshot appears to have "Distance" in the overwritten TextView, but the XML does not), so I'm not completely certain which widget this is.
If you are targeting Android 1.5, you will need to order the widgets in the XML such that the widgets are defined before they are referenced from android:layout_toLeftOf or android:layout_toRightOf. If you are targeting Android 1.6 and newer only, you can have them be in any order, but the first occurrence of any distinct ID must have the + sign, even if that first occurrence is in an android:layout_toLeftOf attribute instead of an android:id attribute.
Your namenamename textview is set with width = fill_parent so you can't put anything to its right ;)