Develop Reference

How to set textView as right as possible and set textView show only a part of text?

I have the xml code shown below. Everything is working as it should except the final textView( id locationTextView) which won't stay right. I want it to stay as right as possible, but I can't do that(it still appears straight after the linear Layout).Should I set a left margin?. And for the textView1 how can I make it to show only a certain part of the whole text, because I have texts of different lengths and they ruin the 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="wrap_content"
android:background="#color/product_list_item_bg"
android:descendantFocusability="blocksDescendants">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ImageView
android:id="#+id/icon"
android:layout_width="72dip"
android:layout_height="72dip"
android:layout_margin="3dip"
android:adjustViewBounds="true"
android:contentDescription="#string/descr_image"
android:scaleType="centerCrop" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/item"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:padding="2dp"
android:text="Medium Text"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#33CC33" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="TextView" />
</LinearLayout>
<TextView
android:gravity="right"
android:layout_width="72dip"
android:layout_height="72dip"
android:layout_marginTop="0dp"
android:textAppearance="?android:attr/textAppearanceLarge"
android:id="#+id/locationTextView"
android:layout_gravity="right" />
</LinearLayout>
</RelativeLayout>

Try android:layout_weight="1" or some other value for your locationTextView. You can also try out android:weightSum="3" (or that is appropriate instead of 3) on your root LinearLayout. Assign proper weights to your different child views. You can get help here
For showing text in a presentable way, you could use android:ellipsize="marquee" or other options available.

Prevent textview from being pushed further to the right - Android

