android:layout_alignBottom not working for API 18 and below? - android

Need some enlightenment if this is different Android version issue (v18 SDK and before).
Below is the layout we have, in particular the txt_subitem should be align bottom of img_picture. The code below works fine for v19 and later (since Kit-Kat), but not for v18, as shown in picture beneath.
<RelativeLayout
android:id="#+id/img_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/img_picture"
android:layout_width="100dp"
android:layout_height="80dp"
android:src="#0f0"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_margin="20dp"/>
<TextView
android:id="#+id/txt_subitem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/img_picture"
android:text="testing"
android:layout_alignBottom="#+id/img_picture"
android:background="#00f"
/>
</RelativeLayout>
The below shows what v19 SDK display. E.g. the blue color is aligned with the green box, which is expected due to android:layout_alignBottom="#id/img_picture"
However, for v18 SDK and before (tested on v17 and v16 through emulator and real devices), the image is layout where the blue color box is not aligned as expected, but alignment extend to the margin (20dp) of #+id\img_picture.
Could someone shed some light if this is the Android v18 SDK issue or I have missed something. Thanks!

For API 18 and earlier, the margin is being applied after the alignment so if the margin in the ImageView is greater than 0 you will get your textview moved. You can check this setting the margin to 0.
If you want to add a margin from his parent, try this:
Keeping android:layout_margin="20dp", add android:layout_marginTop="10dp" to your TextView
Not keeping android:layout_margin="20dp", use padding in the parent view (like the example).
<RelativeLayout
android:id="#+id/img_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="20dp">
<ImageView
android:id="#+id/img_picture"
android:layout_width="100dp"
android:layout_height="80dp"
android:src="#0f0"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"/>
<TextView
android:id="#+id/txt_subitem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#id/img_picture"
android:layout_alignLeft="#id/img_picture"
android:text="testing"
android:background="#00f"/>
</RelativeLayout>

#Courtesy to Frank N. Stein
<RelativeLayout
android:id="#+id/img_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/img_picture"
android:layout_width="100dp"
android:layout_height="80dp"
android:src="#0f0"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_margin="20dp"/>
<TextView
android:id="#+id/txt_subitem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#id/img_picture"
android:text="testing"
android:layout_alignBottom="#id/img_picture"
android:background="#00f"
/>
</RelativeLayout>

you can use FrameLayout instead of RelativeLayout. that will suitable for your requirement.In FrameLayout you can move your TextView with simply using gravity.

Related

Align layout item to the right and RTL on Android

I'm trying to put three items in horizontal align using this code
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right"
android:layout_gravity="right"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_marginLeft="10dp"
android:src="#drawable/address"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textStyle="bold"
android:text="#string/lbl_address"/>
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:id="#+id/txtAddress" />
</LinearLayout>
The problem is gravity never worked, the ImageView always starts from the left and other items follows in the same order.
I have tried to reverse item orders in the code which will work on none RTL languages, but my application targets both, so it shows wrong on RTL supported devices.
Also I have tried RelativeLayout but items come over each other.
Note: All languages should start from right to left, this is my desired behavior
Add this attribute to your root LinearLayout tag:
android:layoutDirection="rtl"
This will make your view lay out as though the user had chosen a right-to-left language, regardless of what language they've actually chosen.
Try to use this code in AndroidManifest.xml
android:supportsRtl="true"
For support languages that start from right in app.
Because you use android:layout_width="0dp" android:layout_weight="1" in your code .The TextView will use the rest of space .So the left image will on the left .So you can remove android:layout_weight="1" and change the width of TextView .
You can change
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:id="#+id/txtAddress" />
to
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:id="#+id/txtAddress" />
Note
If you want to change the location of the LinearLayout's item .You can use android:gravity="right" .
If you want to change the location of the LinearLayout ,you can use android:layout_gravity="right" .
And you code is android:layout_width="match_parent" , so the android:layout_gravity="right" has no effect .
And you can use android:layoutDirection="rtl" in your LinearLayout
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right"
android:layout_gravity="right"
android:layout_marginTop="10dp"
android:orientation="horizontal"
android:layoutDirection="rtl"
xmlns:android="http://schemas.android.com/apk/res/android">

ImageButton and Button in FrameLayout won't change z-index

When you switch the order of the elements, place Button after ImageButton, the z-index is not affected. I tried with other types of Views and they are positioned correctly on top of one another depending on their order in the parent FrameLayout.
I tried programmatically with View.bringToFront() without success.
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Suzi"
android:textSize="22sp" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher" />
</FrameLayout>
I tried to reproduce the issue: it is reproduced for me on Lollipop+ devices and isn't reproduced on pre-Lollipop.
Could you please check this?
If it is exactly the case, then the solution might be to use android:translationZ attribute (which is available since Lollipop)
Something like:
<FrameLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Suzi"
android:textSize="22sp"
android:translationZ="1dp"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
android:translationZ="2dp"/>
</FrameLayout>
And that fact that translationZ isn't available on pre-Lollipop would not matter (and attribute would be ignored), as there is no such issue.
Hope it helps

Android RelativeLayout Design issues

