Login screens: ensure forms are scrollable on small screens

This commit is contained in:
Benoit Marty 2019-11-22 11:17:50 +01:00
parent 3f83c161e4
commit 489a594027
13 changed files with 674 additions and 611 deletions

View File

@ -12,11 +12,13 @@
tools:ignore="ContentDescription,MissingConstraints" />
<!-- Missing attributes are in the style -->
<!--suppress AndroidDomInspection -->
<androidx.core.widget.NestedScrollView
style="@style/LoginFormScrollView"
tools:ignore="MissingConstraints">
<LinearLayout
style="@style/LoginFormContainer"
android:orientation="vertical"
tools:ignore="MissingConstraints">
android:orientation="vertical">
<ImageView
android:id="@+id/loginServerIcon"
@ -130,5 +132,7 @@
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

View File

@ -11,8 +11,9 @@
tools:ignore="ContentDescription,MissingConstraints" />
<!-- Missing attributes are in the style -->
<!-- No scroll view in the screen, but use the style -->
<LinearLayout
style="@style/LoginFormContainer"
style="@style/LoginFormScrollView"
android:layout_height="0dp"
android:orientation="vertical"
android:paddingStart="16dp"
@ -45,10 +46,10 @@
android:id="@+id/loginCaptchaProgress"
android:layout_width="60dp"
android:layout_height="60dp"
app:layout_constraintBottom_toBottomOf="@id/loginFormContainer"
app:layout_constraintEnd_toEndOf="@id/loginFormContainer"
app:layout_constraintStart_toStartOf="@id/loginFormContainer"
app:layout_constraintTop_toTopOf="@id/loginFormContainer" />
app:layout_constraintBottom_toBottomOf="@id/loginFormScrollView"
app:layout_constraintEnd_toEndOf="@id/loginFormScrollView"
app:layout_constraintStart_toStartOf="@id/loginFormScrollView"
app:layout_constraintTop_toTopOf="@id/loginFormScrollView" />
</androidx.constraintlayout.widget.ConstraintLayout>

View File

@ -12,10 +12,13 @@
tools:ignore="ContentDescription,MissingConstraints" />
<!-- Missing attributes are in the style -->
<androidx.core.widget.NestedScrollView
style="@style/LoginFormScrollView"
tools:ignore="MissingConstraints">
<LinearLayout
style="@style/LoginFormContainer"
android:orientation="vertical"
tools:ignore="MissingConstraints">
android:orientation="vertical">
<TextView
android:id="@+id/loginGenericTextInputFormTitle"
@ -93,5 +96,7 @@
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

View File

@ -11,10 +11,13 @@
tools:ignore="ContentDescription,MissingConstraints" />
<!-- Missing attributes are in the style -->
<androidx.core.widget.NestedScrollView
style="@style/LoginFormScrollView"
tools:ignore="MissingConstraints">
<LinearLayout
style="@style/LoginFormContainer"
android:orientation="vertical"
tools:ignore="MissingConstraints">
android:orientation="vertical">
<TextView
android:id="@+id/resetPasswordTitle"
@ -103,5 +106,7 @@
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

View File

@ -10,10 +10,13 @@
tools:ignore="ContentDescription,MissingConstraints" />
<!-- Missing attributes are in the style -->
<androidx.core.widget.NestedScrollView
style="@style/LoginFormScrollView"
tools:ignore="MissingConstraints">
<LinearLayout
style="@style/LoginFormContainer"
android:orientation="vertical"
tools:ignore="MissingConstraints">
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
@ -47,5 +50,7 @@
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

View File

@ -10,10 +10,13 @@
tools:ignore="ContentDescription,MissingConstraints" />
<!-- Missing attributes are in the style -->
<androidx.core.widget.NestedScrollView
style="@style/LoginFormScrollView"
tools:ignore="MissingConstraints">
<LinearLayout
style="@style/LoginFormContainer"
android:orientation="vertical"
tools:ignore="MissingConstraints">
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
@ -47,5 +50,7 @@
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

View File

@ -1,17 +1,22 @@
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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">
<!-- Missing attributes are in the style -->
<ImageView
style="@style/LoginLogo"
android:transitionName="loginLogoTransition" />
android:transitionName="loginLogoTransition"
tools:ignore="ContentDescription,MissingConstraints,UnusedAttribute" />
<androidx.constraintlayout.widget.ConstraintLayout
style="@style/LoginFormContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- Missing attributes are in the style -->
<androidx.core.widget.NestedScrollView
style="@style/LoginFormScrollView"
tools:ignore="MissingConstraints">
<androidx.constraintlayout.widget.ConstraintLayout style="@style/LoginFormContainer">
<TextView
android:id="@+id/loginServerTitle"
@ -184,5 +189,7 @@
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

