Coordinator Layout Scrolling behaving weirdly

Question

I have created a fragment layout with a coordinator layout. Attached is the screenshot of the page

Now while scrolling the app, the page doesn't scroll smoothly and gets stuck after the image and then it scrolls again. Same occurs when scrolling upwards.

Another problem that I am facing is to scroll to top of the page programmatically. I am able to get to the top of the nested scroll view but em unable to scroll to top of the entire page via code. Please help. Here is my layout xml structure:

<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"
    xmlns:fab="http://schemas.android.com/apk/res-auto"
    tools:context=".fragments.InsightsFragment">


    <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/coordinator_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/background_light"
        android:fitsSystemWindows="true">

        <android.support.design.widget.AppBarLayout
            android:id="@+id/main.appbar"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            android:fitsSystemWindows="true"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

            <android.support.design.widget.CollapsingToolbarLayout
                android:id="@+id/main.collapsing"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:fitsSystemWindows="true"
                app:contentScrim="?attr/colorPrimary"
                app:expandedTitleMarginEnd="64dp"
                app:expandedTitleMarginStart="48dp"
                app:layout_scrollFlags="scroll|exitUntilCollapsed">

                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">

                    <ImageView
                        android:id="@+id/main.backdrop"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:background="@drawable/dummy_img"
                        android:contentDescription="@string/insight_image"
                        android:fitsSystemWindows="true"
                        android:scaleType="centerCrop"
                        app:layout_collapseMode="parallax" />

                    <RelativeLayout
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:background="@color/medium_overlay">
                    </RelativeLayout>

                    <TextView
                        android:id="@+id/insight_title"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_centerVertical="true"
                        android:padding="16dp"
                        android:text="@string/insight_title"
                        android:textSize="28sp"
                        android:textStyle="bold" />

                    <TextView
                        android:id="@+id/insight_date"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_alignParentBottom="true"
                        android:layout_alignParentStart="false"
                        android:layout_alignParentLeft="true"
                        android:layout_alignParentTop="false"
                        android:padding="16dp"
                        android:text="@string/date" />

                    <TextView
                        android:id="@+id/insight_tag"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentBottom="true"
                        android:layout_alignParentEnd="true"
                        android:layout_alignParentRight="true"
                        android:background="@color/primary_overlay"
                        android:padding="16dp"
                        android:text="@string/tag"
                        tools:ignore="RelativeOverlap" />
                </RelativeLayout>
            </android.support.design.widget.CollapsingToolbarLayout>
        </android.support.design.widget.AppBarLayout>

        <android.support.v4.widget.NestedScrollView
            android:id="@+id/nested_scroll_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <TextView
                    tools:text="content"
                    android:id="@+id/insight_content"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:fontFamily="sans-serif-light"
                    android:lineSpacingExtra="6dp"
                    android:padding="16dp"
                    android:text="@string/lorem"
                    android:textSize="16sp" />

                <View
                    android:layout_width="match_parent"
                    android:layout_height="1dp"
                    android:background="@android:color/darker_gray" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical"
                    android:paddingBottom="60dp">


                    <RelativeLayout
                        android:id="@+id/previous_insight"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:padding="16dp">

                        <TextView
                            android:id="@+id/previous"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_alignParentLeft="true"
                            android:layout_alignParentStart="true"
                            android:layout_marginBottom="6dp"
                            android:text="@string/previous" />

                        <TextView
                            android:id="@+id/previous_insight_title"
                            android:layout_width="250dp"
                            android:layout_height="wrap_content"
                            android:layout_alignParentLeft="true"
                            android:layout_alignParentStart="true"
                            android:layout_below="@+id/previous"
                            android:text="@string/previous_insight_title"
                            android:textSize="20sp" />
                        <ImageView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_alignParentEnd="true"
                            android:layout_alignParentRight="true"
                            android:layout_below="@id/previous"
                            android:contentDescription="@string/left_arrow"
                            android:src="@drawable/ic_arrow_left" />

                    </RelativeLayout>

                    <RelativeLayout
                        android:id="@+id/next_insight"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:padding="16dp">

                        <TextView
                            android:id="@+id/up_next"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_alignParentLeft="true"
                            android:layout_alignParentStart="true"
                            android:layout_marginBottom="6dp"
                            android:text="@string/up_next" />

                        <TextView
                            android:id="@+id/next_insight_title"
                            android:layout_width="250dp"
                            android:layout_height="wrap_content"
                            android:layout_alignParentLeft="true"
                            android:layout_alignParentStart="true"
                            android:layout_below="@+id/up_next"
                            android:text="@string/next_insight_title"
                            android:textColor="@color/colorPrimary"
                            android:textSize="20sp" />

                        <ImageView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_alignParentEnd="true"
                            android:layout_alignParentRight="true"
                            android:layout_below="@id/up_next"
                            android:contentDescription="@string/right_arrow"
                            android:src="@drawable/ic_arrow_right" />

                    </RelativeLayout>


                </LinearLayout>

            </LinearLayout>
        </android.support.v4.widget.NestedScrollView>
    </android.support.design.widget.CoordinatorLayout>

    <com.github.clans.fab.FloatingActionMenu
        android:id="@+id/material_design_android_floating_action_menu"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingBottom="16dp"
        android:paddingEnd="16dp"
        android:paddingLeft="0dp"
        android:paddingRight="16dp"
        android:paddingStart="0dp"
        fab:menu_animationDelayPerItem="55"
        fab:menu_backgroundColor="@color/white_overlay"
        fab:menu_buttonSpacing="0dp"
        fab:menu_colorNormal="@color/colorAccent"
        fab:menu_colorPressed="@color/colorAccent"
        fab:menu_colorRipple="#99d4d4d4"
        fab:menu_fab_size="normal"
        fab:menu_icon="@drawable/fab_add"
        fab:menu_labels_colorNormal="#333"
        fab:menu_labels_colorPressed="#444"
        fab:menu_labels_colorRipple="#66efecec"
        fab:menu_labels_cornerRadius="3dp"
        fab:menu_labels_ellipsize="none"
        fab:menu_labels_hideAnimation="@anim/fab_slide_out_to_right"
        fab:menu_labels_margin="0dp"
        fab:menu_labels_maxLines="-1"
        fab:menu_labels_padding="8dp"
        fab:menu_labels_position="left"
        fab:menu_labels_showAnimation="@anim/fab_slide_in_from_right"
        fab:menu_labels_showShadow="true"
        fab:menu_labels_singleLine="false"
        fab:menu_labels_textColor="#f2f1f1"
        fab:menu_labels_textSize="15sp"
        fab:menu_openDirection="up"
        fab:menu_shadowColor="#66aff198"
        fab:menu_shadowRadius="4dp"
        fab:menu_shadowXOffset="1dp"
        fab:menu_shadowYOffset="4dp"
        fab:menu_showShadow="false">

        <com.github.clans.fab.FloatingActionButton
            android:id="@+id/material_design_floating_action_menu_item1"
            style="@style/MenuButtonsStyle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_font_size"
            fab:fab_label="Increase font" />

        <com.github.clans.fab.FloatingActionButton
            android:id="@+id/material_design_floating_action_menu_item2"
            style="@style/MenuButtonsStyle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_favorite"
            fab:fab_label="Favorite" />

        <com.github.clans.fab.FloatingActionButton
            android:id="@+id/material_design_floating_action_menu_item3"
            style="@style/MenuButtonsStyle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_share"
            fab:fab_label="Share" />
    </com.github.clans.fab.FloatingActionMenu>



</FrameLayout>

Answer 1

For your first question, I'd suggest looking at the resolution of all of your images. If they're too big, probably that's what's causing the weird scroll.

As for scrolling to the top, see here.