Develop Reference

Align Parent Bottom With Below RelativeLayout Android

Good day.I have an set of buttons which should be aligned to the bottom always,but they all also should be below an text,and it goes like this,if text is large,it is going just to push the buttons inside the scrollview,otherwise the buttons should be aligned to the parent bottom.Issue is that i add both of the tags to the linear layout wrapper of the buttons,but as soon as i set visibility of text to gone,the view just pops up and not aligning to parent bottom,here is the actual code,
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/single_product_scroll_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/single_product_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="35dp"
android:src="#drawable/img_placeholder" />
<RelativeLayout
android:id="#+id/basket_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/single_product_divider"
android:layout_alignEnd="#+id/single_product_divider"
android:layout_alignLeft="#+id/single_product_divider"
android:layout_alignParentTop="true"
android:layout_alignRight="#+id/single_product_divider"
android:layout_alignStart="#+id/single_product_divider"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:visibility="gone">
<ImageView
android:id="#+id/basket_success_icon"
android:layout_width="46dp"
android:layout_height="46dp"
android:layout_centerVertical="true"
android:layout_marginLeft="26dp"
android:src="#drawable/success_icon" />
<TextView
android:id="#+id/basket_product_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/basket_success_icon"
android:layout_marginLeft="16dp"
android:layout_marginTop="5dp"
android:layout_toRightOf="#+id/basket_success_icon"
android:text="#string/product_added_to_basket_text"
android:textColor="#ffffff"
android:textSize="16sp" />
</RelativeLayout>
<View
android:id="#+id/single_product_divider"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/single_product_image"
android:layout_margin="25dp"
android:background="#D1D3D4">
</View>
<TextView
android:id="#+id/single_product_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/single_product_divider"
android:layout_alignStart="#+id/single_product_divider"
android:layout_below="#+id/single_product_divider"
android:text="#string/loading_text"
android:textColor="#231F20" />
<TextView
android:id="#+id/single_product_weight_and_servings"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/single_product_divider"
android:layout_alignStart="#+id/single_product_divider"
android:layout_below="#+id/single_product_name"
android:layout_marginTop="5dp"
android:text="#string/weight_and_servings_text"
android:textColor="#231F20" />
<TextView
android:id="#+id/single_product_price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/single_product_weight_and_servings"
android:layout_alignStart="#+id/single_product_weight_and_servings"
android:layout_below="#+id/single_product_weight_and_servings"
android:layout_marginTop="15dp"
android:text="$12.09"
android:textColor="#009444"
android:textSize="17sp"
android:textStyle="bold" />
<RatingBar
android:id="#+id/single_product_rating"
style="#style/Base.Widget.AppCompat.RatingBar.Small"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/single_product_price"
android:layout_alignStart="#+id/single_product_price"
android:layout_below="#+id/single_product_price"
android:layout_marginTop="5dp"
android:numStars="5" />
<TextView
android:id="#+id/single_product_rating_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/single_product_rating"
android:layout_marginLeft="5dp"
android:layout_toRightOf="#+id/single_product_rating"
android:text="10.0/10"
android:textColor="#231F20"
android:textSize="12sp" />
<TextView
android:id="#+id/single_product_review_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/single_product_rating_text"
android:layout_marginLeft="5dp"
android:layout_toRightOf="#+id/single_product_rating_text"
android:text="8 reviews"
android:textColor="#EC2027"
android:textSize="12sp" />
<TextView
android:id="#+id/single_product_stock_status"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignTop="#+id/single_product_review_count"
android:layout_marginRight="10dp"
android:text="In stock"
android:textColor="#939598" />
<View
android:id="#+id/single_product_center_divider"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_below="#+id/single_product_rating"
android:layout_centerHorizontal="true"></View>
<Spinner
android:id="#+id/single_product_weight_spinner"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentLeft="true"
android:layout_below="#+id/single_product_rating"
android:layout_marginLeft="10dp"
android:layout_marginRight="2dp"
android:layout_marginTop="10dp"
android:layout_toLeftOf="#+id/single_product_center_divider"
android:background="#drawable/spinner_background"
android:spinnerMode="dropdown"></Spinner>
<Spinner
android:id="#+id/single_product_type_spinner"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentRight="true"
android:layout_below="#+id/single_product_rating"
android:layout_marginLeft="2dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:layout_toRightOf="#+id/single_product_center_divider"
android:background="#drawable/spinner_background"
android:spinnerMode="dropdown"></Spinner>
<TextView
android:id="#+id/single_product_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/single_product_type_spinner"
android:layout_margin="16dp"
android:text="This is simply the best tripod for the money you\'ll ever buy,it\'s rock solid and the head alone is worth more then the asking price"
android:textColor="#231F20" />
<RelativeLayout
android:id="#+id/single_product_buttons_wrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_below="#+id/single_product_description"
android:orientation="vertical">
<Button
android:id="#+id/single_product_add_to_cart_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:background="#F26522"
android:text="#string/add_to_cart_text"
android:textAllCaps="false"
android:textColor="#ffffff" />
<Button
android:id="#+id/single_product_info_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/single_product_add_to_cart_button"
android:layout_marginLeft="6dp"
android:layout_marginRight="5dp"
android:layout_marginTop="8dp"
android:background="#E7E8E9"
android:drawableRight="#drawable/ic_arrow_down"
android:paddingRight="10dp"
android:text="#string/product_info_text"
android:textAllCaps="false"
android:textColor="#231F20" />
<Button
android:id="#+id/single_product_nutritional_info_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/single_product_info_button"
android:layout_marginLeft="6dp"
android:layout_marginRight="5dp"
android:layout_marginTop="8dp"
android:background="#E7E8E9"
android:drawableRight="#drawable/ic_arrow_down"
android:paddingRight="10dp"
android:text="#string/product_nutritional_text"
android:textAllCaps="false"
android:textColor="#231F20" />
<Button
android:id="#+id/single_product_reviews_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/single_product_nutritional_info_button"
android:layout_marginBottom="5dp"
android:layout_marginLeft="6dp"
android:layout_marginRight="5dp"
android:layout_marginTop="8dp"
android:background="#E7E8E9"
android:drawableRight="#drawable/ic_arrow_down"
android:paddingRight="10dp"
android:text="#string/product_reviews_text"
android:textAllCaps="false"
android:textColor="#231F20" />
</RelativeLayout>
</RelativeLayout>
</ScrollView>
Can anyone please give any suggestion?
Edit : The full code of the view,actual buttons are inside RelativeLayout at the bottom of xml files there are 4 of buttons.The wrapper is single_product_buttons_wrapper

