Develop Reference

Max lines with height set as wrap_content

I have two TextViews in a vertical LinearLayout, one serves as a display for a book's title and the latter as a display for the book's author(s).
I need the first to have wrap_content as its height, so it takes a good part of the linear layout. However, I want it to cap out at three lines max, so that there is still some space left for the second text view;
and I need the latter to fill the remaining space (0dp and layout_weight=0dp).
I want to use specific configuration so that the author view will be always right after the title view (on its bottom).
Something like this, however the max_lines do not kick in.
I tried to set max_lines to 3 and wrap_content for the first view height, but it seem that max_lines is ignored if height is set to wrap_content.
I also tried to circumvent the problem by sort of cheating and adding a max_height, but then the two views may be spaced apart from one another.
At last I tried to convert the linear layout to a constraint layout, to see if I could access some other layout settings to no avail.
Any help?

It seems to be working fine on my side with android:max_lines="3" even with wrap_content
This is just a test layout I created
<TextView
android:id="#+id/textview1"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:maxLines="3"
android:textSize="#dimen/_13sdp"
android:textStyle="bold"
android:text="Very Very Very Very Very Very Very Very Very Very Very Very Long Text"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textview2"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:text="Very Very Short Text "
app:layout_constraintStart_toStartOf="#+id/textview1"
app:layout_constraintTop_toBottomOf="#+id/textview1" />
Screenshot ->
Hope this helps! :)

Replacing app:max_lines with android:max_lines seems to have fixed the issue.

Android RTL layout direction align center issue

I'm developing an Android App that needs to be support Arabic language. (Which should be read from Right To Left). After quick googled the solutions, I figure out android fully support Arabic language natively in API level 17 with the declaration of
android:supportsRtl="true"
in the application tag inside of the AndroidManifest so that I can use the layout mirroring to automatically flip the layout for better right to left reading experience. However, I've noticed there is an issue happening while I use centerInParent in a view that inside of a sub RelativeLayout during the layout mirroring. Below are my codes and expected layout.
<RelativeLayout
android:background="#color/white"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:padding="20dp">
<RelativeLayout
android:background="#drawable/shape_flag_imageview_boarder"
android:id="#+id/imageLayout"
android:layout_height="wrap_content"
android:layout_width="wrap_content">
<ImageView
android:id="#+id/image"
android:layout_height="100dp"
android:layout_width="100dp"
android:visibility="invisible" />
<ProgressBar
android:id="#+id/progressbar"
android:layout_centerInParent="true"
android:layout_height="wrap_content"
android:layout_width="wrap_content" />
</RelativeLayout>
<TextView
android:id="#+id/text"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:layout_toEndOf="#id/imageLayout"
android:layout_width="wrap_content"
android:text="Some text here bla bla bla"
android:textColor="#color/black" />
</RelativeLayout>
Image above showing the expected result in normal layout direction which is Left to Right. The purpose I wrap the ImageView and ProgressBar together in a sub view is because I want the ProgressBar showing in the middle of the ImageView while the image is loading from the internet. After the I've changed Locale to Arabic, it becomes like
As I've try and error and figure out that this is causing by the centerInParent of the ProgressBar. It instead of centering inside the sub view, it align center to the root parent view which is the most outer RelativeLayout. Below is the screen shot of removing centerInParent code from the ProgressBar.
It clearly shows the layout mirroring works good, but the ProgressBar position is not what I'm expected. So I've try to work on centerVertical and centerHorizontal, the result are shown in images below respectively.
None of the solutions works, and none of the topic I've searched related to this issue. So I guess this might be a bug from Android library? If anyone knows the issues or solutions, please share to me. Thanks

I fixed it by adding android:layoutDirection="ltr" into the child RelativeLayout. Basically, it deactivates the RTL formatting for this particular RelativeLayout, and the android:layout_centerInParent="true" behaves correctly again. It solves our particular issue as our particular RelativeLayout contains only centred elements. But this trick should not be used if the Layout contains other elements which have to support correctly RTL, like text views for example. Hope it helps.

