谷歌地图与CollapsingToolbar和NestedScrollView [英] Google Map with CollapsingToolbar and NestedScrollView

查看:306
本文介绍了谷歌地图与CollapsingToolbar和NestedScrollView的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在开发像UBER这样的应用程序。自定义标记的第一个滚动在地图上工作正常。之后,我加入了像UBER一样的NestedScrollView。但是地图滚动手势与AppBar滚动行为冲突。
我不知道该怎么做,请帮助我。

截图

< a href =https://i.stack.imgur.com/KxR2C.png =nofollow noreferrer> 这个是我的代码。



home_fragment .xml

 <?xml version =1.0encoding =utf-8?>< ;?xml version =1.0encoding =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>

<! - 地图布局从这里开始 - >
< 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>

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

$ b< 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 垂直 >

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 =设置您的位置
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>

$ b $< 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 =垂直
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 =#Button
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 =获取位置 =@ color / app_textcolor
android:textSize =@ dimen / text_size_small/>
< / LinearLayout>
< / FrameLayout>
<! - 地图布局结束于此 - >

< /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 (上下文);
}

@Override
public boolean dispatchTouchEvent(MotionEvent event){

switch(event.getAction()){

case MotionEvent.ACTION_DOWN:
HomeFragment.mMapIsTouched = true;
休息;

case MotionEvent.ACTION_UP:
HomeFragment.mMapIsTouched = false;
休息;
}
返回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);
返回mTouchView;
}

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

HomeFragment

  googleMap.setOnCameraChangeListener(new GoogleMap.OnCameraChangeListener(){
$ b $ @Override
public void onCameraChange CameraPosition arg0){
// TODO自动生成的方法存根
if(!mMapIsTouched){
//显示外部布局
CommonMethods.getInstance()。e(, );
googleMap.getUiSettings()。setAllGesturesEnabled(true);
}
else {
//隐藏外部布局
CommonMethods。 getInstance()。e(,User is touching MAP);
googleMap.getUiSettings()。setAllGesturesEnabled(false);
}

}
});


解决方案

经过漫长的搜索,我发现设计中存在错误图书馆,它已经 报告



其中提到,在AppBarLayout中的可滚动容器从来没有正式发布过
支持。



如果下一个版本查看AppBarLayout.Behavior.DragCallback
,可以根据需要禁用拖动处理。


这个 DragCallback 方法可以停止appbar布局内容的拖动效果,并且<$ c

pre $ AppBarLayout appBarLayout =(AppBarLayout)findViewById(R。)$ {$ c> NestedScrollView 像魅力一样工作。 id.appbar_layout);
CoordinatorLayout.LayoutParams params =
(CoordinatorLayout.LayoutParams)appBarLayout.getLayoutParams();
AppBarLayout.Behavior behavior = new AppBarLayout.Behavior();
behavior.setDragCallback(new AppBarLayout.Behavior.DragCallback(){
@Override
public boolean canDrag(AppBarLayout appBarLayout){
return false;
}
});


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

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);
                }

            }
        });

解决方案

After long search i found that there is bug in design library and it is already reported

Its mentioned there that

Scrollable containers in an AppBarLayout have never been officially supported.

If the next release have a look at AppBarLayout.Behavior.DragCallback which allows you to disable the drag handling if you need.

This DragCallback method stop drag effect in appbar layout content and NestedScrollView is working like charm.

AppBarLayout appBarLayout = (AppBarLayout) findViewById(R.id.appbar_layout);
    CoordinatorLayout.LayoutParams params = 
            (CoordinatorLayout.LayoutParams) appBarLayout.getLayoutParams();
    AppBarLayout.Behavior behavior = new AppBarLayout.Behavior();
    behavior.setDragCallback(new AppBarLayout.Behavior.DragCallback() {
        @Override
        public boolean canDrag(AppBarLayout appBarLayout) {
            return false;
        }
    });

这篇关于谷歌地图与CollapsingToolbar和NestedScrollView的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