Add android:gravity="bottom" to LinearLayout containing buttons. It will work have tested it.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_below="#+id/single_product_description"
android:gravity="bottom"
android:orientation="vertical">

Try this:
<?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"
android:focusable="true"
android:focusableInTouchMode="true">
<TextView
android:id="#+id/single_product_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:text="This is simply the best tripod for the money you\'ll ever buy,it\'s rock solid and the head alone is worth more then the asking price"
android:textColor="#231F20" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical">
<Button
android:id="#+id/single_product_add_to_cart_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/single_product_info_button"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:background="#F26522"
android:text="123"
android:textAllCaps="false"
android:textColor="#ffffff" />
<Button
android:id="#+id/single_product_info_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/single_product_nutritional_info_button"
android:layout_marginLeft="6dp"
android:layout_marginRight="5dp"
android:layout_marginTop="8dp"
android:background="#E7E8E9"
android:paddingRight="10dp"
android:text="234"
android:textAllCaps="false"
android:textColor="#231F20" />
<Button
android:id="#+id/single_product_nutritional_info_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/single_product_reviews_button"
android:layout_marginLeft="6dp"
android:layout_marginRight="5dp"
android:layout_marginTop="8dp"
android:background="#E7E8E9"
android:paddingRight="10dp"
android:text="5555"
android:textAllCaps="false"
android:textColor="#231F20" />
<Button
android:id="#+id/single_product_reviews_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="5dp"
android:layout_marginLeft="6dp"
android:layout_marginRight="5dp"
android:layout_marginTop="8dp"
android:background="#E7E8E9"
android:paddingRight="10dp"
android:text="99999"
android:textAllCaps="false"
android:textColor="#231F20" />
</LinearLayout>
</RelativeLayout>

Properly align images and text in relative layout?

