Develop Reference

RelativeLayout with overlapping views

I need to create a UI design like image below. I have used RelativeLayout, but the top view is hiding behind the CardView. I have tried so many ways, couldn't get it done.
here is my code:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="150dp"
tools:context=".activity.LoginActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="150dp"
android:elevation="4dp"
android:layout_margin="10dp"
>
</android.support.v7.widget.CardView>
<FrameLayout
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginStart="20dp"
android:layout_marginLeft="20dp"
android:background="#drawable/square_items">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/ic_aboutus"/>
</FrameLayout>
</RelativeLayout>

You need to put ImageView in Cardview so that elevation becomes equal for both. Try this
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:layout_marginBottom="10dp"
android:elevation="4dp"
android:padding="10dp"
app:cardCornerRadius="6dp">
</android.support.v7.widget.CardView>
</RelativeLayout>
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp">
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:src="#color/red" />
</android.support.v7.widget.CardView>
</RelativeLayout>
</RelativeLayout>

Bottomsheet Error : The view is not a child of CoordinatorLayout

I want to create a layout in which 80% of the Screen Contains separate layout and 20% contains the bottom sheet vertically. But when i try to do it, it gives me error "The view is not a child of CoordinatorLayout". I got the error, but i can't figure out some other way to do it. Can Someone please help me to achieve it. Help will be Appreciated.
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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"
android:background="#efefef">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="5">
<include
layout="#layout/content_main_new"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="4" />
<include
layout="#layout/content_bottom_sheet2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
content_bottom_sheet2.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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="match_parent">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/bottomSheetLayout"
android:layout_width="match_parent"
android:layout_height="230dp"
android:background="#color/colorPrimary"
android:orientation="vertical"
android:padding="#dimen/activity_vertical_margin"
app:behavior_peekHeight="90dp"
app:layout_behavior="#string/bottom_sheet_behavior">
<!--android:background="#android:color/holo_orange_light"-->
<android.support.v7.widget.CardView
android:id="#+id/cvBottomCard"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="#dimen/spIconsize"
android:visibility="visible"
app:cardBackgroundColor="#color/white"
app:cardCornerRadius="10dp"
app:cardElevation="5dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:paddingTop="10dp"
android:orientation="horizontal">
<Button
android:layout_marginBottom="5dp"
android:id="#+id/btnReview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="15dp"
android:layout_weight="1"
android:background="#drawable/rounded_button_darkgreen_bg"
android:text="Review"
android:textColor="#color/white" />
<Button
android:layout_marginBottom="5dp"
android:id="#+id/btnReschedule"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_weight="1"
android:background="#drawable/rounded_button_grey"
android:text="Reschedule"
android:textColor="#color/white" />
</LinearLayout>
<RelativeLayout
android:id="#+id/relLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/linearLayout"
android:layout_marginTop="5dp"
android:padding="10dp"
android:visibility="visible">
<ImageButton
android:id="#+id/imageButton"
android:layout_width="80dp"
android:layout_height="90dp"
android:src="#drawable/user"
android:visibility="gone" />
<TextView
android:id="#+id/tvappointmentId"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toEndOf="#+id/imageButton"
android:text="Appointment ID - 5727"
android:textColor="#color/black" />
<TextView
android:id="#+id/tvCustomerName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvappointmentId"
android:layout_toEndOf="#+id/imageButton"
android:text="Name - Virat Sharma"
android:textColor="#color/black" />
<TextView
android:id="#+id/tvLoanType"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvCustomerName"
android:layout_toEndOf="#+id/imageButton"
android:text="Loan Type - Home LOAN" />
<TextView
android:id="#+id/tvLoanAmount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvLoanType"
android:layout_toEndOf="#+id/imageButton"
android:text="Loan Amount - 5727" />
<TextView
android:id="#+id/tvTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/tvappointmentId"
android:layout_alignBottom="#+id/tvappointmentId"
android:layout_alignParentEnd="true"
android:gravity="right"
android:text="01:22 Mins"
android:textColor="#color/red_error"
android:textStyle="bold"
android:visibility="gone" />
</RelativeLayout>
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>

Can you try this way, please?
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/bottomSheetLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:behavior_peekHeight="90dp"
app:layout_behavior="#string/bottom_sheet_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="230dp"
android:background="#color/colorPrimary"
android:orientation="vertical"
android:padding="#dimen/activity_vertical_margin">
...
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
All that I have done is to put the id that you will call later as your bottom sheet in the root element (Which by the way could be a ConstraintLayout if you want), as you can notice, the parent of this root element will be automatically a CoodinatorLayout.
The second thing is to put this element with a height wrap_content
The layout behaviour should be in the root element, too. app:layout_behavior="#string/bottom_sheet_behavior"

Transparent Background For RecyclerView