I designed one layout which have total 4 RelativeLayout one is outer cover and 3 are child of it. When I put White color in the outer layout than no spaces are left but when I put 9patch image as drawable image than little default padding/margin are left. Is there any properly which solve the padding/margin issue? I have tried margin negative but it will hide bit layout I think it is not proper solution, here is my layout
when I put white color as background than my layout look like
Here is the following code of my layout
<RelativeLayout
android:id="#+id/DetailSection1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/HeaderLayout"
android:layout_toLeftOf="#+id/DetailSection2"
>
<TextView
android:id="#+id/lblRestaurantName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/DetailSection1"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:textColor="#color/heding_font"
android:textSize="#dimen/headingFont"
android:text="Restaurant Name" />
<ImageView
android:id="#+id/imgpin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/lblRestaurantName"
android:layout_margin="5dp"
android:src="#drawable/pin" />
<TextView
android:id="#+id/lblAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/lblRestaurantName"
android:layout_marginTop="5dp"
android:layout_toRightOf="#+id/imgpin"
android:text="Address"
android:textColor="#color/restaurant_list_font"
android:textSize="#dimen/lableNormalFont"
/>
<ImageView
android:id="#+id/imgphone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/lblAddress"
android:layout_margin="5dp"
android:src="#drawable/phn" />
<TextView
android:id="#+id/lblMobile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/lblAddress"
android:layout_marginTop="5dp"
android:layout_toRightOf="#+id/imgphone"
android:text="Mobile"
android:textColor="#color/restaurant_list_font"
android:textSize="#dimen/lableNormalFont"
/>
<ImageView
android:id="#+id/imgstar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/lblMobile"
android:layout_margin="5dp"
android:src="#drawable/star" />
<TextView
android:id="#+id/lblStar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/lblMobile"
android:layout_marginTop="5dp"
android:layout_toRightOf="#+id/imgstar"
android:text="Star"
android:textColor="#color/restaurant_list_font"
android:textSize="#dimen/lableNormalFont"
/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/DetailSection2"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignBottom="#+id/DetailSection1"
android:layout_toLeftOf="#+id/DetailSection3"
android:layout_toRightOf="#+id/lblStar" >
<ImageView
android:id="#+id/imgmore"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:src="#drawable/read_more" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/DetailSection3"
android:layout_width="95dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/HeaderLayout"
android:layout_gravity="center"
android:layout_centerInParent="true"
android:background="#drawable/photo_cover" >
<ImageView
android:id="#+id/imgRestaurant"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/lblMobile"
android:layout_margin="5dp"
android:src="#drawable/rihanna" />
</RelativeLayout>
</RelativeLayout>
From the 9-patch drawable image you posted:
The bottom line which indicates the horizontal data population on the view wasn't drawn from the starting point of left.
I am not sure about it. And I know I wasn't clear in explaining the above line.
Just check this:
Consider the below 9-patch is used as a background for a TextView. If you put some text in it, it will start from the area where the bottom line is drawn. Which mean it will start from the left and go all the way to right.
If you use the following 9-patch as a background and try the same thing which you did above. Will result in Text not written from the left. It leaves a bit padding.
That is the reason why you get such result. Of course I am 100% sure about it.
So, just to find out if this works. Try changing the bottom line to fill complete image.
I think you better apply the background color for which layout you want exactly.And one more keep the code so that we can understand easily what is your issue.

Cannot set Font size as TextView's height

In my app I set one TextView and I noticed that there were some spaces above and below the text, as in the image below.
But my expected result is this :-
I Googled lots and found this answer link, but nothing happens.
Updated :
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="50dp"
android:background="#484848"
android:textColor="#fff"
android:text="A"
android:layout_centerInParent="true"/>
This is the tag I used for displaying text.
Updated :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/rl"
tools:context=".MainActivity" >
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="50dp"
android:background="#484848"
android:textColor="#fff"
android:text="A"
android:paddingTop="0dp"
android:layout_centerInParent="true"/>
</RelativeLayout>
Updated Image :
Actually, its a padding of 9-patch backgrounds drawable which is by default for Android TextView background. And you are just set color to it #484848. So you don't have any solution for it.
As per my concern use the same size of height (android:layout_height) for your TextView as same as your TextSize (android:textSize="50dip") of your TextView. (instead of android:layout_height="wrap_content")
Try with below code:
<TextView android:layout_width="wrap_content"
android:layout_height="50dip"
android:layout_marginTop="-5dip"
android:textSize="50dip"
android:background="#484848"
android:textColor="#fff"
android:text="A"
android:includeFontPadding="false"
android:layout_centerInParent="true"/>
I also added some margin in negative. android:layout_marginTop="-5dip"
Hope this will help you a little bit.
android:layout_height="wrap_content" only works at certain times, for example, when you setHeight(), setWidth(), setText(), setMinHeight(), .... These methods will request the layout to wrap the content again.
But setTextSize() doesn't request the layout.
To trigger wrap_content to work again, you can call setMinHeight(0).

Why TextViews running into each other in RelativeLayout

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 ;)

Categories

Resources