I've a shop layout in which are three different sized images. To the right of them, there is text representing price. How can I align images and text under each other ? And put the middle of the screen between Image and text. Here is my layout:
<?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" android:background="#drawable/podklad">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/lives"
android:focusable="false" android:background="#drawable/heart_image"
android:layout_below="#+id/money" android:layout_centerHorizontal="true"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price1"
android:textSize="30sp" android:textColor="#ff000000"
android:layout_alignTop="#+id/lives" android:layout_toRightOf="#+id/lives"
android:layout_toEndOf="#+id/lives"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/money" android:layout_alignParentTop="true" android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" android:textSize="40dp" android:textColor="#ff000000"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/monstertoprightcolored"
android:id="#+id/hardmode"
android:layout_centerVertical="true" android:layout_centerHorizontal="true"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price2"
android:textSize="30dp"
android:textColor="#ff000000"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/hardmode"
android:layout_toEndOf="#+id/hardmode"
android:layout_above="#+id/price3"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/monsterbottomleftcolored"
android:id="#+id/reversedmode"
android:layout_alignParentBottom="true" android:layout_alignLeft="#+id/hardmode"
android:layout_alignStart="#+id/hardmode"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price3"
android:textSize="30dp"
android:textColor="#ff000000"
android:layout_marginTop="26dp"
android:layout_below="#+id/hardmode"
android:layout_toRightOf="#+id/price2"
android:layout_toEndOf="#+id/price2"/>

A TableLayout might work better in this case. Here's a start to what your layout would look like:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout 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:stretchColumns="*">
<TableRow>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_span="2"
android:layout_gravity="right"
android:id="#+id/money"
android:textSize="40dp"
android:textColor="#ff000000"
tools:text="money" />
</TableRow>
<TableRow>
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/lives"
android:focusable="false"
android:background="#drawable/heart_image"
/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price1"
android:textSize="30sp"
android:textColor="#ff000000"
tools:text="price1" />
</TableRow>
<TableRow>
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/monstertoprightcolored"
android:id="#+id/hardmode" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price2"
android:textSize="30dp"
android:textColor="#ff000000"
tools:text="price2" />
</TableRow>
<TableRow>
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/monsterbottomleftcolored"
android:id="#+id/reversedmode" />
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price3"
android:textSize="30dp"
android:textColor="#ff000000"
android:layout_marginTop="26dp"
tools:text="price3" />
</TableRow>
</TableLayout>
Note that in order to "put the middle of the screen between Image and text", the two columns have to be equal in width. This is done by setting android:stretchColumns="*" in the TableLayout, and setting android:layout_width="0dp" and android:layout_weight="1" in the children of the TableRows.
See tablelayout - Set equal width of columns in table layout in Android for more info.

You can use linear layouts for this. Image and text can be split vertically in a linear layout. Each of this linear layout can be placed horizontally. Can you add a screenshot of how your layout should look for better understanding.

Here try this ,hope to help you, and i hope that i understand your problem correctly.
<?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"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:background="#drawable/ic_launcher">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/lives"
android:focusable="false"
android:background="#drawable/ic_launcher"
android:layout_below="#+id/money"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price1"
android:textSize="30sp"
android:text="Text"
android:textColor="#ff000000"
android:layout_alignTop="#+id/lives"
android:layout_toRightOf="#+id/lives"
android:layout_toEndOf="#+id/lives" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/money"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textSize="40dp"
android:text="Text"
android:textColor="#ff000000" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
android:id="#+id/hardmode"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price2"
android:textSize="30dp"
android:textColor="#ff000000"
android:text="Text"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/hardmode"
android:layout_toEndOf="#+id/hardmode"
android:layout_above="#+id/price3" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
android:id="#+id/reversedmode"
android:layout_alignParentBottom="true"
android:layout_alignLeft="#+id/hardmode"
android:layout_alignStart="#+id/hardmode" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price3"
android:textSize="30dp"
android:textColor="#ff000000"
android:layout_marginTop="26dp"
android:layout_below="#+id/hardmode"
android:text="Text"
android:layout_toRightOf="#+id/price2"
android:layout_toEndOf="#+id/price2" />
</LinearLayout>

how to put tabs inside header of the listview?

