Develop Reference

Android how to design the xml about the UI

I need to design the xml about below layout.
I try to use RelativeLayout to design, but I don't know
how to adjust the imageVivew3 in RelativeLayout.
Have anyone can teach me how to adjust the xml?
or have you nice xml design about this layout?
thank you very much.
my xml is below:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relative_bg"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView1"
android:layout_centerHorizontal="true"
android:visibility="visible"
android:layout_margin="0dp"/>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView2"
android:visibility="visible"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"/>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView3"
android:visibility="visible"
android:layout_centerVertical="true"
android:layout_below="#+id/imageView3"
android:layout_alignParentRight="true"
/>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView4"
android:layout_alignTop="#+id/textView1"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentBottom="true"/>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="txt1"
android:id="#+id/textView1"
android:textColor="#color/white"
android:textSize="#dimen/common_size_large"
android:layout_below="#+id/imageView3"
android:layout_alignParentRight="true"/>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="txt2"
android:id="#+id/textView2"
android:textColor="#color/white"
android:layout_below="#+id/textView1"
android:layout_alignParentRight="true"
/>
</RelativeLayout>

Try to LinearLayout instead of RelativeLayout..
And also use android:layout_weight atttribute ...code sample are given below... put this
code to your xml.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#android:color/white"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight=".75"
android:layout_marginTop="5dp"
>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight="2"
android:layout_gravity="center"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/gerder"
android:textSize="12sp"
android:textStyle="bold"
android:contentDescription="#string/app_name"
android:layout_gravity="center"
android:paddingLeft="10dp"
android:gravity="center"
android:textColor="#android:color/black"
android:fontFamily="#string/providerFontFamily"
/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1">
<RadioGroup
android:id="#+id/radioGender"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
android:layout_marginLeft="5dp"
>
<RadioButton
android:id="#+id/radioMale"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/providerGenderMale"
android:checked="true" />
<RadioButton
android:id="#+id/radioFemale"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/providerGenderFemale" />
</RadioGroup>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight="2"
android:layout_gravity="center"
>
<TextView
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#string/providerFontFamily"
android:text="#string/age_range"
android:gravity="left"
android:textSize="12sp"
android:textStyle="bold"
android:textColor="#android:color/black"
android:layout_gravity="center"
/>
<Spinner
android:id="#+id/spinner1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:layout_marginRight="15dp"
android:prompt="#string/country_prompt"
/>
</LinearLayout>
</LinearLayout>
</LinearLayout>

how to set vertically scrolling ScrollView withinanother vertically scrolling widget (ListView)

