I'm revamping my app to follow look more "Material Design-ey", but have run into trouble with the FAB. I have a scrollview with two floating action buttons:
When I scroll to the bottom, the FABs cover my content. I want to be able to scroll a little past the bottom so the FABs can be align_parent_bottom without overlapping anything:
(should be able to scroll a little more for FABs to be aligned below)
(Before scrolling down)
How do I create extra space at the bottom of my app after scrolling down to the max for the FABs to rest?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#68d9cc">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#68d9cc">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
android:elevation="20dp"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<ImageView
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:id="#+id/back"
android:onClick="cancel"
android:src="#drawable/ic_arrow_back_black_24dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Test example"
android:textSize="22sp"
android:id="#+id/header"
android:textColor="#color/textColorPrimary"
android:layout_gravity="center"
android:paddingRight="10dp"
/>
</android.support.v7.widget.Toolbar>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/linear"
android:layout_marginBottom="55dp"
android:layout_below="#+id/textView12"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:textColor="#android:color/black"
android:layout_below="#+id/textView12"
android:text="textview:"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<EditText
android:id="#+id/editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/textView4"
android:layout_alignBottom="#+id/textView4"
android:layout_toEndOf="#+id/textView4"
android:layout_toRightOf="#+id/textView4"
android:imeOptions="actionDone"
android:inputType="text" />
</LinearLayout>
<ListView
android:id="#+id/listview"
android:layout_width="wrap_content"
android:choiceMode="singleChoice"
android:layout_height="300dp"
android:layout_below="#+id/toolbar"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:elevation="9dp">
</ListView>
<TextView
android:id="#+id/textView12"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="78dp"
android:gravity="center_horizontal"
android:text="textview"
android:textColor="#000000"
android:textSize="18sp"
android:layout_below="#+id/listview"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
</RelativeLayout>
</ScrollView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/cancel"
android:onClick="cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:clickable="true"
app:fabSize="normal"
app:srcCompat="#drawable/ic_close_black_24dp"
/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/done"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:clickable="true"
app:fabSize="normal"
app:srcCompat="#drawable/ic_done_black_24dp"
/>
</RelativeLayout>
If you are aiming for Material Design as you mentioned, then putting those Floating Action Button like that are not encouraged. Either stack them on top of each other on the right, or have one where it will open multiple mini FAB on click.
An easy fix however I can think of here would be to add paddingBottom to your layout so it would have more "content" and it would scroll up more.
I would read this section if you haven't already.
https://material.io/guidelines/components/buttons-floating-action-button.html#
Related
I have this XML code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent">
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/editText"
android:hint="enter your name"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button"
android:id="#+id/button"
android:layout_below="#+id/editText"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="name"
android:id="#+id/textView8"
android:layout_below="#+id/button"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginLeft="20dp"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/button2"
android:text="copy"
android:layout_alignBottom="#+id/textView8"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>
In AVD, it looks like this:
And in mobile, it looks like this:
How can I make them look the same?
This discrepancy occurs because you're using the RelativeLayout quite carelessly. Relative Layout positions items relatively to one another, so it might look different across different devices.
I'd suggest that you use one vertical LinearLayout and to have it have 2 horizontal LinearLayouts as its children, as the rows in which you put these fields. I will provide some modified code of yours below, but keep in mind that this will look the same on each device, and you need to make it look prettier, as this is just an example. Something like this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="wawdsd"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:baselineAligned="true">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="name"
android:id="#+id/textView8" />
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/editText"
android:hint="enter your name" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button"
android:id="#+id/button"
android:layout_marginTop="20dp"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/button2"
android:text="copy"/>
</LinearLayout>
my problem is that my text is cut :/
and I would like something like
here is my edittext :
<?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.support.v7.widget.Toolbar
android:id="#+id/tool_bar_messa"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#f4f4f4"
android:visibility="visible">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="#string/Contact"
android:textColor="#000"
android:textSize="30sp"
android:theme="#android:style/DeviceDefault.ButtonBar.AlertDialog"
android:id="#+id/tv_toolbar"
android:singleLine="true"
android:ellipsize="end" />
<TextView
android:id="#+id/tvDetails"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:singleLine="false"
android:text="#string/Details"
android:textColor="#3391e4"
android:textSize="20sp"
android:theme="#android:style/DeviceDefault.ButtonBar.AlertDialog" />
</android.support.v7.widget.Toolbar>
<ListView
android:id="#+id/lv_message"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:divider="#null"
android:dividerHeight="0dp"
android:stackFromBottom="false"
android:windowSoftInputMode="adjustResize" />
<RelativeLayout
android:id="#+id/layout_send"
android:background="#FFF"
android:layout_width="match_parent"
android:layout_height="46dp">
<EditText
android:id="#+id/Et_message"
android:layout_width="294dp"
android:hint="#string/sms_mms"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_gravity="bottom"
android:inputType="textMultiLine|textCapSentences"
android:scrollHorizontally="false"
android:scrollbars="vertical"
android:textCursorDrawable="#null" />
<ImageButton
android:id="#+id/btnSend"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignTop="#+id/Et_message"
android:layout_toEndOf="#+id/Et_message"
android:layout_toRightOf="#+id/Et_message"
android:background="#00ffffff"
android:src="#drawable/btnsend" />
</RelativeLayout>
</LinearLayout>
and this is before open keyboard then photo I modify some thing about my listview to start the bottom and resize it when keyboard is open stuff like that, maybe it's the problem ?
just remove android:lines="2" and it solve. and you want all the lines to show then also remove android:maxLines="3".
<EditText
android:id="#+id/Et_message"
android:layout_width="294dp"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_gravity="bottom"
android:hint="Type here"
android:inputType="textMultiLine|textCapSentences"
android:scrollHorizontally="false"
android:scrollbars="vertical"
android:maxLines="3"
android:textCursorDrawable="#null" />
this is working correctly.
I just want to center "CenterButton" (center of the root LinearLayout) but Androids just not cooperating..
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_gravity="center_horizontal"
android:layout_weight="0.00"
android:padding="5dp"
android:background="#zegerg"
android:id="#+id/LinearLayout1">
<ImageView
android:id="#+id/ImageView1"
android:layout_height="match_parent"
android:layout_width="151dp"
android:src="#mipmap/image_1"
android:contentDescription="#string/abcdef"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:id="#+id/CenterButton"
android:layout_gravity="center_horizontal|center_vertical|center"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="20dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text !"
android:id="#+id/TextView"
android:paddingBottom="30dp"
android:textColor="#37a52c" />
<ProgressBar
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/ProgressBar"
android:paddingBottom="30dp"
android:progressTint="#37a52c" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/text_text"
android:id="#+id/Button2"
android:layout_gravity="center_horizontal" />
</LinearLayout>
</LinearLayout>
Tried putting it at the end of the XML but doesn't work because the other elements push it aside.. not really sure what's happening.
if you want to have all three first level children to be in equally-sized columns, then you need to add to all of them the followings attribute:
android:layout_width="0dp"
android:layout_weight="1"
(don't forget the dimension "dp" to the width parameter, otherwise the IDE will complain).
...
<ImageView
android:id="#+id/ImageView1"
android:layout_height="match_parent"
android:layout_width="0dp"
android:layout_weight="1"
android:src="#mipmap/image_1"
android:contentDescription="#string/abcdef"/>
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Button"
android:id="#+id/CenterButton"
android:layout_gravity="center_horizontal|center_vertical|center"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:padding="20dp">
....
EDITED:
If you want your CenterButton to overlap all the other views, then what you have to do is:
wrap everything in a relative layout with height equal to 200dp, as its first child
remove the button CenterButton from the current position and add it at the bottom of everything, still inside the relative layout, but below the linear layout
add those properties to the button to make it center in the parent
android:layout_centerInParent="true"
So finally you will have something like this (I have changed some resources):
<?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="200dp">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_gravity="center_horizontal"
android:layout_weight="0.00"
android:padding="5dp"
android:background="#android:color/holo_orange_dark"
android:id="#+id/LinearLayout1">
<ImageView
android:id="#+id/ImageView1"
android:layout_height="match_parent"
android:layout_width="0dp"
android:layout_weight="1"
android:src="#drawable/plus"
android:contentDescription="abcdef"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:padding="20dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text !"
android:id="#+id/TextView"
android:paddingBottom="30dp"
android:textColor="#37a52c" />
<ProgressBar
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/ProgressBar"
android:paddingBottom="30dp"
android:progressTint="#37a52c" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="text"
android:id="#+id/Button2"
android:layout_gravity="center_horizontal" />
</LinearLayout>
</LinearLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Button"
android:id="#+id/CenterButton"
android:layout_gravity="center_horizontal|center_vertical|center"/>
</RelativeLayout>
You can use weight for such purposes for child items. Make layout_width for all of them as 0dp and set layout_weight as 1.
Give the three children in the topmost linear layout a gravity of 1 and a width of 0.
It's not clear what exactly is your problem. However, here are some general notes :
To center a View or a Layout inside RelativeView use layout_centerInParent="true"
To make a Layout on top of other layouts use FrameLayout
The order of the views/layouts in your xml file is important. The one you write the last will be on the top (in our example : the FrameLayout or just the CenterButton should be written after the other views and layouts in your xml file)
To distribute the available space inside LinearLayout among its views use android:layout_weight="1" (change the value according to your needs)
you can play aground with this example :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="200dp">
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#fff"
android:orientation="horizontal"
android:padding="5dp">
<ImageView
android:id="#+id/ImageView1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:src="#mipmap/ic_launcher" />
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:orientation="vertical">
<TextView
android:id="#+id/TextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="30dp"
android:text="Text !"
android:textColor="#37a52c" />
<ProgressBar
android:id="#+id/ProgressBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="30dp"
android:progressTint="#37a52c" />
<Button
android:id="#+id/Button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="text_text" />
</LinearLayout>
</LinearLayout>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true">
<Button
android:id="#+id/CenterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical|center"
android:text="Button" />
</FrameLayout>
</RelativeLayout>
How do I remove the gray line (you can see on the screen) at the bottom of CardView?
Archive with source-code
I reviewed everything. I don't understand what the problem is.
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout">
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="contact det"
android:gravity="center_vertical"
android:textColor="#android:color/background_dark"
android:textSize="14dp"
android:layout_gravity="center_horizontal"/>
</LinearLayout>
<View
android:layout_height="1dp"
android:layout_width="match_parent"
android:background="#color/accent"
android:layout_below="#+id/linearLayout"/>
<TextView
android:id="#+id/txtName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Name"
android:gravity="center_vertical"
android:textSize="10dp"
android:layout_below="#+id/linearLayout"
android:layout_alignLeft="#+id/txtSurname"
android:layout_alignStart="#+id/txtSurname"/>
<TextView
android:id="#+id/txtSurname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Surname"
android:gravity="center_vertical"
android:textSize="10dp"
android:layout_below="#+id/txtName"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"/>
<TextView
android:id="#+id/txtEmail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Email"
android:textSize="10dp"
android:layout_above="#+id/txtAdd"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"/>
<TextView
android:id="#+id/txtAdd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Address"
android:textSize="10dp"
android:layout_alignTop="#+id/txtSurname"
android:layout_alignLeft="#+id/txtEmail"
android:layout_alignStart="#+id/txtEmail"/>
</RelativeLayout>
Its my item CardView.
when
card_view:cardCornerRadius="2dp"
all is good, but when I write another value and line appears!
Just use “com.google.android.material.card.MaterialCardView” it will avoid issues connected to CardView
Try this -
android:divider="#null"
Or from your code -
getListView().setDivider(null);
getListView().setDividerHeight(0);
My layout contains three buttons, one EditText field and one button. I want to place the three buttons in one row, but in the center (horizontal) of the screen. The EditText field should be below the buttons and below the EditText field, there should be one button.
Here is my layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/blueAct"
android:orientation="vertical"
android:paddingBottom="100.0dip"
android:paddingLeft="10.0dip"
android:paddingRight="10.0dip"
android:paddingTop="100.0dip" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingBottom="4.0dip"
android:paddingLeft="100.0dip"
android:paddingRight="100.0dip"
android:paddingTop="5.0dip" >
<ImageButton
android:id="#+id/buttonGreen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginRight="4.0dip"
android:background="#drawable/green_button"
android:contentDescription="#string/green" />
<ImageButton
android:id="#+id/buttonRed"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginRight="4.0dip"
android:background="#drawable/red_button"
android:contentDescription="#string/red" />
<ImageButton
android:id="#+id/buttonBlue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginRight="4.0dip"
android:background="#drawable/blue_button"
android:contentDescription="#string/blue" />
</LinearLayout>
<EditText
android:id="#+id/phone_code"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:hint="#string/phone_code"
android:paddingTop="100.0dip"
android:textColor="#color/white"
android:textColorHint="#color/white" >
<requestFocus />
</EditText>
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dip"
android:background="#color/orangeAct"
android:onClick="searchUsers"
android:paddingTop="100.0dip"
android:text="#string/button_go"
android:textColor="#color/white" />
</LinearLayout>
Now the problem is, that the three buttons are not in the center if the user changes from portrait to landscape mode.
How is it possible to make this 'responsive', without creating a separate layout file for landscape mode?
Any help would be greatly appreciated.
Don't use padding on your horizontal LinearLayout to center the views. Instead you can add views before and after that expand to fill the remaining space.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1" />
<ImageButton
android:id="#+id/buttonGreen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
... />
<ImageButton
android:id="#+id/buttonRed"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
... />
<ImageButton
android:id="#+id/buttonBlue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
... />
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
<?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="#mipmap/background"
android:orientation="vertical"
android:id="#+id/homemain124"
android:weightSum="3">
<RelativeLayout
android:id="#+id/paneltamrin"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="something"
android:textColor="#fff"
android:id="#+id/top1"
android:gravity="center_horizontal"
android:layout_marginTop="10dp"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="40dp"
android:layout_marginLeft="40dp"
android:padding="8dp"
android:background="#drawable/textcorner"
android:layout_below="#+id/top1"
android:text="something"
android:textSize="20sp"
android:textColor="#fff"
android:id="#+id/top2"
android:fontFamily="monospace"
android:textStyle="bold"
android:gravity="center_horizontal"
android:layout_marginTop="30dp"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/top2"
android:text="APPLIED BY"
android:textSize="15sp"
android:id="#+id/top3"
android:textColor="#fff"
android:gravity="center_horizontal"
android:layout_marginTop="30dp"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/top3"
android:text="COURT OF JUSTICE IN INDIA"
android:id="#+id/top4"
android:textSize="15sp"
android:textColor="#fff"
android:textStyle="bold"
android:gravity="center_horizontal"
android:layout_marginTop="10dp"/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/paneltamrin2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center">
<ImageView
android:layout_width="220dp"
android:layout_height="160dp"
android:src="#mipmap/book1"
android:id="#+id/image1"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"
/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/paneltamrin3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="READ NOW"
android:textColor="#fff"
android:lineSpacingExtra="10dp"
android:textSize="20sp"
android:layout_marginTop="10dp"
android:layout_marginBottom="15dp"
android:id="#+id/buttonorder"
android:padding="20dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/orderbutton"
android:layout_centerHorizontal="true"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#fff"
android:textSize="13sp"
android:layout_marginTop="10dp"
android:gravity="center_horizontal"
android:layout_below="#+id/buttonorder"
android:text="something"/>
</RelativeLayout>
</LinearLayout>
Linear layout added for 3 relative layouts