I have a listView with an header which contain imageview, bunch of textviews . But now i want to put two tabs at the bottom of that header to change the content of the listview with those two tabs, I am using Sherlockfragments in my app and the whole listview and its header are in one of my fragment .
This is my header of the listview , right now i am using two buttons instead of tabs but i want to replace them with tabs
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="250dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#drawable/purple_bg"
android:orientation="vertical" >
<ImageView
android:id="#+id/userimage_profile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="16dp"
android:src="#drawable/loader" />
<TextView
android:id="#+id/fullname_profile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/userimage_profile"
android:layout_centerHorizontal="true"
android:layout_marginTop="5dp"
android:text="ladygaga"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textSize="15sp" />
<TextView
android:id="#+id/twittername_profile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/fullname_profile"
android:layout_centerHorizontal="true"
android:text="ladygaga"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textSize="10sp" />
<TextView
android:id="#+id/profile_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/twittername_profile"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="8dp"
android:gravity="center"
android:maxLines="2"
android:text="By modifying the URL, dsfhieor fergieirgh erjogw54ijg you can retrieve other variant sizings such as ""
android:textAppearance="?android:attr/textAppearanceSmall"
android:textSize="13sp" />
<ImageButton
android:id="#+id/find_people"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/profile_text"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:background="#null"
android:onClick="onClick"
android:src="#drawable/find_people" />
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:orientation="horizontal" >
<TextView
android:id="#+id/chance_selected"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="0dp"
android:layout_weight="1"
android:background="#drawable/chances_selected"
android:gravity="center"
android:scaleType="centerCrop"
android:text="Chances(100)"
android:textSize="15sp" />
<TextView
android:id="#+id/fav_unselect"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/fav_unselected"
android:gravity="center"
android:scaleType="centerCrop"
android:text="Favourites"
android:textSize="15sp" />
</LinearLayout>
<TextView
android:id="#+id/follow_profile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/find_people"
android:layout_marginRight="10dp"
android:layout_toRightOf="#+id/userimage_profile"
android:background="#drawable/follow_reqchance"
android:gravity="center"
android:text="Follow"
android:textColor="#ffffff" />
<TextView
android:id="#+id/req_chance_profile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/find_people"
android:layout_marginLeft="10dp"
android:layout_toLeftOf="#+id/userimage_profile"
android:background="#drawable/follow_reqchance"
android:gravity="center"
android:text="Request Chance"
android:textColor="#ffffff" />
</RelativeLayout>

Create a listview with sides like older email android app

I want to create a listview like older gmail app. See the screenshot:
I tried putting an empty view like this:
<TextView
android:id="#+id/color_highlight"
android:layout_width="5dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#ff0000"
android:minHeight="48dp" />
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginRight="20dp"
android:layout_marginTop="10dp"
android:layout_toLeftOf="#id/color_highlight"
android:text="Mudit Agarwal"
android:textStyle="bold"
android:textColor="#242424"
android:textIsSelectable="false"
android:textSize="22sp" />
<TextView
android:id="#+id/number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#id/name"
android:layout_below="#id/name"
android:text="9933445566"
android:textColor="#777777"
android:textIsSelectable="false"
android:layout_marginBottom="10dp"
android:textSize="15sp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:padding="3dp"
android:src="#drawable/contact" />
but this is not taking full height of the view. Please suggest.

What I changed is
android:layout_alignBottom="#+id/number"
to your color_highlight TextView. and instead of margin, I put padding like below in number TextView.
android:paddingBottom="20dp"
just put following layout 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="wrap_content" >
<TextView
android:id="#+id/color_highlight"
android:layout_width="5dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_alignBottom="#+id/number"
android:background="#ff0000"
android:minHeight="48dp" />
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginRight="20dp"
android:layout_marginTop="10dp"
android:layout_toLeftOf="#id/color_highlight"
android:text="Mudit Agarwal"
android:textColor="#242424"
android:textIsSelectable="false"
android:textSize="22sp"
android:textStyle="bold" />
<TextView
android:id="#+id/number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#id/name"
android:layout_below="#id/name"
android:paddingBottom="20dp"
android:text="9933445566"
android:textColor="#777777"
android:textIsSelectable="false"
android:textSize="15sp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:padding="3dp"
android:src="#drawable/contact" />
</RelativeLayout>

I'm not sure but you can try putting android:layout_height="0dip" instead of android:layout_height="match_parent".

I can't get the button to the bottom of the layout

