在Android中将滚动视图应用于框架布局

时间:2018-11-29 10:45:41

标签: android scrollview

这是注册和登录的布局。如何仅使注册表单可滚动,尤其是对于小屏幕?我尝试添加ScrollView,但似乎不起作用。我正在使用TabLayout在片段之间进行切换。片段布局夸大了ID为“ container_frame”的FrameLayout。这是我的XML布局

<?xml version="1.0" encoding="utf-8"?>
        <FrameLayout
            android:id="@+id/frameLayout_top"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            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"
            tools:context=".RegisterActivity">

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/mother_daughter" />

            <android.support.constraint.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <TextView
                    android:id="@+id/txtview_please_sign_up"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="16dp"
                    android:layout_marginTop="32dp"
                    android:text="@string/PLEASE_SIGN_UP"
                    android:textColor="@color/white"
                    android:textSize="20sp"
                    android:textStyle="bold"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent" />

                <TextView
                    android:id="@+id/textView5"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="8dp"
                    android:text="@string/to_add_your_review"
                    android:textColor="@color/white"
                    android:textSize="18sp"
                    android:textStyle="bold"
                    app:layout_constraintStart_toStartOf="@+id/txtview_please_sign_up"
                    app:layout_constraintTop_toBottomOf="@+id/txtview_please_sign_up" />

                <Button
                    android:id="@+id/facebook"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="8dp"
                    android:layout_marginTop="32dp"
                    android:layout_marginEnd="8dp"
                    android:background="#3b5998"
                    android:minWidth="64dp"
                    android:paddingStart="16dp"
                    android:paddingEnd="16dp"
                    android:text="@string/log_in_with_facebook"
                    android:textColor="@color/white"
                    android:textSize="12sp"
                    android:theme="@style/Theme.MaterialComponents"
                    app:layout_constraintEnd_toStartOf="@+id/Google"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toBottomOf="@+id/textView5" />

                <Button
                    android:id="@+id/Google"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_marginEnd="8dp"
                    android:background="#D44638"
                    android:minWidth="64dp"
                    android:paddingStart="16dp"
                    android:paddingEnd="16dp"
                    android:text="@string/log_in_with_google"
                    android:textColor="@color/white"
                    android:textSize="12sp"
                    android:theme="@style/Theme.MaterialComponents"
                    app:layout_constraintBottom_toBottomOf="@+id/facebook"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toEndOf="@+id/facebook"
                    app:layout_constraintTop_toTopOf="@+id/facebook"
                    app:layout_constraintVertical_bias="0.0" />

                <View
                    android:id="@+id/divider1"
                    android:layout_width="0dp"
                    android:layout_height="2dp"
                    android:layout_marginStart="8dp"
                    android:background="@color/white"
                    app:layout_constraintBottom_toBottomOf="@+id/textView6"
                    app:layout_constraintEnd_toStartOf="@+id/textView6"
                    app:layout_constraintStart_toStartOf="@+id/facebook"
                    app:layout_constraintTop_toTopOf="@+id/textView6" />

                <View
                    android:id="@+id/divider2"
                    android:layout_width="0dp"
                    android:layout_height="2dp"
                    android:layout_marginEnd="8dp"
                    android:background="@color/white"
                    app:layout_constraintBottom_toBottomOf="@+id/textView6"
                    app:layout_constraintEnd_toEndOf="@+id/Google"
                    app:layout_constraintStart_toEndOf="@+id/textView6"
                    app:layout_constraintTop_toTopOf="@+id/textView6" />

                <TextView
                    android:id="@+id/textView6"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="24dp"
                    android:layout_marginTop="16dp"
                    android:layout_marginEnd="24dp"
                    android:text="@string/or"
                    android:textColor="@color/white"
                    android:textSize="16sp"
                    android:textStyle="bold"
                    app:layout_constraintEnd_toStartOf="@+id/divider2"
                    app:layout_constraintStart_toEndOf="@+id/divider1"
                    app:layout_constraintTop_toBottomOf="@+id/Google" />

                <LinearLayout
                    android:id="@+id/frameLayout_bottom"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="24dp"
                    android:layout_marginTop="8dp"
                    android:layout_marginEnd="24dp"
                    android:layout_marginBottom="16dp"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toBottomOf="@+id/textView6"
                    android:orientation="vertical">

                    <android.support.design.widget.AppBarLayout
                        android:id="@+id/appbar"
                        android:layout_width="match_parent"
                        android:layout_height="56dp"
                        android:theme="@style/CustomTabLayout"
                        app:layout_behavior="@string/appbar_scrolling_view_behavior">

                        <android.support.design.widget.TabLayout
                            android:id="@+id/tabs"
                            android:layout_width="match_parent"
                            android:layout_height="56dp">

                            <android.support.design.widget.TabItem
                                android:id="@+id/tabItem"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text="@string/login" />

                            <android.support.design.widget.TabItem
                                android:id="@+id/tabItem2"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text="@string/sign_up" />
                        </android.support.design.widget.TabLayout>
                    </android.support.design.widget.AppBarLayout>

                    <!--<android.support.v4.view.ViewPager
                        android:id="@+id/container"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        app:layout_constraintBottom_toTopOf="parent"
                        app:layout_constraintTop_toBottomOf="@id/appbar" />-->

                    <ScrollView
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:fillViewport="true">
                    <FrameLayout
                        android:id="@+id/container_frame"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                      app:layout_constraintTop_toBottomOf="@+id/appbar"
                        app:layout_constraintBottom_toTopOf="parent"
                        />
                    </ScrollView>


     </LinearLayout>

            </android.support.constraint.ConstraintLayout>

        </FrameLayout>

