Develop Reference

Two RelativeLayouts sharing screen width

I have two RelativeLayouts. Each of them has some content which is unknown width. I cant use LinearLayout and set layout_weight, because one of this RelativeLayout has android:layout_alignParentEnd="true" and I don't know if it will be enough for children in terms of width.
Code:
<RelativeLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="80dp"
android:paddingTop="#dimen/padding_small"
android:paddingBottom="#dimen/padding_small"
android:paddingStart="#dimen/padding_medium"
android:paddingEnd="#dimen/padding_medium"
android:background="#color/grey">
<RelativeLayout
android:id="#+id/firstLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toStartOf="#id/secondLayout">
</RelativeLayout>
<RelativeLayout
android:id="#+id/secondLayout"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentEnd="true">
</RelativeLayout>
</RelativeLayout>
Expected result:
Reality:

Just give some specific width to the second layout instead of wrap_content like this I have given 100dp here
<RelativeLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="80dp"
android:paddingTop="#dimen/padding_small"
android:paddingBottom="#dimen/padding_small"
android:paddingStart="#dimen/padding_medium"
android:paddingEnd="#dimen/padding_medium"
android:background="#color/grey">
<RelativeLayout
android:id="#+id/firstLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toStartOf="#id/secondLayout">
</RelativeLayout>
<RelativeLayout
android:id="#+id/secondLayout"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentEnd="true">
</RelativeLayout>
</RelativeLayout>

If you want to make layout what you expect, there are many way.
for example, (only use LinearLayout and RelativeLayout)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="#color/colorPrimary"
android:orientation="horizontal">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent"
android:layout_weight="1">
<RelativeLayout
android:layout_weight="1"
android:id="#+id/firstLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toStartOf="#id/secondLayout"
android:background="#color/colorAccent" />
<TextView
android:layout_width="match_parent"
android:text="header"
android:background="#color/colorWhite"
android:layout_height="wrap_content"/>
</LinearLayout>
<RelativeLayout
android:id="#+id/secondLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentEnd="true"
android:layout_weight="2"
android:background="#color/colorPrimaryDark" />
</LinearLayout>
this xml can make this.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="#858585"
android:paddingStart="8dp"
android:paddingTop="4dp"
android:paddingEnd="8dp"
android:paddingBottom="4dp">
<RelativeLayout
android:id="#+id/firstLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#66b35f"
android:layout_toStartOf="#id/secondLayout"/>
<RelativeLayout
android:id="#+id/secondLayout"
android:minWidth="120dp"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#6e89c2"
android:layout_alignParentEnd="true"/>
</RelativeLayout>
You should use the parameter "android:minWidth="Xdp"
Then it looks like above.

How to make Android xml Linerlayout at the bottom of the activity in Android Studio?

How do I make LinearLayout in Android Studio at the bottom of the page. The result from the code below
I want the highlighted darken layout to be at the bottom of the page.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
tools:context=".MainPage"
android:orientation="vertical"
android:background="#ffffff">
<Button
android:id="#+id/taptoscan"
android:layout_marginTop="40dp"
android:layout_marginBottom="10dp"
android:layout_width="120dp"
android:layout_height="120dp"
android:background="#drawable/barcode"
android:layout_gravity="center"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Tap to Scan"
android:fontFamily="#font/antic"
android:layout_gravity="center"
android:textSize="18sp"/>
<!--here is the layout i want to put at the bottom of the page-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#color/colorPrimaryDark"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:gravity="bottom">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</RelativeLayout>
</LinearLayout>
In the above code I tried the below and did not worked.
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:gravity="bottom"

You can use RelativeLayout at the outside. Something like this, and then ADD new one LinearLayout after that.
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:orientation="vertical"
tools:context=".MainPage">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
android:id="#+id/taptoscan"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_gravity="center"
android:layout_marginTop="40dp"
android:layout_marginBottom="10dp"
android:background="#drawable/barcode" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:fontFamily="#font/antic"
android:text="Tap to Scan"
android:textSize="18sp" />
</LinearLayout>
<!--here is the layout i want to put at the bottom of the page-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:background="#color/colorPrimaryDark"
android:gravity="bottom"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</RelativeLayout>

Use Frame Layout as base layout to do it in the best way, it's gonna work definitely
Just use layout_gravity="bottom" in the LinearLayout which you want at bottom and
Just like this :
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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="#ffffff"
android:orientation="vertical"
tools:context=".MainPage">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
android:id="#+id/taptoscan"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_gravity="center"
android:layout_marginTop="40dp"
android:layout_marginBottom="10dp"
android:background="#drawable/barcode" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:fontFamily="#font/antic"
android:text="Tap to Scan"
android:textSize="18sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_gravity="bottom"
android:background="#color/colorPrimaryDark"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</FrameLayout>

The approach below would help you achieve your design specifications with zero overlappings. Basically, there are four key steps:
Change your root layout to a RelativeLayout.
Inside the RelativeLayout, add a LinearLayout that would contain your Button and your TextView.
Inside the same RelativeLayout, add the LinearLayout that you intend to pin to the bottom of the screen.
Make sure yoU set the first LinearLayout on top of the second by using the android:layout_above="" attribute.
Now, here's the code:
<?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="match_parent"
tools:context=".MainPage">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#ffffff"
android:layout_above="#+id/bottomView">
<Button
android:id="#+id/taptoscan"
android:layout_marginTop="40dp"
android:layout_marginBottom="10dp"
android:layout_width="120dp"
android:layout_height="120dp"
android:background="#drawable/barcode"
android:layout_gravity="center"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Tap to Scan"
android:fontFamily="#font/antic"
android:layout_gravity="center"
android:textSize="18sp"/>
</LinearLayout>
<!--here is the layout i want to put at the bottom of the page-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:id="#+id/bottomView"
android:background="#color/colorPrimaryDark"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:gravity="bottom">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
I hope this helps.

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>

Dynamically adjust position of Button in Android Studio

I have a Button in Linear Layout when I see in the Design view of Activity xml ,it looks like it is perfectly positioned but when I see in GenyMotoin avd it is farly placed from what I expected.
How to dynamically adjust the position of button on different screen sizes?
My xml file:
<?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: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.xxx.MainScreen"
android:background="#b6b6b6">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<TextView
android:layout_width="match_parent"
android:layout_height="263dp"
android:id="#+id/textView"
android:textSize="50dp" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="264dp">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Next Act"
android:id="#+id/button"
android:layout_marginTop="100dp"
android:layout_marginLeft="20dp" />
</LinearLayout>
</RelativeLayout>

Use Linear Layout for the outermost layout.

It's not clear what your trying to achieve but If you want to position your views at the center on all devices. Try to use RelativeLayout instead of LinearLayout:
<?xml version="1.0" encoding="utf-8"?>
<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="#b6b6b6"
android:padding="#dimen/activity_vertical_margin"
android:weightSum="2"
android:orientation="vertical"
tools:context="com.offtogeek.motivatemyself.MainScreen">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal">
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:gravity="left"
android:textSize="50dp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_weight="1"
android:text="Next Quote" />
</RelativeLayout>
</LinearLayout>