I am having trouble with a scrolling ListView inside a ScrollView.I have tried the code given bellow.
<?xml version="1.0" encoding="utf-8"?> <LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linlaypromodet"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/linearlayoutheaderpromo"
android:layout_width="fill_parent"
android:layout_height="80dp"
android:orientation="horizontal"
android:gravity="center_vertical"
android:background="#drawable/dairam_header2">
<Button
android:id="#+id/buttonbackhomepromodet"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/back_arrow"
android:layout_marginLeft="3dp"/>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="80dp">
<TextView
android:id="#+id/textviewheaderpromodete"
android:layout_width="wrap_content"
android:layout_height="80dp"
android:textColor="#fff"
android:layout_marginLeft="4dp"
android:gravity="center"
android:textAppearance="?android:attr/textAppearanceLarge" />
<Button
android:id="#+id/buttonsharepromodet"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginTop="30dp"
android:layout_marginRight="10dp"
android:background="#drawable/shareicon" />
</RelativeLayout>
</LinearLayout> <ScrollView
android:id="#+id/scrollView1"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_alignParentLeft="true"
android:layout_below="#+id/buttoncartpromodet"
android:layout_weight="2"
android:layout_marginTop="5dp" > <LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:maxHeight="100dp" >
<com.dairam.viewpager.AutoScrollViewPager
android:id="#+id/imageView1"
android:layout_width="fill_parent"
android:layout_height="200dp"
android:layout_alignParentLeft="true"
android:minHeight="100dp"
android:layout_alignParentTop="true"/>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imageView1"
android:layout_alignParentLeft="true"
android:layout_marginBottom="75dp" >
<Button
android:id="#+id/buttonleftarrow"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_alignParentLeft="true"
android:background="#drawable/arrow_leftgray" />
<Button
android:id="#+id/buttonrightarrow"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="5dp"
android:background="#drawable/arrow_rightgray" />
</RelativeLayout>
</RelativeLayout>
<LinearLayout
android:id="#+id/rellay"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<RelativeLayout android:id="#+id/toplay"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical">
<Button android:id="#+id/viewbtn"
android:layout_width="fill_parent"
android:layout_height="2dp"
android:layout_marginTop="5dp"
android:background="#drawable/dividergray"/>
<Button
android:id="#+id/buttoncartpromodet"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_centerHorizontal="true"
android:layout_marginRight="5dp"
android:background="#drawable/redicon"/>
<Button
android:id="#+id/buttonwishlistpromodet"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginRight="8dp"
android:layout_toLeftOf="#+id/buttoncartpromodet"
android:background="#drawable/greenicon" />
<TextView
android:id="#+id/textView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/buttonwishlistpromodet"
android:layout_alignBottom="#+id/buttonwishlistpromodet"
android:layout_alignParentLeft="true"
android:layout_marginLeft="5dp"
android:textColor="#000"/>
<ScrollView
android:id="#+id/scrollViewdesc"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_alignParentLeft="true"
android:layout_weight="1"
android:layout_marginTop="5dp" > <ListView
android:id="#+id/textViewdescription"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/textView1"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp"
android:layout_marginBottom="10dp"
>
</ListView> </ScrollView>
<Button android:id="#+id/dividerbtm"
android:layout_height="2dp"
android:layout_width="fill_parent"
android:background="#drawable/dividergray"
android:layout_alignBottom="#+id/textViewdescription"
android:layout_marginTop="5dp"/>
</RelativeLayout>
<TextView
android:id="#+id/textviewsuggestion"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="YOU MAY ALSO LIKE"
android:textColor="#000"
android:textSize="20sp" />
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_marginTop="10dp"
android:background="#fff" >
</android.support.v4.view.ViewPager>
</LinearLayout>
</LinearLayout>
</ScrollView>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="60dp"
android:layout_marginTop="5dp"
android:orientation="vertical" >
<View android:layout_height="1dp"
android:layout_width="fill_parent"
android:background="#drawable/dividergray"
android:layout_marginTop="6dp"/>
<Button
android:id="#+id/buttonamntpromodet"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginRight="8dp"
android:textColor="#fff"
android:background="#drawable/redbox" />
<Spinner
android:id="#+id/buttonquantitypromodet"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:textColor="#fff"
android:spinnerMode="dropdown"
android:gravity="center"
android:paddingLeft="10dp"
android:layout_alignParentRight="true"
android:background="#drawable/greybox2" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/buttonquantitypromodet"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginTop="3dp"
android:text=" Quantity"
android:gravity="center"
android:textColor="#fff"
android:textAppearance="?android:attr/textAppearanceSmall" />
</RelativeLayout>
</LinearLayout>

What you're doing wrong (to my knowledge) is putting the listView inside a ScrollView. ListView by itself is inherantly scrollable, so the scrollview is not necessary.
I've had issues myself in the past where it causes neither to scroll.... perhaps that is your issue.
Also, I don't know if its just how you posted the code but you shouldn't start a layout with a button.... i believe it needs to be set inside a layout tag.

Please Remove Scroll View from above Listview Because Listvie itself scrollable.

i am unable to lock some part of the screen while using "Scroll View"

i am implementing one data enter screen with many fields.so that i am using scrolling view in my layout.But i want to draw OK button always.but i am unable to lock the some part of the screen.
i need secreen as:
but i am getting picture as either
or
i am adding my layout code below(as shown in last pic) plesae help me .
<?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:orientation="vertical" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:background="#2E9AFE" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="Present Details"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColorHint="#350924"
android:textStyle="bold" />
<TextView
android:id="#+id/tvtv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Present Location"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#350924"
android:textStyle="bold" />
<ProgressBar
android:id="#+id/progressBar1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" />
<EditText
android:id="#+id/etPreLoc1"
android:layout_width="fill_parent"
android:layout_height="120dp"
android:layout_gravity="center"
android:ems="10"
android:hint="Where are u now?"
android:inputType="textPostalAddress" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/etPreLoc1"
android:layout_gravity="center"
android:text="Coming By"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#350924"
android:textStyle="bold" />
<EditText
android:id="#+id/mmsComing"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:ems="10"
android:hint="car/auto/other" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Vehicle details"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#350924"
android:textStyle="bold" />
<EditText
android:id="#+id/etDriver"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:ems="10"
android:hint="Driver name/vehicle no"
android:inputType="textPersonName" />
<TextView
android:id="#+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:text="Expected time to reach by:"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#350924"
android:textStyle="bold" />
<TimePicker
android:id="#+id/timePicker2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:layout_weight="75" />
</LinearLayout>
</ScrollView>
<Button
android:id="#+id/mmsOk"
android:layout_width="fill_parent"
android:layout_height="64dp"
android:layout_gravity="center"
android:layout_marginBottom="10dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="10dp"
android:layout_weight="25"
android:background="#drawable/blackbutton"
android:text="OK"
android:textColor="#android:color/white"
android:textSize="32dp"
android:textStyle="bold" />
</LinearLayout>

