Google Map with CollapsingToolbar and NestedScrollView

Viewed 3289

I am developing app like UBER. First scrolling of custom marker was working fine on map. After that i added NestedScrollView just like UBER. But map scrolling gesture is conflicting with AppBar Scrolling behaviour. I don't know what to do, please help me out.

Screenshot

enter image description here

This is my Code.

home_fragment.xml

<?xml version="1.0" encoding="utf-8"?><?xml version="1.0" encoding="utf-8"?>

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

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsing_toolbar"
        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|snap">

        <!-- Map Layout starts here -->
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_collapseMode="parallax">

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

                <fragment
                    android:id="@+id/map"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    class="com.anuj.retrofitparsing.customClasses.MySupportMapFragment"></fragment>


                <ImageView
                    android:id="@+id/mylocation"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentBottom="true"
                    android:layout_alignParentRight="true"
                    android:layout_margin="@dimen/activity_margin_16"
                    android:padding="@dimen/activity_margin_10"
                    android:src="@drawable/mylocation" />

                <LinearLayout
                    android:id="@+id/locationMarker"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerInParent="true"
                    android:layout_gravity="center"
                    android:layout_marginBottom="30dp"
                    android:gravity="center"
                    android:orientation="vertical">

                    <TextView
                        android:id="@+id/locationMarkertext"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:background="@drawable/setlocation_bg"
                        android:gravity="center"
                        android:minWidth="180dp"
                        android:padding="@dimen/activity_margin_5"
                        android:paddingLeft="2dp"
                        android:paddingRight="2dp"
                        android:text=" Set your Location "
                        android:textColor="@color/white" />

                    <ImageView
                        android:id="@+id/imageView1"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:src="@drawable/add_marker" />
                </LinearLayout>
            </RelativeLayout>


            <LinearLayout
                android:id="@+id/search_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="top"
                android:layout_margin="@dimen/activity_margin_16"
                android:background="@drawable/searchbar_bg"
                android:orientation="vertical"
                android:padding="@dimen/activity_margin_5">

                <TextView
                    android:id="@+id/textView1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="10dp"
                    android:text="Selected Location"
                    android:textAppearance="?android:attr/textAppearanceSmall"
                    android:textColor="#28b54c"
                    android:textSize="@dimen/text_size" />

                <TextView
                    android:id="@+id/adressText"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="10dp"
                    android:ellipsize="end"
                    android:singleLine="true"
                    android:text="Getting location"
                    android:textColor="@color/app_textcolor"
                    android:textSize="@dimen/text_size_small" />
            </LinearLayout>
        </FrameLayout>
        <!-- Map Layout Ends here -->

    </android.support.design.widget.CollapsingToolbarLayout>

</android.support.design.widget.AppBarLayout>

<android.support.v4.widget.NestedScrollView
    android:id="@+id/nScrollView"
    android:layout_width="match_parent"
    android:layout_height="120dp"
    android:layout_alignParentBottom="true"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

</android.support.v4.widget.NestedScrollView>

TouchableWrapper.java

public class TouchableWrapper extends FrameLayout {
    public TouchableWrapper(Context context) {
        super(context);
    }

    @Override
    public boolean dispatchTouchEvent(MotionEvent event) {

        switch (event.getAction()) {

            case MotionEvent.ACTION_DOWN:
                HomeFragment.mMapIsTouched = true;
                break;

            case MotionEvent.ACTION_UP:
                HomeFragment.mMapIsTouched = false;
                break;
        }
        return super.dispatchTouchEvent(event);
    }
}

MySupportMapFragment

public class MySupportMapFragment extends SupportMapFragment {
    public View mOriginalContentView;
    public TouchableWrapper mTouchView;

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup parent, Bundle savedInstanceState) {
        mOriginalContentView = super.onCreateView(inflater, parent, savedInstanceState);
        mTouchView = new TouchableWrapper(getActivity());
        mTouchView.addView(mOriginalContentView);
        return mTouchView;
    }

    @Override
    public View getView() {
        return mOriginalContentView;
    }
}

HomeFragment

googleMap.setOnCameraChangeListener(new GoogleMap.OnCameraChangeListener() {

            @Override
            public void onCameraChange(CameraPosition arg0) {
                // TODO Auto-generated method stub
                if (!mMapIsTouched) {
                    // Show Outer layout
                    CommonMethods.getInstance().e("","User Is not touching MAP");
                    googleMap.getUiSettings().setAllGesturesEnabled(true);
                }
                else{
                    // Hide Outer Layout
                    CommonMethods.getInstance().e("", "User Is touching MAP");
                    googleMap.getUiSettings().setAllGesturesEnabled(false);
                }

            }
        });
1 Answers
Related