当我在viewPager中滚动recyclerView时,我希望能够滚动布局的上半部分(带有名称,图像,追随者/跟随的文本视图...),因此我读到可以使用NestedScrollView来实现这一点,所以我将NestedScrollView作为我的根布局:
NestedScrollView:
-----------------ConstraintLayout:
---------------------------------rest of the views as in picture above
我还在NEstedScrollView中添加了android:fillViewport =“ true”,因为这解决了缺少视图分页器的麻烦。 因此,问题在于滚动视图不起作用,一切与使用nestedScrollView之前相同,而在滚动recyclerView时,布局的底部不会滚动屏幕。没有人知道为什么,我使用嵌套的scrollView是错误的吗,我还没有找到可以解决我的问题的示例,并且文档真的很糟糕。 我的布局的XML代码:
<androidx.core.widget.NestedScrollView
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:fillViewport="true">
<androidx.constraintlayout.widget.ConstraintLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.appcompat.widget.Toolbar
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:theme="?attr/actionBarTheme"
android:minHeight="?attr/actionBarSize"
android:elevation="4dp"
android:id="@+id/title"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:title="UserName"
app:layout_constraintEnd_toEndOf="parent"/>
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/profile_image"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_margin="8dp"
app:srcCompat="@drawable/ic_profile_24dp"
tools:src="@drawable/ic_profile_24dp"
app:civ_border_color="@color/primaryLightColor"
app:civ_border_width="1dp" android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="@+id/title" android:layout_marginStart="8dp"
app:layout_constraintStart_toStartOf="parent" android:layout_marginLeft="8dp"/>
<TextView
android:layout_width="0dp"
android:layout_height="0dp"
android:id="@+id/textView"
app:layout_constraintEnd_toEndOf="parent"
android:layout_marginEnd="8dp" android:layout_marginRight="8dp"
app:layout_constraintStart_toEndOf="@+id/profile_image" android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
app:layout_constraintBottom_toBottomOf="@+id/profile_image"
app:layout_constraintTop_toTopOf="@+id/profile_image"
tools:text="Short description "/>
<TextView
android:id="@+id/questions_label"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:text="@string/questions"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="@+id/profile_image" app:layout_constraintStart_toStartOf="parent"
android:layout_marginLeft="8dp" android:layout_marginStart="8dp"
app:layout_constraintHorizontal_bias="0.5" app:layout_constraintEnd_toStartOf="@+id/followers_label"/>
<TextView
android:id="@+id/questions_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="18sp"
android:textStyle="bold"
tools:text="0"
app:layout_constraintTop_toBottomOf="@+id/questions_label"
app:layout_constraintEnd_toEndOf="@+id/questions_label"
app:layout_constraintStart_toStartOf="@+id/questions_label"/>
<TextView
android:id="@+id/followers_label"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:text="@string/followers"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="@+id/profile_image"
app:layout_constraintStart_toEndOf="@+id/questions_label" android:layout_marginStart="8dp"
android:layout_marginLeft="8dp" android:layout_marginEnd="8dp"
app:layout_constraintEnd_toStartOf="@+id/following_label" android:layout_marginRight="8dp"
app:layout_constraintHorizontal_bias="0.5"/>
<TextView
android:id="@+id/following_label"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:text="@string/following"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="@+id/profile_image" android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent" android:layout_marginRight="8dp"
app:layout_constraintStart_toEndOf="@+id/followers_label" app:layout_constraintHorizontal_bias="0.5"/>
<TextView
android:id="@+id/followers_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="18sp"
android:textStyle="bold"
tools:text="0"
app:layout_constraintEnd_toEndOf="@+id/followers_label"
app:layout_constraintStart_toStartOf="@+id/followers_label"
app:layout_constraintTop_toBottomOf="@+id/followers_label"/>
<TextView
android:id="@+id/following_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="18sp"
android:textStyle="bold"
tools:text="0"
app:layout_constraintEnd_toEndOf="@+id/following_label"
app:layout_constraintStart_toStartOf="@+id/following_label"
app:layout_constraintTop_toBottomOf="@+id/following_label"/>
<com.google.android.material.tabs.TabLayout
android:id="@+id/sliding_tabs"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="@color/primaryLightColor"
app:tabMode="fixed" app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="@+id/followers_number"/>
<androidx.viewpager.widget.ViewPager
android:id="@+id/view_pager"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@android:color/white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/sliding_tabs" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
建议后的编辑:代码:
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.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">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:theme="?attr/actionBarTheme"
android:minHeight="?attr/actionBarSize"
android:id="@+id/title"
tools:title="UserName"/>
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<androidx.constraintlayout.widget.ConstraintLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/profile_image"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginStart="@dimen/spacing_normal"
android:layout_marginLeft="@dimen/spacing_normal"
android:layout_marginTop="@dimen/spacing_normal"
app:civ_border_color="@color/secondaryDarkColor"
app:civ_border_width="1dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/ic_profile_24dp"
tools:src="@drawable/ic_profile_24dp" />
<com.google.android.material.textview.MaterialTextView
android:layout_width="0dp"
android:layout_height="0dp"
android:id="@+id/description"
android:layout_marginEnd="@dimen/spacing_normal"
android:layout_marginRight="@dimen/spacing_normal"
android:layout_marginLeft="@dimen/spacing_normal"
android:layout_marginStart="@dimen/spacing_normal"
app:layout_constraintStart_toEndOf="@+id/profile_image"
app:layout_constraintEnd_toEndOf="parent" app:layout_constraintBottom_toBottomOf="@+id/profile_image"
app:layout_constraintTop_toTopOf="@+id/profile_image"
tools:text="Short description "/>
<include
layout="@layout/qff_layout"
android:id="@+id/qff_layout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/spacing_small"
app:layout_constraintTop_toBottomOf="@+id/profile_image"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"/>
<com.google.android.material.tabs.TabLayout
android:id="@+id/sliding_tabs"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="@color/primaryLightColor"
app:tabMode="fixed"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/qff_layout"/>
<androidx.viewpager.widget.ViewPager
android:id="@+id/view_pager"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@android:color/white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/sliding_tabs" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
这是怎么回事,它没有任何意义,除了ViewPager之外没有任何滚动内容
答案 0 :(得分:2)
您知道NestedScrollView有一个孩子,如果想要布局的滚动行为,则他的孩子的身高必须为wrap_content
。
在第一个布局中,必须将ConstraintLayout
的高度设置为wrap_content
,但是如果出于某种原因(例如,要绑定布局底部的ViewPager),您必须使用建议的答案(这意味着您必须使用match_parent
),但要考虑以下因素:
1-您应该将要滚动的所有内容放入CoordinatorLayout
。此布局从AppbarLayout
扩展而来,可以轻松地将其放入其中。从您的问题来看,我认为您想滚动LinearLayout
上方的所有内容,但可以根据需要进行更改。
(注意:实际上,我建议将ViewPager
用作CollapsingToolbar
的子对象,然后将其放入其中,但对于您的问题,这也很好用)
2-将AppbarLAyout
属性添加到app:layout_scrollFlags="scroll"
内的内容的根中
3-将AppbarLayout
属性添加到app:layout_behavior="@string/appbar_scrolling_view_behavior"
的同级中。在您的问题中,您可以在AppbarLayout
中使用此属性。
这是我的代码:
NestedScrollView
我没有尝试过这段代码,但是我很确定这对您有用:)
答案 1 :(得分:0)
在NestedScrollView中放置
app:layout_behavior="@string/appbar_scrolling_view_behavior"
答案 2 :(得分:0)
您尝试过这个吗?
<CoordinatorLayout>
...<AppbarLayout>
......<Toolbar/>
...</AppbarLayout>
...<NestedScrollView> (set height and weight to match parent, then set fillViewPort="true" and for the last give layout_behavior="@string/appbar_scrolling_view_behavior")
......<ConstraintLayout> (change height to wrap_content because you don't need to set match parent, its already handled by nestedscrollview as a parent)
.........(All Child Components)
......</ConstraintLayout>
...</NestedScrollView>
</CoordinatorLayout>
官方文档FillViewPort作为NestedScrollView,属性是将内容的高度拉伸到视口边界。请检查官方文件以获得更好的解释: NestedScrollView - FillViewPort
更新: 根据您当前的代码,我进行了一些更改,请检查一下。
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.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">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:theme="?attr/actionBarTheme"
android:minHeight="?attr/actionBarSize"
android:id="@+id/title"
tools:title="UserName"/>
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/profile_image"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginStart="@dimen/spacing_normal"
android:layout_marginLeft="@dimen/spacing_normal"
android:layout_marginTop="@dimen/spacing_normal"
app:civ_border_color="@color/secondaryDarkColor"
app:civ_border_width="1dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/ic_profile_24dp"
tools:src="@drawable/ic_profile_24dp" />
<com.google.android.material.textview.MaterialTextView
android:layout_width="0dp"
android:layout_height="0dp"
android:id="@+id/description"
android:layout_marginEnd="@dimen/spacing_normal"
android:layout_marginRight="@dimen/spacing_normal"
android:layout_marginLeft="@dimen/spacing_normal"
android:layout_marginStart="@dimen/spacing_normal"
app:layout_constraintStart_toEndOf="@+id/profile_image"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="@+id/profile_image"
app:layout_constraintTop_toTopOf="@+id/profile_image"
tools:text="Short description "/>
<include
layout="@layout/qff_layout"
android:id="@+id/qff_layout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/spacing_small"
app:layout_constraintTop_toBottomOf="@+id/profile_image"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"/>
<com.google.android.material.tabs.TabLayout
android:id="@+id/sliding_tabs"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="@color/primaryLightColor"
app:tabMode="fixed"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/qff_layout"/>
<androidx.viewpager.widget.ViewPager
android:id="@+id/view_pager"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@android:color/white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/sliding_tabs" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
答案 3 :(得分:0)
您的内容适合您的显示区域。这就是它发生的原因。为此,您必须设置ViewPager的固定高度。之后,整个布局滚动。但这不是一个适当的解决方案。
示例
设置ViewPager的高度 500dp 并进行检查。
答案 4 :(得分:0)
我使用HorizontalScrollView
作为上部布局的容器:
<ConstraintLayout>
<Toolbar/>
<HorizontalScrollView>
<ConstraintLayout android:id="@+id/top_container">
<!-- your upper widgets here -->
</ConstraintLayout>
</HorizontalScrollView>
<TabLayout/>
<ViewPager/>
</ConstraintLayout>
当用户滚动ViewPager
时,它将回调ViewPager.OnPageChangeListener.onPageScrolled()。
您可以覆盖它,以通过HorizontalScrollView.setScrollX()方法(从基类View
继承)以编程方式滚动上部布局:
class ScrollListener implements ViewPager.OnPageChangeListener {
private ViewGroup scrollView;
ScrollListener(ViewGroup scrollView) {
this.scrollView = scrollView;
}
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
scrollView.setScrollX(scrollView.getWidth() * position + positionOffsetPixels);
}
// the interface requires to override 2 more methods:
@Override
public void onPageSelected(int position) {}
@Override
public void onPageScrollStateChanged(int state) {}
}
然后在MainActivity
中,必须通过ViewPager.addOnPageChangeListener()将此监听器设置为ViewPager
:
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ViewGroup scrollView = findViewById(R.id.top_scroll);
ViewPager viewPager = findViewById(R.id.view_pager);
viewPager.addOnPageChangeListener(new ScrollListener(scrollView));
viewPager.setAdapter(new MyAdapter(getApplicationContext(), 3));
}
注意::该代码将压缩上部布局,因为HorizontalScrollView
不使用屏幕边界进行度量和布局。因此,它允许您将小部件放在屏幕之外(screenshot)并具有滚动功能。
在您的情况下,屏幕上没有小部件,因此您不会看到结果,因为没有任何可滚动的内容。为了进行测试,我在MainActivity
中添加了几行以拉伸上部布局:
Point size = new Point();
getWindowManager().getDefaultDisplay().getSize(size);
ConstraintLayout upperLayout = findViewById(R.id.top_container);
upperLayout .setMinWidth(size.x + 400);
我的git源代码示例:link(我删除了触摸滚动的上部布局)
希望这会有所帮助,祝您好运!