This is an RTL layout bug in the Android framework, which only affects Android 4.2 specifically (API 17) and when android:supportsRtl="true" is enabled in AndroidManifest.xml.
It happens when you use a RelativeLayout that contains items positioned with android:layout_centerVertical="true" or android:layout_centerInParent="true".
You can fix it in Java code like this:
View relativeLayout = layoutInflater.inflate(R.layout.my_relative_layout, parent, false);
// Fix RTL layout bug on Android 4.2 (for Arabic and Hebrew mode)
if (Build.VERSION.SDK_INT == 17 &&
getResources().getConfiguration().getLayoutDirection() == View.LAYOUT_DIRECTION_RTL) {
// Force a left-to-right layout
relativeLayout.setLayoutDirection(View.LAYOUT_DIRECTION_LTR);
}

let me tell you correct answer, look your RelativeLayout(id:imageLayout),it's width is wrap_content, and your ProgressBar(id:progressbar) add an attribute android:layout_centerInParent="true".It means parent not limit witdh,and child also want to center,so parent will be stretched.

Fixed-width TextView with stretched compound drawable

I'm trying to achieve the following layout: a fixed width TextView aligned to the left of its parent, with the text inside it aligned to the right side of that TextView (that's why fixed width, can it be done other way?) and the rest of the parent is filled with a drawable (simple line). Like this:
It's a ListView containing 2 types of rows and the layout for the rows with lines is quite trivial - LinearLayout with TextView and ImageView (I can post the exact code later if needed). And I'm getting a warning that it could be replaced with a single TextView with compound drawable.
I'm all for optimization so I really tried to follow that advice. Unfortunately I wasn't able to get the same result - the line is either constrained to TextView's width or text is aligned to the right side of the ListItem, now to fixed position.
Am I missing something?
Edit: Apparently it is not actually possible and since there are some other complications (the drawable is now a level-list drawable, which is not always a line and sometimes it has a non-fixed height that I have to set) I will leave it as it is now - linear layout, containing one TextView and one ImageView.

I don't think that you're missing anything. The TextView compound drawable features are not very customizable and in general are not worth the time you spend trying to get them to look right. Some lint warnings are a little overzealous and premature.

The optimization that the lint refers to is something that is better attributed for a fixed size image. In your case, the line has to stretch the rest of the screen length and as such it is not something that can be done with a textview with compound drawable. This kind of lint warning is more of a suggestion rather than something that MUST be done and is detected by just checking for a linear layout with only a textview and an imageview rather than checking what would need to go in the image view. If you already have it working the way you did it I think you should leave it alone.

Your view create from 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="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/time"
android:layout_width="#dimen/today_time_width"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:gravity="right"
android:layout_marginRight="5dp" />
<ImageView
android:layout_gravity="center"
android:id="#+id/border"
android:layout_width="match_parent"
android:layout_height="#dimen/today_current"
android:src="?attr/item_boundary" />
</LinearLayout>

There is no way to achive this using only standart TextView. If you really want to reduce view count you can create your custom TextView class, set layoutWidth to matchParent and draw line from text end to right border. But it's not worth to be doing. Some extra views won't slow your list.

I am not sure if you will be able to achieve what you really want to , but then you could change the linear layout in the link you posted to something like this:
<RelativeLayout
android:id="#+id/relTrial"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/txtTime"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:gravity="right"
android:text="12:45 AM"
android:layout_alignParentLeft="true"/>
<LinearLayout
android:id="#+id/lnrSep"
android:layout_width="fill_parent"
android:layout_height="1dp"
android:gravity="bottom"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_centerVertical="true"
android:orientation="horizontal"
android:background="#android:color/darker_gray"
android:layout_toRightOf="#+id/txtTime"
android:layout_alignParentRight="true"></LinearLayout>
</RelativeLayout>
This way the time text will be right aligned although being at the left side, and the line will also be visible.
Hope that helps.

If I got you right, you want to add bottom border to list view item?
What about to try this:
android:drawableBottom="#drawable/line"

Android RelativeLayout strange behaviour