You can do that with a RelativeLayout like that. Just put all you views in the linearlayout inside the scrollview.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
</LinearLayout>
</ScrollView>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true" >
<Button
android:id="#+id/button1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
</RelativeLayout>

Change scrollview height to 0dp and give weight as 1.
Change button layout gravity to bottom instead of center.

Android Custom dialog inflating from layout - alignment issue

I have an custom dialog, whick i am inflating from dialog.xml. when I open the dialog it looks something like shown below. I am getting some space between listview and the (OK) button below it. I want to eliminate this space between the list view and the Button below it.
How can i do this,?
dialog.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="wrap_content"
android:layout_height="fill_parent" >
<ListView
android:id="#+id/listViewDialog"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/button1"
android:layout_below="#+id/ImageView1" >
</ListView>
<CheckBox
android:id="#+id/checkBoxAll"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/listView1"
android:layout_alignParentRight="true"
android:layout_marginBottom="15dp"
android:layout_marginRight="25dp"
android:layout_marginTop="15dp"
android:text="" />
<ImageView
android:id="#+id/ImageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginBottom="15dp"
android:layout_marginLeft="14dp"
android:layout_marginTop="15dp"
android:background="#FFFFBB33"
android:contentDescription="#string/app_name"
android:scaleType="center"
android:src="#drawable/alert_dialog_icon" />
<TextView
android:id="#+id/textView1"
android:layout_width="128dp"
android:layout_height="match_parent"
android:layout_above="#+id/listViewDialog"
android:layout_marginBottom="15dp"
android:layout_marginTop="15dp"
android:layout_toRightOf="#+id/ImageView1"
android:gravity="center_vertical"
android:text="Categories"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/textView1"
android:layout_alignBottom="#+id/textView1"
android:layout_toLeftOf="#+id/checkBoxAll"
android:text="All"
android:textAppearance="?android:attr/textAppearanceLarge" />
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="OK" />
</RelativeLayout>

this is really easy..
you have 2 approchase:
1) create the root realtivelayout to have android:layout_height="wrap_cotent", and in the same time the ListView to have the same. this will shrink the sizes of the all dialog to the right (no space) size.
2) *more recomended , have the root to be a Linearlayout and give it some wightsum, then put the other views in this root, and give them some layout_wight, this way you know the in any screen resolution you have the same porportion of your screen.

maybe try like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:weightSum="100" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="15" >
<CheckBox
android:id="#+id/checkBoxAll"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/listView1"
android:layout_alignParentRight="true"
android:layout_marginBottom="15dp"
android:layout_marginRight="25dp"
android:layout_marginTop="15dp" />
<ImageView
android:id="#+id/ImageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginBottom="15dp"
android:layout_marginLeft="14dp"
android:layout_marginTop="15dp"
android:background="#FFFFBB33"
android:contentDescription="#string/app_name"
android:scaleType="center" />
<TextView
android:id="#+id/textView1"
android:layout_width="128dp"
android:layout_height="match_parent"
android:layout_above="#+id/listViewDialog"
android:layout_marginBottom="15dp"
android:layout_marginTop="15dp"
android:layout_toRightOf="#+id/ImageView1"
android:gravity="center_vertical"
android:text="Categories"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/textView1"
android:layout_alignBottom="#+id/textView1"
android:layout_toLeftOf="#+id/checkBoxAll"
android:text="All"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
<ListView
android:id="#+id/listViewDialog"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="70" >
</ListView>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="15" >
<Button
android:id="#+id/button1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="OK" />
</LinearLayout>
</LinearLayout>
</LinearLayout>

android layout design looking good only in graphical layout not in devices