I'm trying to get the button to the bottom the layout, and it just won't work...
The button is displaying it self on the image that should be above it.
Here is the xml code:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ScrollView01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true"
android:layout_gravity="center"
>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
>
<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_marginLeft="28dp"
android:layout_marginTop="32dp" />
<TextView
android:id="#+id/txtAppName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/imageView1"
android:layout_marginLeft="22dp"
android:layout_toRightOf="#+id/imageView1"
android:text=""
android:textSize="36px"
android:textStyle="bold" />
<TextView
android:id="#+id/txtAppAuthor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/txtAppName"
android:layout_below="#+id/txtAppName"
android:layout_marginTop="5px"
android:text=""
android:textSize="24px"
android:textStyle="normal" />
<TextView
android:id="#+id/txtAppDesc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/imageView1"
android:layout_below="#+id/imageView1"
android:layout_marginTop="20dp"
android:maxHeight="350px"
android:text=""
android:width="600px"
android:maxLines="10"
android:scrollbars = "vertical"
/>
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/txtAppDesc"
android:layout_below="#+id/txtAppDesc"
android:layout_marginTop="30dp" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/imageView2"
android:layout_toRightOf="#+id/imageView2" />
<ImageView
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/imageView3"
android:layout_toRightOf="#+id/imageView3"
android:visibility="visible" />
<Button
android:id="#+id/btnInstall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_alignBottom="#+id/imageview4"
android:text="Download & Install" />
</RelativeLayout>
</ScrollView>
And the result is:
Thanx upfront.

You used android:layout_alignBottom="#+id/imageview4"
This means you align the bottom of your button with the bottom of your image.
You have to use android:layout_below="#+id/imageview4"
EDIT: I don't say this is the best solution, because of multiple layouts (for optimisation...) but this should work:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ScrollView01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true"
android:layout_gravity="center"
>
<LinearLayout android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
>
<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_marginLeft="28dp"
android:layout_marginTop="32dp"/>
<TextView
android:id="#+id/txtAppName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/imageView1"
android:layout_marginLeft="22dp"
android:layout_toRightOf="#+id/imageView1"
android:text=""
android:textSize="36px"
android:textStyle="bold"/>
<TextView
android:id="#+id/txtAppAuthor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/txtAppName"
android:layout_below="#+id/txtAppName"
android:layout_marginTop="5px"
android:text=""
android:textSize="24px"
android:textStyle="normal"/>
<TextView
android:id="#+id/txtAppDesc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/imageView1"
android:layout_below="#+id/imageView1"
android:layout_marginTop="20dp"
android:maxHeight="350px"
android:text=""
android:width="600px"
android:maxLines="10"
android:scrollbars="vertical"
/>
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/txtAppDesc"
android:layout_below="#+id/txtAppDesc"
android:layout_marginTop="30dp"/>
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/imageView2"
android:layout_toRightOf="#+id/imageView2"/>
<ImageView
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/imageView3"
android:layout_toRightOf="#+id/imageView3"
android:visibility="visible"/>
</RelativeLayout>
<Button
android:id="#+id/btnInstall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Download & Install"/>
</LinearLayout>
</ScrollView>
I added a linear layout in which I put the content, and the button.
Hope this will work.

Do you just want the image that the button is over to shrink in order to make room for it? If so, you need to put the Imageview that contains that image as the very last item in your relative layout. It's going to allocate space for everything but the image, and then give the remaining space to the image, which is why it needs to be last.
Also, I suggest giving your imageViews more informative names than "imageView#", since it's kind of difficult to tell which is which.

You might want to wrap you images in a HorizontalScrollView to maintain full height and width of all your images. I changed a lot of the ViewGroups' widths and heights to accommodate the HorizontalScrollView, finally I set the Button below the images:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ScrollView01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:fillViewport="true" >
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center" >
<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_marginLeft="28dp"
android:layout_marginTop="32dp" />
<TextView
android:id="#+id/txtAppName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/imageView1"
android:layout_marginLeft="22dp"
android:layout_toRightOf="#+id/imageView1"
android:text=""
android:textSize="36px"
android:textStyle="bold" />
<TextView
android:id="#+id/txtAppAuthor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/txtAppName"
android:layout_below="#+id/txtAppName"
android:layout_marginTop="5px"
android:text=""
android:textSize="24px"
android:textStyle="normal" />
<TextView
android:id="#+id/txtAppDesc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/imageView1"
android:layout_below="#+id/imageView1"
android:layout_marginTop="20dp"
android:maxHeight="350px"
android:maxLines="10"
android:scrollbars="vertical"
android:text=""
android:width="600px" />
<HorizontalScrollView
android:id="#+id/images"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/txtAppDesc"
android:layout_marginTop="30dp" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageView
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</HorizontalScrollView>
<Button
android:id="#+id/btnInstall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/images"
android:layout_centerHorizontal="true"
android:text="Download & Install" />
</RelativeLayout>
</ScrollView>
Understand that nesting a HorizontalScrollView inside a ScrollView (or vica versa) does not create a smooth scrolling effect in the x & y directions simultaneously. But you can create this effect as discussed here: Scrollview vertical and horizontal in android.