Develop Reference

FloatingActionButton inside constraintLayout in ScrollView

i have a floatingActionButton inside a ConstraintLayout which is inside a ScrollView
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/background_grey">
<androidx.constraintlayout.widget.ConstraintLayout>
----
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/bag_background"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
/>
-----
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
the problem is that the button is scrolling down and up with the UI
Ps: i don't know if it is important, but the scrollView is inside a drawerLayout

You can make Your root view as FrameLayout then inside it, you will but the ScrollView then the FAB button something like below
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/background_grey">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/background_grey">
<androidx.constraintlayout.widget.ConstraintLayout>
<!-- your view xml here -->
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:src="#drawable/bag_background"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
/>
</FrameLayout>

To place the floating action button, use CoordinatorLayout. A CoordinatorLayout helps facilitate interactions between views contained within it, which will be useful to describe how to animate the button depending on scroll changes.
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom"
android:layout_margin="16dp" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>

(android) How to place a view below other views in constraint layout

This picture is state of layout
I want to place the RecyclerView below the Button
However, as you can see, even with layout_constraintTop_toBottomOf, the RecyclerView is not placed
under the Button
There is a condition, the size of the RecyclerView must be math_parent.
This is because you are using a nested recycler view and you are dynamically adding items, otherwise
the last nested recycler view's item will be cut off and not visible when adding dynamically..
If I set the height of a view to match_parent in the constraint layout, is there any way to place it
below other views?
This is XML file.
activity_write_routine.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
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"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".data.DailyRecordDetailActivity">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/Theme.AppBarOverlay"
app:elevation="0dp">
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/body_part_detail_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="P A R T"
android:textColor="#color/white"
android:textAppearance="#style/TextAppearance.AppCompat.Widget.ActionBar.Title"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior">
<Button
android:id="#+id/add_routine"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="A D D"
android:backgroundTint="#color/light_green"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/routine_recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical"
app:layout_constraintTop_toBottomOf="#+id/add_routine"/>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>

change the height to 0dp, and constraint the bottom of recyclerview to parent
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/routine_recyclerview"
android:layout_width="match_parent"
android:layout_height="0dp"
android:scrollbars="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#+id/add_routine"/>

How to set Android ListView's cell height as half of cell width?

I am trying to use constraint layout as below. But the aspect ratio is not respected in the actual layout. Instead, the height is actually wrapping the content inside
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/content"
android:layout_height="0dp"
android:layout_width="match_parent">
<!-- some content inside -->
</android.support.constraint.ConstraintLayout>
I then think it might be because I didn't set width="0dp" (let constraint decide the width). So I tried another way like below. But then the width becomes zero.
What is the correct way of doing it?
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/content"
android:layout_height="0dp"
android:layout_width="0dp"
app:layout_constraintStart_toEndOf="parent"
app:layout_constraintEnd_toEndOf="parent">
<!-- some content inside -->
</android.support.constraint.ConstraintLayout>
EDIT: working solution after inspired by Anddenver 's answer (with modification):
<android.support.constraint.ConstraintLayout 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">
<FrameLayout
android:background="#android:color/holo_green_dark"
android:layout_width="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="2:1">
</FrameLayout>
</android.support.constraint.ConstraintLayout>
Further Edit:
It seems I need to wrap one more layer of constraint layout for my inner contents .... :
<android.support.constraint.ConstraintLayout 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">
<FrameLayout
android:background="#android:color/holo_green_dark"
android:layout_width="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="2:1">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<actual contents here..../>
</android.support.constraint.ConstraintLayout>
</FrameLayout>
</android.support.constraint.ConstraintLayout>
Or, just remove the FrameLayout, and wrap ConstraintLayout inside a ConstraintLayout:
<android.support.constraint.ConstraintLayout 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">
<android.support.constraint.ConstraintLayout
android:background="#android:color/holo_green_dark"
android:layout_width="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="2:1">
contents here...
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>

You need inner view for that, for example:
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<FrameLayout
android:background="#color/colorPrimary"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="1:1">
<YOUR CONTENT>
</FrameLayout>

For a ListView, you'd need to inflate a custom list_item.xml
and this should be H,2:1, to constrain the height to a 2:1 aspect ratio.
The default android.R.layout.simple_list_item_1 is just a TextView:
<?xml version="1.0" encoding="utf-8"?>
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/text1"
android:layout_height="0dp"
android:layout_width="0dp"
app:layout_constraintDimensionRatio="H,2:1"
...
/>
see DimensionConstraints.

Align FrameLayout inside ConstraintLayout to bottom

I want a layout above recycler view at the bottom of the screen,(like a frame) so that even when that layout is visible I can still scroll recycler view behind it. So I want to align the frame layout at the bottom of the screen and make it visible and invisible as per requirement. Here is my code.
<?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"
tools:context="com.protossoft.root.aesencryption.MainActivity">
<ListView
android:layout_width="match_parent"
android:id="#+id/listView"
android:layout_height="match_parent">
</ListView>
<!-- <RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">-->
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="443dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:gravity="center"
android:orientation="horizontal">
<ImageView
android:id="#+id/deviceNumberImage"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.2"
android:src="#android:drawable/btn_default" />
<TextView
android:id="#+id/deviceNumber"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.8"
android:text="990000862471854" />
</LinearLayout>
</FrameLayout>
<!-- </RelativeLayout>-->
I don't have too much of idea about constraint layout, but when I am moving the view at the bottom from the editor, it is using property like
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="443dp"
I want to achieve the same with some property like align_parentBottom. But none of the properties is available for use. What do I need to do so that the frame layout is visible at the bottom and on the top of recycler view at the same time?
Thanks :)

I want to achieve the same with some property like align_parentBottom.
You should use app:layout_constraintBottom_toBottomOf="parent" attribute.
Here's the setup that you need:
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
...
</FrameLayout>
</android.support.constraint.ConstraintLayout>

Layout nesting problems in Android

I have a scrollview which acts wierd when scrolling. I have to scroll twice before the scrollview starts scrolling. This below is how my nesting is done. Does this nesting look alright, or is it bad? I tried rearranging the layouts but I couldnt stop the "two-time" scrolling problem I have.
first layout: (this one is inside a constraint layout)
//views before
<ScrollView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="8dp"
android:layout_marginTop="8dp"
app:layout_constraintBottom_toTopOf="#+id/yahoo_view"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/cond_const"
android:id="#+id/scrollView2"
android:scrollbars="none">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include
layout="#layout/scroll_content"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</ScrollView>
//views after
Second layout:
<ScrollView 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"
xmlns:custom="http://schemas.android.com/tools"
android:id="#+id/scrollview3">
<android.support.constraint.ConstraintLayout
android:id="#+id/forecast_constraint"
android:layout_width="match_parent"
android:layout_height="wrap_content">
//all this layout-files views here
</android.support.constraint.ConstraintLayout>
</ScrollView>
EDIT:

maybe I am misunderstanding, but you want the screen to scroll in both directions?
if not, then don't nest a scrollview inside a scrollview.
Either is probably obsolete. removing your for now.
try just
<ScrollView 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"
xmlns:custom="http://schemas.android.com/tools"
android:id="#+id/scrollview">
<android.support.constraint.ConstraintLayout
android:id="#+id/forecast_constraint"
android:layout_width="match_parent"
android:layout_height="wrap_content">
//all this layout-files views here
</android.support.constraint.ConstraintLayout>
</ScrollView>