CODEWITHSUNDEEP
androidandroid-coordinatorlayout
amit bansode
amit bansode

Reputation: 339

How to make Coordinator Layout Scrollable?

I have used Coordinator Layout as a parent layout for anchoring one image and Linear layout as a child. So may question is how can i make screen Scrollable? Linear Layout is divided into two child with weights. Please find the xml code below:

I have tried this with Nested Scroll view and normal scroll view, but screen division get disturbed which is done with linear layout weight sum property.

<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="@drawable/bg_welcome">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:weightSum="10"
    tools:context="com.rblbank.mobank.chequebook.fragments.NewChequeBookFragment">

    <TextView
        android:id="@+id/tvNewChequeBook"
        style="?attr/title_1"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="4"
        android:gravity="center"
        android:padding="@dimen/activity_horizontal_margin"
        android:text="@string/new_cheque_book_title_note"
        android:textAppearance="@style/Base.TextAppearance.AppCompat.Medium" />


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="6"
        android:background="@color/white_color"
        android:gravity="center_vertical"
        android:orientation="vertical"
        android:padding="@dimen/padding_12">

        <TextView
            android:id="@+id/tvNewChequeBookInvestmentAccountTitle"
            style="?attr/title_1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/activity_horizontal_margin"
            android:text="@string/investment_account"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
            android:textColor="@color/black_color" />

        <TextView
            android:id="@+id/tvNewChequeBookInvestmentAccount"
            style="?attr/newChequeBookInvestmentAccount"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/activity_horizontal_margin"
            android:textColor="@color/arrow_grey" />

        <View
            android:id="@+id/vwAccountDetailsHorizontalDivider"
            android:layout_width="match_parent"
            android:layout_height="@dimen/divider_width"
            android:layout_marginBottom="@dimen/minimum_margin"
            android:layout_marginTop="@dimen/minimum_margin"
            android:background="@color/home_functionality_divider" />

        <TextView
            android:id="@+id/tvNewChequeBookAddressNote"
            style="?attr/newChequeBookAddressNoteStyle"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/activity_horizontal_margin" />


        <TextView
            android:id="@+id/tvNewChequeBookAddress"
            style="?attr/newChequeBookAddress"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/activity_horizontal_margin" />

        <Button
            android:id="@+id/btnewChequeBookDeliverCheque"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/activity_horizontal_margin"
            android:text="@string/deliver_cheque_book_to_above_address" />

        <TextView
            android:id="@+id/tvNewChequeBookAddressChanged"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/activity_horizontal_margin"
            android:text="@string/postal_address_has_changed" />

    </LinearLayout>
</LinearLayout>


<ImageView
    android:id="@+id/ivNewChequeBookPostBox"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/ic_action_submit"
    app:layout_anchor="@id/tvNewChequeBook"
    app:layout_anchorGravity="center_horizontal|bottom"
    app:layout_behavior="com.rblbank.mobank.ScrollAwareFABBehavior" />
</android.support.design.widget.CoordinatorLayout>

Upvotes: 0

Views: 8053

Answers (2)

Omar Hayat
Omar Hayat

Reputation: 378

use scroll view like this

<CoordinatorLayout>

 <ScrollView 
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:fillViewport="true">

   <LinearLayout>

   </LinearLayout>

  </ScrollView>
<CoordinatorLayout>

Upvotes: 0

Sharath kumar
Sharath kumar

Reputation: 4132

Make your layout like this.

   <CoordinatorLayout>
       <AppBarLayout>

       //Toolbar and other contents will come here

      </AppBarLayout>

    <Recycler Or Nested Scroll View>

       <LinearLayout
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

     //This is used when you have a collapsing toolbar and you need to add a scrolling behaviour for your views.

       <LinearLayout/>

   <Recycler Or Nested Scroll View/>

Also if you are not using collapsing toolbar or other animations you can add the views inside AppBarLayout itself.

Upvotes: 5

Related Questions