I am trying to place an TextView on a ImageView in the bottom center of the RelativeLayout.
I am able to place the TextViewin the center but not able to place it in the bottom .
Can anyone guide me.
here is my XML
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/back"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/eventimage"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="fitXY"
android:background="#000000">
</ImageView>
<TextView
android:id="#+id/text98"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_centerVertical="true"
android:singleLine="true"
android:textColor="#color/white"
android:text="LAST"
android:textStyle="bold"
android:textSize="18sp"/>
</RelativeLayout>
on the textView use the following attributes android:layout_centerHorizontal="true" instead of android:layout_centerVertical="true" and add android:alignParentBottom=true". Also look at the relative layout options to understand how to work with it.
try
<TextView
android:layout_alignParentBottom="true"
...
You could try using something like
android:layout_alignBaseline (#id/eventimage);
and add some padding on the bottom later
You can use this
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/back"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/eventimage"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="fitXY"
android:background="#000000">
</ImageView>
<TextView
android:id="#+id/text98"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:singleLine="true"
android:textColor="#color/white"
android:text="LAST"
android:layout_alignParentBottom="true"
android:textStyle="bold"
android:textSize="18sp"/>
</RelativeLayout>
Add this to your TextView:
android:layout_alignBottom="#id/eventimage"
Use this code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/back"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/eventimage"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="fitXY"
android:background="#000000">
</ImageView>
<TextView
android:id="#+id/text98"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_alignParentBottom="true"
android:alignBottom="#+id/eventimage"
android:singleLine="true"
android:textColor="#color/white"
android:text="LAST"
android:textStyle="bold"
android:textSize="18sp"/>
</RelativeLayout>
Hope it will help you.
Try the following:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/back"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/eventimage"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:background="#000000">
</ImageView>
<TextView
android:id="#+id/text98"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:singleLine="true"
android:textColor="#color/white"
android:text="LAST"
android:textStyle="bold"
android:textSize="18sp"/>
</RelativeLayout>
This layout works according to your requirement .by setting the gravity bottom of the linear layout ,its chilld view is automatically aligned at center- bottom position
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/back"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#drawable/ic_launcher"
android:gravity="bottom">
<TextView
android:id="#+id/text98"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:gravity="center"
android:singleLine="true"
android:text="LAST"
android:textSize="18sp"
android:textStyle="bold"
android:textColor="#android:color/white"/
>
</LinearLayout>
android:layout_alignParentBottom to move the control to the bottom of the screen.
Related
Hi I am using Gridview to display images with text below by using custom adapter. But problem is when I fetch image and display, align gets changing and it's not proper.Here is my code:
<?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">
<GridView
android:id="#+id/gridview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:numColumns="3" />
</RelativeLayout>
gridview.row:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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:orientation="vertical" >
<RelativeLayout
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/brand_picture"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"/>
<TextView
android:id="#+id/brand_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/brand_picture"
android:gravity="center_vertical"
android:text="TextView"
android:background="#color/blue"
android:textColor="#FFFFFF" />
How to achieve the expected output with same image size and text below that.
Expected output is:
But my output looks like this.
Thanks.
try this..hope it works for u..
<RelativeLayout
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/brand_picture"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignRight="#+id/brand_name"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/brand_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/brand_picture"
android:background="#color/blue"
android:gravity="center_vertical"
android:text="TextView"
android:textColor="#ffffff" />
On setting Wrap content the widget adjusts its height/width parameters to the given content size.so
change width of image view and text view from wrap content and set same width for both image view and text view.
eg:android:layout_width="70dp"
To get text in cente of text view you have to set
android:gravity="center"
xml:ROW
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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:orientation="vertical" >
<RelativeLayout
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#333333">
<ImageView
android:id="#+id/brand_picture"
android:layout_width="90dp"
android:layout_height="wrap_content"
android:background="#499999"
android:src="#drawable/ic_launcher"/>
<TextView
android:id="#+id/brand_name"
android:layout_width="90dp"
android:layout_below="#+id/brand_picture"
android:gravity="center"
android:text="AQUA LUNG"
android:background="#445657"
android:textColor="#FFFFFF" />
Add property,
android:layout_centerHorizontal="true"
to your ImageView as well as TextView. It will work.
You can try this layout:
Actually i have replaced your relative layout with linear layout, but it works just like what you want.
<LinearLayout
android:id="#+id/RelativeLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/brand_picture"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
android:layout_gravity="center" />
<TextView
android:id="#+id/brand_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/blue"
android:text="TextView"
android:textColor="#FFFFFF" />
</LinearLayout>
Hope this resolves your issue....
<RelativeLayout
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#000000">
<ImageView
android:id="#+id/brand_picture"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"/>
<TextView
android:id="#+id/brand_name"
android:layout_width="90dp"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/brand_picture"
android:layout_alignRight="#+id/brand_picture"
android:layout_below="#+id/brand_picture"
android:background="#445657"
android:gravity="center"
android:text="WHATEVER"
android:textColor="#FFFFFF" />
</RelativeLayout>
Or You can try
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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:orientation="vertical" >
<LinearLayout
android:id="#+id/RelativeLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/brand_picture"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
android:layout_gravity="center" />
<TextView
android:id="#+id/brand_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFFFFF"
android:text="TextView"
android:textColor="#FFFFFF" />
</LinearLayout>
</LinearLayout>
Hopw this helps you
I have a layout in which one of the inside doesn't come in center, It happens only in few resolution devices, whereas in few it comes perfectly in center. Below is code and screenshot
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content" android:gravity="center"
android:src="#drawable/thank" android:paddingTop="10dip"
android:paddingBottom="10dip"/>
Code :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:id="#+id/splash_layout"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:gravity="center" android:orientation="vertical"
android:background="#drawable/background">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content" android:gravity="center_horizontal"
android:src="#drawable/logo" android:paddingTop="10dip"
android:paddingBottom="10dip" />
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content" android:gravity="center"
android:src="#drawable/thank" android:paddingTop="10dip"
android:paddingBottom="10dip"/>
<com.teleca.sam.ui.Copyright
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:gravity="bottom|center"/>
</RelativeLayout>
</LinearLayout>
If you are using a LinearLayout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView"
android:layout_gravity="center_horizontal"
android:src="#drawable/ic_launcher" />
</LinearLayout>
If you are using a RelativeLayout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView"
android:src="#drawable/ic_launcher"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
because your ImageView is in a RelativeLayout, you should use
android:layout_centerInParent="true"
instead of
android:gravity="center"
in your ImageView tag
RelativeLayout may be the reason for this. Try Linear Layout instead.
I know I can use a LinearLayout to do this, but I have to use a RelativeLayout because I have another RelativeLayout that I need to anchor to the bottom of the overall layout, as sort of a "status" bar, and I want the title and text to be above the status bar, aligned to the top. Using a RelativeLayout was the only way I could get the status bar to work. The only problem is the title and text TextViews overlap each other and I need the text to be immediately below the title:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:paddingTop="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
>
<RelativeLayout
android:id="#+id/status"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:paddingTop="10dp"
>
<TextView
android:id="#+id/status"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
/>
</RelativeLayout>
<TextView
android:id="#+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#id/status"
android:layout_alignParentTop="true"
/>
<TextView
android:id="#+id/text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/title"
android:layout_alignParentTop="true"
/>
</RelativeLayout>
</FrameLayout>
You can use LinearLayout as a children of RelativeLayout.
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentTop="true">
<TextView
android:id="#+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<TextView
android:id="#+id/text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
XML layouts are rendered in the order they are "read" in. So you would want to do something like this:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:paddingTop="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
>
<TextView
android:id="#+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#id/status"
android:layout_alignParentTop="true"
/>
<TextView
android:id="#+id/text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/title"
android:layout_alignParentTop="true"
/>
<RelativeLayout
android:id="#+id/status"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:paddingTop="10dp"
>
<TextView
android:id="#+id/status"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
/>
</RelativeLayout>
</RelativeLayout>
</FrameLayout>
I'd also wrap the two textViews in a linearLayout like someone else had mentioned. This will help you a lot.
Hope that helps.
Remove the android:layout_alignParentTop="true" from your text TextView. That'll solve your problem!
I have an layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#FFFFFF">
<TextView android:id="#+id/groupname"
android:paddingLeft="50px"
android:textSize="16px"
android:background="#FFFFFF"
android:textColor="#000000"
android:textStyle="normal"
android:layout_width="wrap_content"
android:layout_height="50px"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_marginRight="6dp"
android:background="#ffffff"
android:src="#drawable/sort"/>
</LinearLayout>
Rendering is happening now like in first image but I wanted to render like in second image fully right aligned. any help would be useful.
Looking forward to your reply.
thanks.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#FFFFFF">
<TextView android:id="#+id/groupname"
android:paddingLeft="50dp"
android:textSize="16dp"
android:textColor="#000000"
android:textStyle="normal"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:layout_weight="0.9"
android:background="#color/black"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:background="#ffffff"
android:src="#drawable/checkin"
android:layout_weight="0.1"/>
</LinearLayout>
Try this, hope this will help.
use android:layout_weight="1" for text view
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#FFFFFF">
<TextView android:id="#+id/groupname"
android:paddingLeft="50px"
android:textSize="16px"
android:layout_weight="1"
android:background="#FFFFFF"
android:textColor="#000000"
android:textStyle="normal"
android:layout_width="0dp"
android:layout_height="50px"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_marginRight="6dp"
android:background="#ffffff"
android:src="#drawable/sort"/>
</LinearLayout>
Use RelativeLayout as a parent layout.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView android:id="#+id/groupname"
android:paddingLeft="50px"
android:textSize="16px"
android:textColor="#000000"
android:textStyle="normal"
android:layout_width="wrap_content"
android:layout_height="50px"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="6dp"
android:src="#drawable/ncc"/>
</RelativeLayout>
Try with RelativeLayout.
<?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"
android:background="#FFFFFF">
<TextView
android:id="#+id/groupname"
android:layout_width="wrap_content"
android:layout_height="50px"
android:background="#FFFFFF"
android:paddingLeft="50px"
android:textColor="#000000"
android:textSize="16px"
android:textStyle="normal" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:background="#ffffff"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<TextView android:id="#+id/groupname"
android:paddingLeft="50px"
android:textSize="16px"
android:background="#FFFFFF"
android:textColor="#000000"
android:textStyle="normal"
android:layout_width="wrap_content"
android:layout_height="50px"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_marginRight="6dp"
android:background="#ffffff"
android:layout_alignParentRight="true"
android:src="#drawable/sort"/>
In your ImageView you should add android:scaleType="fitEnd"
Either use RelativeLayout and set property of TextView as follows:
layout_width=fill_parent
layout_height=wrap_content
left_of="#+id/imgView"
and to ImageView
layout_width=wrap_content
layout_height=wrap_content
alignparentright=true
you should add such thing in xml... to the object you want align right...
android:layout_alignParentRight="true"
android:layout_marginRight="..dp"
You can use drawableRight attribut to take it very simple like this example:
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="50px"
android:textSize="16sp"
android:textStyle="normal"
android:drawableRight="#drawable/ic_favorite_gray"/>
In my app i have a custom dialog whose layout is like the following:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical"
android:scrollbars = "vertical"
android:scrollbarAlwaysDrawVerticalTrack = "true"
android:padding="10dp" >
<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="wrap_content" android:layout_height="wrap_content" android:text="blablabla...."/>
<ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="10dp" android:src="#drawable/book1"/>
</LinearLayout>
<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="wrap_content" android:layout_height="wrap_content" android:text="blablablablablablablablabla..."/>
<ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="10dp" android:src="#drawable/book2"/>
</LinearLayout>
</LinearLayout>
</ScrollView>
That is, i show a list of two horizontally placed widgets: a TextView showing some text and an, adjacent to the text, an ImageView widget showing an image.
What i would like to do is to show the ImageView widgets in such a way that they are aligned, that is, the image 1 start at the same column of image 2.
How can i do that?
Thx!
I'm not exactly sure what you are hoping for, but I would do the following:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="10dp"
android:scrollbarAlwaysDrawVerticalTrack="true"
android:scrollbars="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="blablabla...." />
<ImageView
android:id="#+id/image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_alignParentRight="true"
android:src="#drawable/book1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/image1"
android:text="blablablablablablablablabla..." />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_below="#+id/image1"
android:layout_alignParentRight="true"
android:src="#drawable/book2" />
</RelativeLayout>
</ScrollView>
I changed it to a relative layout and used some attributes such as android:layout_below
and android:layout_alignParentRight="true to get these changes. I hope this helps.