View File

@ -12,10 +12,13 @@
tools:ignore="ContentDescription,MissingConstraints" />
<!-- Missing attributes are in the style -->
<androidx.core.widget.NestedScrollView
style="@style/LoginFormScrollView"
tools:ignore="MissingConstraints">
<LinearLayout
style="@style/LoginFormContainer"
android:orientation="vertical"
tools:ignore="MissingConstraints">
android:orientation="vertical">
<ImageView
android:id="@+id/loginServerUrlFormIcon"
@ -86,7 +89,10 @@
android:layout_gravity="end"
android:layout_marginTop="22dp"
android:text="@string/login_continue" />
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

View File

@ -11,10 +11,12 @@
tools:ignore="ContentDescription,MissingConstraints" />
<!-- Missing attributes are in the style -->
<androidx.constraintlayout.widget.ConstraintLayout
style="@style/LoginFormContainer"
<androidx.core.widget.NestedScrollView
style="@style/LoginFormScrollView"
tools:ignore="MissingConstraints">
<androidx.constraintlayout.widget.ConstraintLayout style="@style/LoginFormContainer">
<ImageView
android:id="@+id/loginSignupSigninServerIcon"
android:layout_width="wrap_content"
@ -78,6 +80,7 @@
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

View File

@ -12,8 +12,10 @@
<!-- Missing attributes are in the style -->
<androidx.constraintlayout.widget.ConstraintLayout
style="@style/LoginFormContainer"
style="@style/LoginFormScrollView"
android:layout_height="0dp"
android:paddingTop="32dp"
android:paddingBottom="32dp"
tools:ignore="MissingConstraints">
<TextView
@ -21,6 +23,8 @@
style="@style/TextAppearance.Vector.Login.Title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingStart="36dp"
android:paddingEnd="36dp"
android:text="@string/login_terms_title"
app:layout_constraintTop_toTopOf="parent" />
@ -30,6 +34,8 @@
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:paddingStart="36dp"
android:paddingEnd="36dp"
android:text="@string/auth_accept_policies"
app:layout_constraintTop_toBottomOf="@+id/loginTermsTitle" />
@ -46,10 +52,12 @@
<com.google.android.material.button.MaterialButton
android:id="@+id/loginTermsSubmit"
style="@style/Style.Vector.Login.Button"
android:layout_marginEnd="36dp"
android:text="@string/accept"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

View File

@ -11,10 +11,13 @@
tools:ignore="ContentDescription,MissingConstraints" />
<!-- Missing attributes are in the style -->
<androidx.core.widget.NestedScrollView
style="@style/LoginFormScrollView"
tools:ignore="MissingConstraints">
<LinearLayout
style="@style/LoginFormContainer"
android:orientation="vertical"
tools:ignore="MissingConstraints">
android:orientation="vertical">
<TextView
android:id="@+id/loginWaitForEmailTitle"
@ -42,5 +45,7 @@
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

View File

@ -5,7 +5,9 @@
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:foreground="?attr/selectableItemBackground"
android:minHeight="72dp">
android:minHeight="72dp"
android:paddingStart="16dp"
android:paddingEnd="16dp">
<com.google.android.material.checkbox.MaterialCheckBox
android:id="@+id/adapter_item_policy_checkbox"

View File

@ -9,6 +9,7 @@
</style>
<item name="loginLogo" type="id" />
<item name="loginFormScrollView" type="id" />
<item name="loginFormContainer" type="id" />
<style name="LoginLogoBase">
@ -26,19 +27,25 @@
<item name="android:layout_marginTop">32dp</item>
</style>
<style name="LoginFormContainerBase">
<style name="LoginFormContainer">
<item name="android:id">@id/loginFormContainer</item>
<item name="layout_constraintEnd_toEndOf">parent</item>
<item name="layout_constraintBottom_toBottomOf">parent</item>
<item name="android:paddingTop">32dp</item>
<item name="android:paddingBottom">32dp</item>
<item name="android:paddingStart">36dp</item>
<item name="android:paddingEnd">36dp</item>
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item>
</style>
<style name="LoginFormScrollViewBase">
<item name="android:id">@id/loginFormScrollView</item>
<item name="layout_constraintEnd_toEndOf">parent</item>
<item name="layout_constraintBottom_toBottomOf">parent</item>
<item name="android:layout_width">0dp</item>
<item name="android:layout_height">wrap_content</item>
</style>
<style name="LoginFormContainer" parent="LoginFormContainerBase">
<style name="LoginFormScrollView" parent="LoginFormScrollViewBase">
<item name="layout_constraintTop_toBottomOf">@id/loginLogo</item>
<item name="layout_constraintStart_toStartOf">parent</item>
</style>