Android Layout - Dual Horizontal Scroll views - android-layout

Is it possible (anything's possible, right!) to create dual horizontal scroll views on one layout screen?
As an example....I would like two (or three) row or icons that scroll independently. I see this type of behavior on apps like Pulse.
Help with layout code please... here is my single hor. scroll...
<?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" >
<HorizontalScrollView android:layout_height="100dp" >
<ImageButton
android:id="#+id/ImageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon1" >
</ImageButton>
<ImageButton
android:id="#+id/ImageButton2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon2" >
</ImageButton>
</HorizontalScrollView>
<HorizontalScrollView android:layout_height="100dp" >
<ImageButton
android:id="#+id/ImageButton3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon3" >
</ImageButton>
<ImageButton
android:id="#+id/ImageButton3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon4" >
</ImageButton>
</HorizontalScrollView>
</LinearLayout>
****Updated Code still not working... Maybe the height/width properties?


Here is solution this is working fine
<?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" >
<HorizontalScrollView
android:layout_height="100dp"
android:layout_width="100dp">
<LinearLayout android:layout_height="wrap_content" android:layout_width="wrap_content">
<ImageButton
android:id="#+id/ImageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" >
</ImageButton>
<ImageButton
android:id="#+id/ImageButton2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" >
</ImageButton>
</LinearLayout>
</HorizontalScrollView>
<HorizontalScrollView android:layout_height="100dp"
android:layout_width="100dp" >
<LinearLayout android:layout_height="wrap_content" android:layout_width="wrap_content">
<ImageButton
android:id="#+id/ImageButton3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<ImageButton
android:id="#+id/ImageButton3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" >
</ImageButton>
</LinearLayout>
</HorizontalScrollView>
</LinearLayout>
try this enjoy...


Just put two or more scrolls in one LinearLayout
<LinearLayout
android:orientation="vertical" ...>
<HorizontalScrollView android:layout_height="100dp" .../>
<HorizontalScrollView android:layout_height="100dp" .../>
...
</LinearLayout>

Related

Unable to set text view at the bottom of other text view

I have an ImaveView images and corresponding to each image there is TextView img_name and img_source, I want to align them like 1st image should be placed and at right of image image_name should be displayed and below img_name, img_source should be display.
I have tried with below layout code but couldn't work as expected
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="start"
>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imageview_cover_art"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:gravity="center_horizontal"/>
<ImageView
android:id="#+id/imageview_favorite"
android:layout_width="24dp"
android:layout_height="24dp"
android:src="#drawable/star_disabled"
android:layout_gravity="bottom|right"/>
</FrameLayout>
<TextView
android:id="#+id/textview_book_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="12sp"
tools:text="Are You My Mother"
android:textStyle="bold"
android:paddingTop="4dp"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:gravity="center_horizontal"/>
<TextView
android:id="#+id/textview_book_author"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="12sp"
tools:text="Dr. Seuss"
android:gravity="center_horizontal"
android:orientation="vertical"/>
</LinearLayout>
It is displaying like
Image > TextView > TextView
but i require like:
Image > TextView
TextView
Also if first TetView is bigger then need to break in another line
Please help.

Just add the two textview into another linearview with vertical orientation :-
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="start"
>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imageview_cover_art"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:gravity="center_horizontal"/>
<ImageView
android:id="#+id/imageview_favorite"
android:layout_width="24dp"
android:layout_height="24dp"
android:src="#drawable/star_disabled"
android:layout_gravity="bottom|right"/>
</FrameLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/textview_book_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="12sp"
tools:text="Are You My Mother"
android:textStyle="bold"
android:paddingTop="4dp"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:gravity="center_horizontal"/>
<TextView
android:id="#+id/textview_book_author"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="12sp"
tools:text="Dr. Seuss"
android:gravity="center_horizontal"
android:orientation="vertical"/>
</LinearLayout>
</LinearLayout>

Simply place views in Linear Layout after that add android:orientation="vertical"
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/textview_book_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="12sp"
tools:text="Are You My Mother"
android:textStyle="bold"
android:paddingTop="4dp"
android:paddingLeft="8dp"
android:paddingRight="8dp"
/>
<TextView
android:id="#+id/textview_book_author"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="12sp"
tools:text="Dr. Seuss" />
</LinearLayout>

Dressing a mannequin with different items in android

I am trying to implement similar screen. Unable to add different items at proper place. I want to add shoes at the proper place.
Layout
<?xml version="1.0" encoding="utf-8"?><RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:padding="0dp">
<ImageView
android:id="#+id/imgBody"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:scaleType="fitXY"
android:src="#drawable/dress" />
<ImageView
android:id="#+id/imgFeet"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imgBody"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="0dp"
android:src="#drawable/ic_shoe1"
android:visibility="gone" />
<ImageView
android:id="#+id/imgFace"
android:layout_width="50dp"
android:layout_height="wrap_content"
android:layout_marginLeft="55dp"
android:layout_marginTop="0dp"
android:src="#drawable/ic_head"
android:visibility="gone" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/white"/>

Try to user Table layout for split a screen in two part. like below :
Here i have use android:layout_weight="0.5" for screen size.
<TableLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#EBEBEB"
android:stretchColumns="2"
android:weightSum="2">
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="0.5"
android:background="#FFFFFF"
android:orientation="vertical">
<!--Write your xml Right side xml code here-->
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="0.5"
android:background="#FFFFFF">
<!--Write your xml Left side xml code here-->
</RelativeLayout>
</TableRow>
</TableLayout>

Use Constraint Layout it will be easy for you to Design your Requirement
Add this dependency in your Project
compile 'com.android.support.constraint:constraint-layout:1.0.2'
Here I have added a code for your design
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imageView3"
android:layout_width="0dp"
android:layout_height="0dp"
android:scaleType="fitXY"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/guideline4"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0"
app:srcCompat="#drawable/splash" />
<android.support.constraint.Guideline
android:id="#+id/guideline4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.5"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="0dp" />
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:minHeight="55dip"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Left" />
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Center" />
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Right" />
</android.support.design.widget.TabLayout>
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Review"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="parent"
tools:layout_editor_absoluteX="265dp"
tools:layout_editor_absoluteY="463dp" />
<android.support.v7.widget.RecyclerView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
android:layout_marginTop="0dp"
app:layout_constraintBottom_toTopOf="#+id/button"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tabLayout"
app:layout_constraintVertical_bias="0.0" />
</android.support.constraint.ConstraintLayout>

I think instead of layout you should try to use canvas in left preview screen. On selecting any item should update left canvas by adding item in canvas and rendering elements.
Please have a look over canvas and drawing images over canvas.

Android Portrait to Landcape Slider & ImageView not responsive

My Portrait View is looks Fine
My Landscape View alignment is collapsed
this is my code of activity_main.xml
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawerLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fillViewport="true">
<LinearLayout
android:id="#+id/linear_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RelativeLayout
android:id="#+id/img_slideshow_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView android:id="#+id/img_name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/indicator"
android:background="#color/PrimaryColor"
android:gravity="center"
android:ellipsize="end"
android:paddingBottom="2dp"
android:paddingLeft="5dp"
android:paddingRight="2dp"
android:paddingTop="2dp"
android:singleLine="true"
android:textColor="#ededed" />
</RelativeLayout>
<View android:id="#+id/div_a"
android:layout_width="wrap_content"
android:layout_height="1dp"
android:layout_below="#+id/img_slideshow_layout"
android:background="#color/view_divider_color" />
<View android:id="#+id/div_b"
android:layout_width="wrap_content"
android:layout_height="1dp"
android:layout_below="#+id/div_a"
android:background="#color/view_divider_color_2" />
<com.studiobluelime.utils.CirclePageIndicator
android:id="#+id/indicator"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/view_pager"
android:layout_marginBottom="4dp" />
</RelativeLayout>
<!--<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ProgressBar
style="#style/Base.Widget.AppCompat.ProgressBar"
android:id="#+id/progress"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:indeterminate="true" />
<android.support.v7.widget.RecyclerView
android:id="#+id/card_recycler_view"
android:scrollbars="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</RelativeLayout>-->
<!-- <android.support.v7.widget.RecyclerView
android:id="#+id/card_recycler_view_new"
android:scrollbars="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"/>-->
</LinearLayout>
</ScrollView>
<ImageView
android:layout_width="wrap_content"
android:layout_height="100dp"
app:srcCompat="#drawable/shop_online"
android:layout_marginLeft="140dp"
android:id="#+id/shop_online"
android:scaleType="fitXY"
android:adjustViewBounds="true"
android:layout_marginTop="200dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="#drawable/nandme"
android:adjustViewBounds="true"
android:layout_marginLeft="30dp"
android:layout_marginTop="320dp"
android:scaleType="fitXY"
android:id="#+id/nandme"/>
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
app:srcCompat="#drawable/storelocation"
android:adjustViewBounds="true"
android:layout_marginLeft="258dp"
android:id="#+id/storelocation"
android:scaleType="fitXY"
android:layout_marginTop="250dp"/>
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
app:srcCompat="#drawable/promotins"
android:adjustViewBounds="true"
android:layout_marginLeft="20dp"
android:id="#+id/promotins"
android:scaleType="fitXY"
android:layout_marginTop="240dp"/>
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="fill_parent"
android:layout_height="157dp" />
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:itemIconTint="#color/PrimaryDarkColor"
app:itemTextColor="#color/colorAccent"
app:itemBackground="#drawable/ripple"
app:menu="#menu/navigation_items" />
</android.support.v4.widget.DrawerLayout>
I wrote this code in four layouts: layout/activity_main.xml,layout-small/ activity_main.xml, layout-large/activity_main.xml, layout-xlarge/activity_main.xml but it did not change. I have attached a screen shot here. Please click the above name "My Portrait View is looks Fine My Landscape View alignment is collapsed"

Image won't center with android:layout_centerHorizontal

my image wont center using the code "android:layout_centerHorizontal" even using gravity wont solve it. Is there any other way or are there wrong inputs in my relativelayout and scroll view.
scale layout bounds
landscape view of with scale layout bounds
screen size 768x1280 nexus api23
I am not having problems with android version 4 maybe this is api related? since my minimum sdk is android version 2?
Here is the code:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:fillViewport="true"
android:layout_height="fill_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.capstone.jmilibraryapp.Login">
<EditText
android:layout_width="300dp"
android:layout_height="wrap_content"
android:id="#+id/etUsername"
android:hint="Enter Sr-Code"
android:layout_below="#+id/imageView3"
android:layout_centerHorizontal="true" />
<ImageView
android:layout_centerHorizontal="true"
android:layout_width="500dp"
android:layout_height="200dp"
android:src="#drawable/jmilogo"
android:id="#+id/imageView3"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<EditText
android:layout_width="300dp"
android:layout_height="wrap_content"
android:id="#+id/etPassword"
android:inputType="textPassword"
android:hint="Password"
android:layout_below="#+id/etUsername"
android:layout_centerHorizontal="true" />
<Button
android:layout_width="300dp"
android:layout_height="wrap_content"
android:id="#+id/bLogin"
android:text="Log In"
android:layout_below="#+id/etPassword"
android:layout_alignLeft="#+id/etPassword"
android:layout_alignStart="#+id/etPassword" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Log In as Guest"
android:id="#+id/guest"
android:layout_marginTop="20dp"
android:layout_below="#+id/bLogin"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Log In as Guest"
android:id="#+id/testinguser"
android:layout_marginTop="20dp"
android:layout_below="#+id/guest"
android:layout_centerHorizontal="true"
/>
</RelativeLayout>
</ScrollView>

Probably your image don´t have the same ratio of your ImageView, you can check it enabling showLayoutBounds in the developer tools in the device. You will see the real size of the imageView.
To solve that you can make you ImageView to be proportionally to your ImageView or ad a scaleType="fitCenter" to your ImageView.

Try below xml this is work with me..
<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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:layout_centerHorizontal="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="20dp"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="200dp"
android:layout_gravity="center_horizontal"
android:layout_weight="1"
android:scaleType="fitCenter"
android:src="#drawable/school" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="20dp"
android:layout_weight="1">
<EditText
android:id="#+id/etUsername"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:hint="Enter Sr-Code" />
<EditText
android:id="#+id/etPassword"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_below="#+id/etUsername"
android:layout_centerHorizontal="true"
android:hint="Password"
android:inputType="textPassword" />
<Button
android:id="#+id/bLogin"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/etPassword"
android:layout_alignStart="#+id/etPassword"
android:layout_below="#+id/etPassword"
android:text="Log In" />
<TextView
android:id="#+id/guest"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/bLogin"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"
android:text="Log In as Guest"
android:textAppearance="?android:attr/textAppearanceSmall"/>
<TextView
android:id="#+id/testinguser"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/guest"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"
android:text="Log In as Guest"
android:textAppearance="?android:attr/textAppearanceSmall"/>
</RelativeLayout>
</LinearLayout>
</ScrollView>

How to adjust screen size for all android devices

I just can't seem to find a way to fit the photo onto my home page screen, I've tried many different ways but it wasn't successful. I have an image that pushes the layout that is under it and squeezes the buttons on the screen. Is there any way I can auto resize the height it for different screens? I only need the height since the width should be match_parent. Below is the xml file.
<?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:background="#color/white"
android:orientation="vertical"
>
<RelativeLayout
android:id="#+id/headerLayout"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
android:background="#drawable/nav_bar_homepage" >
<TextView
android:id="#+id/pageTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="WELCOME!" />
<ImageView
android:id="#+id/hiddenIcDrawer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginTop="10dp"
android:src="#drawable/nav_icon"
android:visibility="invisible" />
</RelativeLayout>
<ImageView
android:id="#+id/horLine"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/headerLayout"
android:scaleType="center"
android:src="#drawable/line_big_white" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:scaleType="fitStart" >
<ImageView
android:id="#+id/image_homepage_id"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_gravity="center_horizontal"
android:src="#drawable/image_homepage"
/>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_gravity="center"
android:layout_margin="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/field_red_homepage"
android:orientation="vertical"
android:scaleType="fitXY" >
<ImageView
android:id="#+id/logo_homep"
android:layout_width="wrap_content"
android:layout_height="80dp"
android:layout_gravity="center"
android:layout_marginBottom="10dp"
android:layout_marginTop="5dp"
android:paddingBottom="10dp"
android:scaleType="fitXY"
android:src="#drawable/logo_homepage" />
<ImageView
android:id="#+id/redeembytton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/btn_redeemrewards"
android:scaleType="fitXY" >
</ImageView>
<ImageView
android:id="#+id/orderbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="15dp"
android:background="#drawable/btn_orderonline"
android:scaleType="fitXY" >
</ImageView>
<ImageView
android:id="#+id/rewardsButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="15dp"
android:background="#drawable/btn_earnrewards"
android:scaleType="fitXY" >
</ImageView>
<ImageView
android:id="#+id/referFriendButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="10dp"
android:layout_marginBottom="5dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="15dp"
android:background="#drawable/btn_referafriend"
android:scaleType="fitXY" >
</ImageView>
</LinearLayout>
</LinearLayout>

Wrap you xml code into ScrollView if you are okay with scrolling down to reach your contents under ImageView. If you don't want to scroll down, it is best to use "weight" attribute. I am giving you an idea how to implement it in your code.
Let's say the height of the whole screen is 1. You have an image and a button to put on the screen for all devices. So split the screen into two parts... 0.8 for imageview and 0.2 for the button. You can use the code below to get this result.
<?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" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp" <!-- Important >
android:orientation="vertical"
android:layout_weight=".8" > <!-- 80% of your screen size>
<!-- Your ImageView >
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp" <!-- Important >
android:orientation="vertical"
android:layout_weight=".2" > <!-- 20% of your screen size>
<!-- Your Button >
</LinearLayout>
</LinearLayout>

Try this
I think you should use
android:layout-weight="1" for adjusting the height according to different devices.use it in your <ImageLayout/>.

Resources