I'm learning the relative layout and wrote a little test layout to simulate a login page:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="match_parent">
<TextView android:id="#+id/labelUsername"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="username:"
android:layout_centerVertical="true"/>
<EditText android:id="#+id/txtUsername"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:hint="input username here"
android:layout_toRightOf="#id/labelUsername"
android:layout_alignBaseline="#id/labelUsername"/>
<TextView android:id="#+id/labelPassword"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="password:"
android:layout_below="#id/txtUsername"
android:layout_alignParentLeft="true"/>
<EditText android:id="#+id/txtPassword"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:hint="input password here"
android:layout_below="#id/txtUsername"
android:layout_alignLeft="#id/txtUsername"
android:layout_alignBaseline="#id/labelPassword"/>
</RelativeLayout>
What I want is putting the Username Label and Textfield above the Password Label and TextField. But the result is reverted, password are above!
I think the problem is the "android:layout_below" property in labelPassword, if I set it to below labelUsername, it works, however because the textfield is much bigger than label, the both textfields are in this case overlayed. So i try to make the labelPassword below the txtUsername, but it performs strange, I don't understand.
By the way, is there any guideline when I build layout with Relative Layout?
What should I put there at first?
What should I put at last?
thanks!

I think what you are trying to achieve here is trying to get both the username and password fields vertically centered, and the password field below the username field. The error in your layout is that you only tell the username textview and edittext to center vertically, and relative layout centeres the layouts after having arranged them. So your username field is centered, while the password is left on top.
What you should do is tell the parent(RelativeLayout) to vertically center all its child elements.
For that simply remove this attribute from the "username" TextView element :
android:layout_centerVertical="true"
And add this attribute to your RelativeLayout element:
android:gravity="center_vertical" //tells RelativeLayout to vertically center all child elements
In this case i would recommend using a LinearLayout but you can continue using RelativeLayout for now. Hope it helps!

To answer your concrete question, it's because android:layout_centerVertical="true" rule you are applying to labelUsername.
It seems that the relative position doesn't work well, when the elements you are refering to, are centered. And it also doesn't make sense, in this case, because you probably want the whole form centered, not only the username fields and then put the password bellow.
You can put the elements in a containing element (another relative layout, or linear layout, or table layout, etc.) and center that element. That works. Or to center all the contents, you can add android:gravity="center" to the containing layout.

As you go through the different Layouts you will find that while Relative layout feels the most "natural" if you're used to positioning things via CSS, for example (with absolute or relative positions) the situation you're describing here calls for either Linear or Table layout. Table layout is probably your best bet for anything "form" related. Your table elements (columns) should have a layout_span attribute that details how many columns to go across (it's sort of analog to colspan in HTML).
I'm not sure what specifically is going wrong in your RelativeLayout above, and I'm sure that with adequate trial and error you could get it to do roughly what you want, but I strongly advise you to use the right tools for the job.
LinearLayout is also a terrific tool (which you should remember can be nested indefinitely). Give your Layout a weightSum and then each item can have a layout_weight (they should add up to be the sum), while their layout_width should be 0dp (it's not intuitive, but that's how it works). That's also a terrific way to make things sit where they ought to.
Lastly the answer to the correct order in RelativeLayout is that the items are Z ordered from bottom to top, so the later an item appears in the sibling order, the higher its Z order is. Otherwise, their order is irrelevant.

Android Layout Issue

Hi I'm having a daft problem with my android application.
Currently it looks like this:
Is there a way of making the button go to the bottom in the middle? I've tried messing around but same effect. Also tried changing the fill_parent/wrap_content, relative/linear layouts and gravities.
This is the screenshot of the .xml file
many thanks.

There are a couple things you can do to get this, with the relative layout you're using this would work. Add these lines to your button section
android:layout_below="#+id/android:empty"
android:layout_alignParentBottom="true"
android:layout_alignParentCenter="true"

Add these two attributes to your Button
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
and these one to your textview:
android:layout_above="#id/insertion"
android:layout_height="fill_parent"
Read the API reference here:
http://developer.android.com/reference/android/widget/RelativeLayout.LayoutParams.html

May be you want to use a linear layout instead of the relative one...
With the LinearLayout you can place your item without thinking on their relative position.
You can place a vertical linear layout and inside it another layout for the list of reminders.
<LinearLayout android:orientation="vertical">
<ListView android:width="fill_parent"android:weight="2" />
<Button android:width="wrap_content" android:weight="1" />
</LinearLayout>
With weight option, you can choose to make the Button to be painted before the ListView.
EDIT: Reading other answers, I'm considering if you really need a RelativeLayout to place a button under a listview. I think you should learn how to handle simple view before to start using something more complex. If LinearLayout solve your problem, why don't use it? This is a personal observation...