屏幕截图位于larger display device smaller screen device

这是我的片段布局,被放大为以上布局的FrameLayout

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    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="wrap_content"
    tools:context=".SignUpFragment"
    app:cardUseCompatPadding="true"
    app:cardElevation="4dp"
    app:cardCornerRadius="3dp"
    android:layout_marginBottom="16dp"
    >
    <android.support.constraint.ConstraintLayout
    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:layout_marginBottom="16dp">

    <TextView
        android:id="@+id/textViewname"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginTop="8dp"
        android:text="@string/name1"
        android:textColor="@color/grey"
        android:textSize="14sp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <EditText
        android:id="@+id/signup_name"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="32dp"
        android:hint="@string/enter_your_name"
        android:inputType="text"
        android:textSize="14sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="@+id/textViewname"
        app:layout_constraintTop_toBottomOf="@+id/textViewname" />

    <TextView
        android:id="@+id/textViewemail"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="@string/email2"
        android:textColor="@color/grey"
        android:textSize="14sp"
        app:layout_constraintStart_toStartOf="@+id/textViewname"
        app:layout_constraintTop_toBottomOf="@+id/signup_name" />

    <EditText
        android:id="@+id/signup_email"
        android:layout_width="0dp"
        android:layout_height="56dp"
        android:layout_marginTop="8dp"
        android:inputType="textEmailAddress"
        android:hint="@string/enter_your_email"
        android:textSize="14sp"
        app:layout_constraintEnd_toEndOf="@+id/signup_name"
        app:layout_constraintStart_toStartOf="@+id/signup_name"
        app:layout_constraintTop_toBottomOf="@+id/textViewemail" />

    <TextView
        android:id="@+id/textViewpassword"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="@string/password"
        android:textColor="@color/grey"
        android:textSize="14sp"
        app:layout_constraintStart_toStartOf="@+id/textViewemail"
        app:layout_constraintTop_toBottomOf="@+id/signup_email" />

    <EditText
        android:id="@+id/signup_password"
        android:layout_width="0dp"
        android:layout_height="56dp"
        android:layout_marginTop="8dp"
        android:inputType="textPassword"
        android:textSize="14sp"
        app:layout_constraintEnd_toEndOf="@+id/signup_email"
        app:layout_constraintStart_toStartOf="@+id/signup_email"
        app:layout_constraintTop_toBottomOf="@+id/textViewpassword" />

    <TextView
        android:id="@+id/textViewconfirmpassword"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="@string/confirm_password"
        android:textColor="@color/grey"
        android:textSize="14sp"
        app:layout_constraintStart_toStartOf="@+id/textViewpassword"
        app:layout_constraintTop_toBottomOf="@+id/signup_password" />
    <EditText
        android:id="@+id/signup_confirmpassword"
        android:layout_width="0dp"
        android:layout_height="56dp"
        android:layout_marginTop="8dp"
        android:inputType="textPassword"
        android:textSize="14sp"
        app:layout_constraintEnd_toEndOf="@+id/signup_password"
        app:layout_constraintStart_toStartOf="@+id/signup_password"
        app:layout_constraintTop_toBottomOf="@+id/textViewconfirmpassword" />

    <Button
        android:layout_width="0dp"
        android:layout_height="36dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="8dp"
        android:background="@color/colorPrimaryDark"

        android:text="@string/sign_up"
        android:textColor="@color/white"
        android:textSize="16sp"
        app:layout_constraintEnd_toEndOf="@+id/signup_confirmpassword"
     app:layout_constraintStart_toStartOf="@+id/signup_confirmpassword"
      app:layout_constraintTop_toBottomOf="@+id/signup_confirmpassword" />


</android.support.constraint.ConstraintLayout>
</android.support.v7.widget.CardView>

1 个答案:

答案 0 :(得分:0)

只需将ScrollView设置为ConstraintLayout的父级,如下所示:

const SearchBar = ({ searchQuery }) => 
  <Card>
    <div className={styles.searchFieldContainer}>
      <div className={styles.field}>
        <input type="text" onChange={(event)=> searchQuery(event.target.value)} placeholder="Search for items or sellers" />
      </div>
      <Button className={styles.searchButton}>
        Search
      </Button>
    </div>
  </Card>

const mapStateToProps = () => {
  return {

  }
} 

const mapDispatchToProps = (dispatch) => {
  return {
    searchQuery: (val) => dispatch(searchQuery(val))
  }
}

export default connect(mapStateToProps, mapDispatchToProps)(SearchBar);