this is my layout for a chat window in within my recyclerview:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#android:color/transparent"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:background="#android:color/transparent"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="10dp" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_weight="418"
android:layout_width="0dp"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="0dp"
android:layout_weight="100"
android:gravity="right"
android:layout_height="match_parent">
<ImageButton
android:id="#+id/btn_profilepic_recview_chats"
android:background="#drawable/ripple"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="323"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="0dp"
android:layout_weight="100"
android:layout_height="wrap_content" />
<LinearLayout
android:layout_width="0dp"
android:layout_weight="323"
android:orientation="vertical"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:src="#drawable/chat_img_bubbletop"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#afebff">
<TextView
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:textColor="#000000"
android:textSize="17sp"
android:id="#+id/txt_chatmessage_recview_chats"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:src="#drawable/chat_img_bubbletop"
android:rotation="180"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="0dp"
android:layout_weight="100"
android:layout_height="match_parent" />
<LinearLayout
android:layout_width="0dp"
android:layout_weight="323"
android:layout_height="match_parent">
<TextView
android:text="12.02.2012"
android:id="#+id/txt_date_recview_chats"
android:textSize="12sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_weight="216"
android:layout_width="0dp"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="10dp" />
</LinearLayout>
</android.support.v7.widget.CardView>
The Background of the recyclerview is a simple image, that is supposed to show through the linear layouts. But unfortunately, this is the result:
So, as you can see, the background is displayed just right but the supposed to be transparent layout for the cardview i am using here is some wired black.
I can make it whatever color I want, but with:
android:background="#android:color/transparent"
it just gets black.
Can anyone help me here?
Thanks you! :)

You can use
app:cardBackgroundColor="#android:color/transparent"

You have to change your CardView background color. you can use
app:cardBackgroundColor="#android:color/transparent"
Instead of
android:background="#android:color/transparent"
Like :
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:cardBackgroundColor="#android:color/transparent">
<!-- Your view design -->
</android.support.v7.widget.CardView>

... turns out CARDVIEWS do not have such attribute. Making the rootlayout a linearlayout solved this issue.

How do I get an imageView and textview to both fill the layout when setting bitmap programmatically?

What I want is for qrcodetext to fit and display all the text in qrcode_layout and have qrimageView to fill the rest of qrcode_layout? But my layout below has the entire qrimageView cover qrcode_layout. I tried a bunch of other variations but without success.
Here is what it looks like.
Here is what I want it to look like.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
android:id="#+id/qrcodelayout">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/qrimageView"
android:layout_gravity="center_horizontal"
android:layout_marginTop="8dp" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/qrcodetext"
android:gravity="center"
android:layout_gravity="center_horizontal"
android:layout_marginTop="4dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</RelativeLayout>

Use following code. Align your textview to bottom and then align your Qrcode Image above text:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/qrcodetext"
android:gravity="center"
android:layout_alignParentBottom="true"
android:layout_marginTop="4dp" />
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/qrimageView"
android:layout_gravity="center_horizontal"
android:layout_above="#id/qrcodetext"
android:layout_alignParentTop="true"
android:layout_marginTop="8dp" />
</RelativeLayout>

I think what i have understand you want is below: Plz check and tell me:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
android:id="#+id/qrcodelayout">
<TextView
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/qrcodetext"
android:gravity="center"
android:layout_weight="1"
android:layout_gravity="center_horizontal"
android:layout_marginTop="4dp" />
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_weight="1">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/qrimageView"
android:layout_gravity="center_horizontal"
android:layout_marginTop="8dp" />
</LinearLayout>
</LinearLayout>
<!--<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>-->
</RelativeLayout>

Linear Layout does not fill the whole screen

Why the linear layout does not fill the whole screen?
As you can see I am using match parent in the linear layout.
If I delete the Scrollbar nothing changes. The button is not at the bottom of the screen.
main_activity.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/black"
tools:context="com.sarahp.demo.MainActivity">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout ----------> HERE
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/textview_demo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="32dp"
android:layout_marginTop="32dp"
android:text="#string/demo"
android:textSize="42dp"/>
<RelativeLayout
android:id="#+id/fragment_container_a"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<RelativeLayout
android:id="#+id/fragment_container_b"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:background="#color/transparent"/>
</LinearLayout>
</ScrollView>
</RelativeLayout>
F A is the fragment part.

Give android:fillViewport="true" to your ScrollView.
Your xml will looks like below. Main_Activity.xml
<?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">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="40dp"
android:text="Test Demo"
android:textStyle="bold"
android:gravity="center"/>
<RelativeLayout
android:id="#+id/fragment1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5"
android:background="#drawable/border_image">
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:gravity="center"
android:text="Test text Fragement1" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/fragment2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5"
>
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:gravity="center"
android:text="Test text Fragement2" />
</RelativeLayout>
</LinearLayout>
</ScrollView>
</RelativeLayout>

Remove the relative layout
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/textview_demo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="32dp"
android:layout_marginTop="32dp"
android:text="#string/demo"
android:textSize="42dp"/>
<RelativeLayout
android:id="#+id/fragment_container_a"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<RelativeLayout
android:id="#+id/fragment_container_b"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:background="#color/transparent"/>
</LinearLayout>
</ScrollView>