i tried designing an xml layout for my android app. It looks good in eclipse graphical layout of android api level 10. But when i run the same in my android device of 2.3.3(api level 10),
that layout looks completely different.
After the text title in the top everything gets changed
I have attached the screen shot of my graphical layout in eclipse and image from my android device
Following is my xml file
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/frame2_include"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#drawable/bg">
<LinearLayout
android:id="#+id/title_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="top">
<include
android:id="#+id/title_include"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
layout="#layout/title" />
</LinearLayout>
<RelativeLayout
android:id="#+id/r_title_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/title_bg">
<TextView
android:id="#+id/normal_title_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="#string/app"
android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/r_frame_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/r_title_layout">
<ViewSwitcher
android:id="#+id/r_frame_viewSwitcher1"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/r_frame_image_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="7dp"
android:background="#color/white"
android:layout_gravity="center_vertical">
<RelativeLayout
android:id="#+id/r_round_points"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/points_bg" >
<LinearLayout
android:id="#+id/r_center_frame_img_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true">
<TextView
android:id="#+id/r_frame_img_txt1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="30dp"
android:text="50"
android:textColor="#000000"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/r_frame_img_txt2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/Points"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#000000" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/r_frame_map_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<include
android:id="#+id/parii_me_map_view2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
layout="#layout/parii_map" />
</LinearLayout>
</ViewSwitcher>
<RelativeLayout
android:id="#+id/r_merge_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="105dp"
android:background="#android:color/transparent">
<ImageView
android:contentDescription="#string/app_name"
android:id="#+id/merge_bg_img"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/title_bg"
android:layout_centerInParent="true"/>
<RelativeLayout
android:id="#+id/merge_view_pro_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/merge_center_img"
android:layout_centerVertical="true">
<TextView
android:id="#+id/merge_view_pro_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/mrg_profile"
android:layout_centerInParent="true"
android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>
<ImageView
android:contentDescription="#string/app_name"
android:id="#+id/merge_center_img"
android:layout_width="73dp"
android:layout_height="73dp"
android:layout_centerInParent="true"
android:background="#drawable/ic_launcher" />
<RelativeLayout
android:id="#+id/merge_view_cash_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/merge_center_img"
android:layout_centerVertical="true">
<TextView
android:id="#+id/merge_view_cash_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="#string/mrg_cash"
android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/r_edit_box_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="185dp">
<TextView
android:id="#+id/r_remaining_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginLeft="7dp"
android:layout_marginRight="3dp"
android:gravity="center|center_horizontal"
android:text="200"
android:textColor="#color/black"
android:background="#drawable/ponts_field"
android:textAppearance="?android:attr/textAppearanceSmall" />
<TextView
android:id="#+id/r_remaining_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/r_remaining_label"
android:text="#string/Reamins"
android:layout_centerVertical="true"
android:textColor="#color/black"
android:textAppearance="?android:attr/textAppearanceSmall" />
<TextView
android:id="#+id/r_points_txt"
android:layout_toLeftOf="#+id/r_points_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/Parii_Pts"
android:layout_centerVertical="true"
android:gravity="center"
android:textColor="#color/black"
android:textAppearance="?android:attr/textAppearanceSmall" />
<TextView
android:id="#+id/r_points_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="7dp"
android:layout_marginLeft="3dp"
android:text="100"
android:gravity="center|center_horizontal"
android:textColor="#color/black"
android:background="#drawable/ponts_field"
android:textAppearance="?android:attr/textAppearanceSmall" />
</RelativeLayout>
</RelativeLayout>
<TextView
android:id="#+id/r_items_viewed_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_marginTop="10dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_below="#+id/r_frame_layout"
android:maxLines="2"
android:textColor="#color/black"
android:textAppearance="?android:attr/textAppearanceSmall" />
<RelativeLayout
android:id="#+id/r_bottom_map_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/r_items_viewed_txt"
android:layout_marginTop="20dp">
<TextView
android:id="#+id/r_valid_date"
android:layout_toLeftOf="#+id/r_points_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:textColor="#color/black"
android:textAppearance="?android:attr/textAppearanceSmall" />
<ImageButton
android:contentDescription="#string/app_name"
android:id="#+id/parii_me_details_switch_mapBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="15dp"
android:layout_centerVertical="true"
android:background="#drawable/map_sel_btn" />
</RelativeLayout>
</FrameLayout>
Pls say me where i am going wrong

try this:
only replace that by default image by your circle image having 50 pts inside.
<?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="#aba4a4">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/l1">
<Button
android:id="#+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Back btn"
android:textColor="#121212"
android:textSize="18dp" />
<TextView
android:id="#+id/txt"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Rewards"
android:textColor="#android:color/black"
android:textSize="18dp"
android:textStyle="bold"
android:layout_gravity="center_vertical"
android:layout_marginLeft="15dp"/>
</LinearLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/l2"
android:layout_below="#+id/l1"
android:background="#7d7373">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title"
android:textSize="18dp"
android:layout_centerHorizontal="true"
android:textColor="#android:color/white"/>
</RelativeLayout>
<ImageView
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_below="#+id/l2"
android:background="#drawable/ic_launcher"/>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/l3"
android:background="#7d7373"
android:layout_centerInParent="true">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Profile"
android:textSize="18dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:textColor="#android:color/white"
android:layout_marginLeft="20dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="View"
android:textSize="18dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:textColor="#android:color/white"
android:layout_marginRight="20dp"/>
</RelativeLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
android:layout_centerInParent="true"/>
</RelativeLayout>
Add the remaining view in it.i think this must solve your issue.