UPDATE
The problem has been solved. It seems like I need both the:
android:layout_alignParentLeft="true"
and:
android:layout_toLeftOf="#id/Image"
lines in the linearlayout.
<LinearLayout
android:id="#+id/Text"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="10dip"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#id/Image"
android:gravity="left">
I am trying to create a layout where on the left hand side there are two textViews, and on the right there is an image:
All is working fine except from when either of the textViews has a small amount of text in it.
When a textView has a smaller amount of text in it, it gets pushed further over to the right, and is no longer flush with the left hand side of the screen.
My question is, how to I make it so that no matter what, each of the textViews will always be flush with the left hand side of the parent; as opposed to it being pushed to the right if it has a smaller amount of text in.
I have included links below to images of the layout (I can't post images yet)
This first screen shot is of the layout working fine, and how I want it to look all the way through.
http://pbrd.co/1tZhJti
This second screenshot is of the layout braking. Can you see the highlighted row and how it is being pushed to the right, that is what I want to rectify.
http://pbrd.co/1tZhVss
Here is the code, if anyone can help me that would be great! Thanks!
<?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:padding="8dp">
<ImageView
android:id="#+id/Image"
android:layout_width="60dp"
android:layout_height="60dp"
android:padding="5dp"
android:src="#drawable/icon"
android:layout_alignParentRight="true" />
<LinearLayout
android:id="#+id/Text"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="10dip"
android:layout_toLeftOf="#id/Image"
>
<TextView
android:id="#+id/Text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FF7F3300"
android:paddingLeft="0dip"
android:textSize="20dip"
android:layout_alignParentLeft="true"
/>
<TextView
android:id="#+id/Text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14dip"
android:paddingLeft="0dip"
android:textColor="#FF267F00"
android:layout_alignParentLeft="true"
/>
</LinearLayout>
</RelativeLayout>

Just insert android:layout_alignParentLeft="true" in your Linear layout...works like a charm
<LinearLayout
android:id="#+id/Text"
android:orientation="vertical"
android:layout_alignParentLeft="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="10dip"
android:layout_toLeftOf="#id/Image"
>

Just remove this line
android:layout_toLeftOf="#id/Image"
There is no need of that. Since you are aligning your LinearLayout to the left of your image, so when the text is small, the LinearLayout align itself to the right(to the left of image). so If you remove above line, your LinearLayout along with TextView's will now automatically alligned to left. But in this case you have to set ems to both TextView's to avoid overlapping with the image.

<?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"
android:weightsum="5"
android:padding="8dp">
<LinearLayout
android:id="#+id/Text"
android:orientation="vertical"
android:layout_width="0dp"
android:layout_weight="4"
android:layout_height="wrap_content"
android:paddingLeft="10dip">
<TextView
android:id="#+id/Text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FF7F3300"
android:textSize="20sp"/>
<TextView
android:id="#+id/Text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14sp"
android:textColor="#FF267F00"/>
</LinearLayout>
<ImageView
android:id="#+id/Image"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:src="#drawable/icon"
android:scaleType="center"/>
</LinearLayout>

ListView displaying problems

I have a listview that consists three columns. The first one is an ImageView, the second and third one are textviews (see code blow).
I want the list to be aligned like this:
the icon and the date should always been shown completely !!
the text in the middle should show as much chars as possible
the date should always be on the right of the right side
With the XML below it looks ok on my Nexus 4. But on the asus tablet the date should be more on the right and the coloumn in the middle should show more text (screenshot 1). On the AVD (screenshot 2) the coloumn in the middle should be smaller and the date should be shown completely.
Can anyone tell me how to change the XML? Thanks!
<?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="fill_parent"
android:padding="5dp" >
<ImageView
android:id="#+id/logo"
android:layout_width="50px"
android:layout_height="50px"
android:layout_marginLeft="5px"
android:layout_marginRight="20px"
android:layout_marginTop="5px"
android:src="#drawable/social_chat"
android:layout_weight="0"
>
</ImageView>
<TextView
android:id="#+id/label"
android:layout_width="0px"
android:layout_height="fill_parent"
android:layout_marginTop="0px"
android:text="#+id/label"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_weight="50"
android:maxLines="1"
android:singleLine="true"
>
</TextView>
<TextView
android:id="#+id/last_changed"
android:layout_width="0px"
android:layout_height="fill_parent"
android:layout_marginTop="15px"
android:layout_marginLeft="5px"
android:text="#+id/last_changed"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_weight="50"
android:maxLines="1"
android:singleLine="true"
>
</TextView>

Off the top of my head your layout would look something like this.-
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="5dp" >
<ImageView
android:id="#+id/logo"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="20dp"
android:layout_marginTop="5dp"
android:src="#drawable/social_chat" />
<TextView
android:id="#+id/label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#+id/label"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_weight="1"
android:singleLine="true" />
<TextView
android:id="#+id/last_changed"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:layout_marginLeft="5dp"
android:text="#+id/last_changed"
android:textAppearance="?android:attr/textAppearanceSmall"
android:singleLine="true" />
</LinearLayout>
The key here is to use wrap_content for the views that just need to keep their size, and set a weight for the middle view, which you want to fill the rest of the row.
Some useful tips.-
fill_parent is deprecated, use match_parent instead
When a view has no children, you can just close it with />
singleLine="true" is enough to have a singleLined TextView
You'll usually want to use dp units instead of px

This should do your job. I have put the imageview on the parents left, the date on the parents right and the label to the rightof image and to the left of date.It should work fine for you. Margins , padding please put yourself
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:src="#drawable/social_chat" />
<TextView
android:id="#+id/last_changed"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:singleLine="true" />
<TextView
android:id="#+id/label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_toLeftOf="#id/last_changed"
android:layout_toRightOf="#id/logo"
android:singleLine="true" />
</RelativeLayout>

Layout out elements within a RelativeLayout

I'm having a very difficult time figuring out how to lay out this element. Here's what I want to do (apologies for my MS Paint skills):
Here, the gray box is supposed to be an ImageView. The red lines here are just to make the sections more clear - not worried abot how to draw them. The features that I'm trying to get are:
The ImageView is aligned relative to the topmost red line, and to the left edge of the green box.
The "TEXT" is to the right of the image, and centered vertically in its section.
Without the ImageView, this is pretty straightforward - just a LinearLayout with three TextViews and some padding. I've tried doing this wit a RelativeLayout, but I'm unsure of how to center Text within the box without relying on guessing at the padding/margin.
I figured out how to get the box hanging over. I created my RelativeLayout
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_marginTop="20dp"
android:background="#3AF">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="20dp"
android:background="#AAA">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="New Text"
android:padding="10dp"
android:id="#+id/textView"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="New Text"
android:padding="10dp"
android:id="#+id/textView1"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="New Text"
android:padding="10dp"
android:id="#+id/textView2"/>
</LinearLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:src="#drawable/ic_launcher"
android:id="#+id/imageView"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"/>
</RelativeLayout>
But what I can't figure out is how to align the topmost TextView to the right of the ImageView. (Note - this is just my attempt. The layout type/style is entirely flexible at this point).
Here's a screenshot of how it looks in the designer:
Any ideas?

android:layout_toRightOf
Should work... If not, can you explain what's wrong and what are your issues, because it works fine here...

Try putting your first line into your LinearLayout and then everything else in your RelativeLayout. I haven't tried this code, but if I understand your scenario correctly, it should do the trick.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_marginTop="20dp"
android:background="#3AF">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_parent"
android:layout_alignParentTop="true"
android:layout_marginTop="20dp"
android:background="#AAA">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:src="#drawable/ic_launcher"
android:id="#+id/imageView"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="New Text"
android:padding="10dp"
android:id="#+id/textView"/>
</LinearLayout>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="New Text"
android:padding="10dp"
android:id="#+id/textView1"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="New Text"
android:padding="10dp"
android:id="#+id/textView2"/>
</LinearLayout>
</RelativeLayout>

Why two items in the same relative layout are differently layouted?

I have a listview with item specified by RelativeLayout
There is an image (gray arrow, this is png, with transparent padding). In first case text with blue back overlaps this image, in second - it is aligned.
The only difference between these cases is that left photo is invisible in first case. I do not understand why in second case the blue text does not overlap gray arrow? (it is desirable behavior)
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="#dimen/padding_content">
<ru.ip_news.ui.views.RationalImage
android:id="#+id/picture"
android:layout_width="#dimen/article_short_image_width"
android:layout_height="fill_parent"/>
<View
android:id="#+id/separator"
android:layout_width="#dimen/padding_content"
android:layout_height="fill_parent"
android:layout_toRightOf="#id/picture"/>
<ImageView
android:id="#+id/dis_ind"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="#drawable/dis_ind"/>
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/separator"
android:layout_toLeftOf="#id/dis_ind"
android:layout_gravity="left"
android:textStyle="bold"
android:textColor="#color/article_text_main"
android:maxLines="2"
android:ellipsize="end"
android:background="#F0F0"/>
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/separator"
android:layout_below="#id/title"
android:layout_alignParentBottom="true"
android:textColor="#color/article_text_secondary"
android:maxLines="4"
android:background="#F00F"/>
</RelativeLayout>

I've never worked with Android coding before, but just from looking at your code I'd say there's a conflict between android:layout_alignParentRight="true" found here:
<ImageView
android:id="#+id/dis_ind"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="#drawable/dis_ind"/>
and your android:layout_alignParentBottom="true" found here:
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/separator"
android:layout_below="#id/title"
android:layout_alignParentBottom="true"
android:textColor="#color/article_text_secondary"
android:maxLines="4"
android:background="#F00F"/>
I've never worked with the code base before and don't have a "solution" for you, but maybe it'll get you a starting point.

Since the picture no longer exists in the top view , the layout has become smaller so the textviews are closer. Put some margin between the two text views to fix the issue.

Resolved the problem by extracting linearlayout and moving photo to it. For some reason this photo in the same layout involves space between texts.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="#dimen/padding_content">
<ru.ip_news.ui.views.RationalImage
android:id="#+id/picture"
android:layout_width="#dimen/article_short_image_width"
android:layout_height="fill_parent"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="#dimen/padding_content">
<ImageView
android:id="#+id/dis_ind"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="#drawable/dis_ind"/>
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/dis_ind"
android:layout_gravity="left"
android:layout_alignParentLeft="true"
android:textStyle="bold"
android:textColor="#color/article_text_main"
android:maxLines="2"
android:ellipsize="end"/>
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/title"
android:layout_alignParentBottom="true"
android:textColor="#color/article_text_secondary"
android:maxLines="4"/>
</RelativeLayout>
</LinearLayout>