[英]Scrollview over the fixed image/ImageView Android
I've gone through numerous links but no luck.我经历了许多链接,但没有运气。 When I scroll (vertical) the form up, it hides under the top image.
当我向上滚动(垂直)表单时,它隐藏在顶部图像下方。 This is a fixed ImageView (height=200dp).
这是一个固定的 ImageView(高度=200dp)。 The requirement is that when I scroll up the Freight Forwarding Sea form, it should scroll over the image instead below/under the image.
要求是当我向上滚动货运海运表格时,它应该滚动图像而不是图像下方/下方。 I appreciate for prompt solution.
我感谢及时的解决方案。 Kind Regards Here is the xml:
亲切的问候这是xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
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:id="@+id/nestedScrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@color/light_grey"
tools:context=".fragments.FFSFragment">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="@drawable/sea_bg">
<ImageView
android:layout_width="match_parent"
android:layout_height="200dp"/>
</FrameLayout>
<ScrollView
android:id="@+id/scroll_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="200dp"
android:scrollbars="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@drawable/rectangle_corners_layout">
<TextView
android:id="@+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/menu_ffs"
android:textSize="25sp"
android:textColor="@android:color/black"
android:layout_marginLeft="20dp"
android:layout_marginTop="20dp"/>
<TextView
android:id="@+id/text_cb"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/fill_form"
android:textSize="16sp"
android:textColor="@android:color/black"
android:layout_marginLeft="20dp"
android:layout_marginBottom="30dp"/>
<EditText
android:id="@+id/et_origin"
style="@style/AppTheme.EditTexts"
android:hint="@string/enter_origin"
android:background="@drawable/rectangle_corners"/>
<EditText
android:id="@+id/et_destination"
style="@style/AppTheme.EditTexts"
android:hint="@string/enter_destination"
android:background="@drawable/rectangle_corners"/>
<EditText
android:id="@+id/et_commodity"
style="@style/AppTheme.EditTexts"
android:hint="@string/enter_commodity"
android:background="@drawable/rectangle_corners"/>
<EditText
android:id="@+id/et_weight"
style="@style/AppTheme.EditTexts"
android:hint="@string/enter_weight"
android:inputType="number"
android:background="@drawable/rectangle_corners"/>
<EditText
android:id="@+id/et_boxes"
style="@style/AppTheme.EditTexts"
android:hint="@string/enter_boxes"
android:inputType="number"
android:background="@drawable/rectangle_corners"/>
<EditText
android:id="@+id/et_boxe_size"
style="@style/AppTheme.EditTexts"
android:hint="@string/enter_boxsize"
android:background="@drawable/rectangle_corners"/>
<Button
android:id="@+id/choose_images_btn"
style="@style/AppTheme.RoundButtons"
android:text="@string/choose_images"/>
<Button
android:id="@+id/submit_btn"
style="@style/AppTheme.RoundButtons"
android:layout_marginBottom="20dp"
android:text="@string/submit"/>
</LinearLayout>
</ScrollView>
</RelativeLayout>
The easiest way to do this is by using MotionLayout
:最简单的方法是使用
MotionLayout
:
MotionLayout
dependency in your build.gradle(app)
:build.gradle(app)
中实现MotionLayout
依赖项: implementation "androidx.constraintlayout:constraintlayout:2.1.4"
RelativeLayout
to MotionLayout
, and ScrollView
to NestedScrollView
RelativeLayout
更改为MotionLayout
,并将ScrollView
更改为NestedScrollView
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.motion.widget.MotionLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#DDD"
android:orientation="vertical"
app:layoutDescription="@xml/activity_main_scene">
<FrameLayout
android:id="@+id/frameLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/ic_launcher_background"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:layout_width="match_parent"
android:layout_height="200dp" />
</FrameLayout>
<androidx.core.widget.NestedScrollView
android:id="@+id/scroll_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:scrollbars="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/frameLayout">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white"
android:orientation="vertical">
<TextView
android:id="@+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/menu_ffs"
android:textSize="25sp"
android:textColor="@android:color/black"
android:layout_marginLeft="20dp"
android:layout_marginTop="20dp"/>
<TextView
android:id="@+id/text_cb"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/fill_form"
android:textSize="16sp"
android:textColor="@android:color/black"
android:layout_marginLeft="20dp"
android:layout_marginBottom="30dp"/>
<EditText
android:id="@+id/et_origin"
style="@style/AppTheme.EditTexts"
android:hint="@string/enter_origin"
android:background="@drawable/rectangle_corners"/>
<EditText
android:id="@+id/et_destination"
style="@style/AppTheme.EditTexts"
android:hint="@string/enter_destination"
android:background="@drawable/rectangle_corners"/>
<EditText
android:id="@+id/et_commodity"
style="@style/AppTheme.EditTexts"
android:hint="@string/enter_commodity"
android:background="@drawable/rectangle_corners"/>
<EditText
android:id="@+id/et_weight"
style="@style/AppTheme.EditTexts"
android:hint="@string/enter_weight"
android:inputType="number"
android:background="@drawable/rectangle_corners"/>
<EditText
android:id="@+id/et_boxes"
style="@style/AppTheme.EditTexts"
android:hint="@string/enter_boxes"
android:inputType="number"
android:background="@drawable/rectangle_corners"/>
<EditText
android:id="@+id/et_boxe_size"
style="@style/AppTheme.EditTexts"
android:hint="@string/enter_boxsize"
android:background="@drawable/rectangle_corners"/>
<Button
android:id="@+id/choose_images_btn"
style="@style/AppTheme.RoundButtons"
android:text="@string/choose_images"/>
<Button
android:id="@+id/submit_btn"
style="@style/AppTheme.RoundButtons"
android:layout_marginBottom="20dp"
android:text="@string/submit"/>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.motion.widget.MotionLayout>
app:layoutDescription="@xml/activity_main_scene"
, Android studio going to give you a red error, click at red lamp to show Context Action like in the image below and press at Create xml resource fileapp:layoutDescription="@xml/activity_main_scene"
,Android studio 会给你一个红色的错误,点击红灯显示 Context Action 如下图,然后点击Create xml resource file<?xml version="1.0" encoding="utf-8"?>
<MotionScene xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:motion="http://schemas.android.com/apk/res-auto">
<Transition
motion:constraintSetEnd="@+id/end"
motion:constraintSetStart="@id/start"
motion:duration="1000">
<KeyFrameSet></KeyFrameSet>
<OnSwipe
motion:dragDirection="dragUp"
motion:touchAnchorId="@+id/scroll_view"
motion:touchAnchorSide="top" />
</Transition>
<ConstraintSet android:id="@+id/start"></ConstraintSet>
<ConstraintSet android:id="@+id/end">
<Constraint
android:id="@+id/scroll_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:scrollbars="vertical"
motion:layout_constraintBottom_toBottomOf="parent"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintHorizontal_bias="0.5"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintTop_toTopOf="@+id/frameLayout" />
</ConstraintSet>
</MotionScene>
I hope this helps , and you can read more about MotionLayout
its really helpful in this kind of situation我希望这会有所帮助,您可以阅读有关
MotionLayout
的更多信息,它在这种情况下真的很有帮助
Remove Relative layout, use FrameLayout instead删除相对布局,改用 FrameLayout
Another issue is you are providing 200dp paddingTop to Scrollview which stays even when you scroll the view and cause the issue另一个问题是您为 Scrollview 提供了 200dp paddingTop,即使您滚动视图并导致问题,它也会保持不变
You can refer to this too! 这个也可以参考!
<FrameLayout 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:id="@+id/nestedScrollView" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:background="@color/light_grey" tools:context=".fragments.FFSFragment"> <ImageView android:layout_width="match_parent" android:layout_height="200dp" android:scaleType="fitXY" android:src="@drawable/sea_bg" /> <ScrollView android:id="@+id/scroll_view" android:layout_width="match_parent" android:layout_height="match_parent" android:scrollbars="vertical"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <TextView android:layout_width="match_parent" android:layout_height="200dp" /> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:background="@drawable/rectangle_corners_layout"> <TextView android:id="@+id/title" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="@string/menu_ffs" android:textSize="25sp" android:textColor="@android:color/black" android:layout_marginLeft="20dp" android:layout_marginTop="20dp"/> <TextView android:id="@+id/text_cb" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="@string/fill_form" android:textSize="16sp" android:textColor="@android:color/black" android:layout_marginLeft="20dp" android:layout_marginBottom="30dp"/> <EditText android:id="@+id/et_origin" style="@style/AppTheme.EditTexts" android:hint="@string/enter_origin" android:background="@drawable/rectangle_corners"/> <EditText android:id="@+id/et_destination" style="@style/AppTheme.EditTexts" android:hint="@string/enter_destination" android:background="@drawable/rectangle_corners"/> <EditText android:id="@+id/et_commodity" style="@style/AppTheme.EditTexts" android:hint="@string/enter_commodity" android:background="@drawable/rectangle_corners"/> <EditText android:id="@+id/et_weight" style="@style/AppTheme.EditTexts" android:hint="@string/enter_weight" android:inputType="number" android:background="@drawable/rectangle_corners"/> <EditText android:id="@+id/et_boxes" style="@style/AppTheme.EditTexts" android:hint="@string/enter_boxes" android:inputType="number" android:background="@drawable/rectangle_corners"/> <EditText android:id="@+id/et_boxe_size" style="@style/AppTheme.EditTexts" android:hint="@string/enter_boxsize" android:background="@drawable/rectangle_corners"/> <Button android:id="@+id/choose_images_btn" style="@style/AppTheme.RoundButtons" android:text="@string/choose_images"/> <Button android:id="@+id/submit_btn" style="@style/AppTheme.RoundButtons" android:layout_marginBottom="20dp" android:text="@string/submit"/> </LinearLayout> </LinearLayout> </ScrollView> </FrameLayout>
I Hope this answer Helps You!我希望这个答案对你有帮助!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.