Skip to content

Commit

Permalink
Add layout for tablets
Browse files Browse the repository at this point in the history
  • Loading branch information
@adhiamboperes
adhiamboperes committed Apr 9, 2024
1 parent 0d7980f commit 312fc38
Show file tree
Hide file tree
Showing 2 changed files with 356 additions and 0 deletions.
179 changes: 179 additions & 0 deletions app/src/main/res/layout-sw600dp-land/create_profile_fragment.xml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,179 @@
<?xml version="1.0" encoding="utf-8"?>
<layout 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">

<data>

<import type="android.view.View" />

<variable
name="viewModel"
type="org.oppia.android.app.onboardingv2.CreateProfileViewModel" />
</data>

<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/component_color_onboarding_shared_green_color">

<androidx.constraintlayout.widget.Guideline
android:id="@+id/create_profile_picture_guide"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.15" />

<org.oppia.android.app.customview.OppiaCurveBackgroundView
android:id="@+id/create_profile_background"
android:layout_width="match_parent"
android:layout_height="0dp"
app:customBackgroundColor="@color/component_color_onboarding_shared_white_color"
app:layout_constraintTop_toTopOf="@id/create_profile_picture_guide" />

<com.google.android.material.imageview.ShapeableImageView
android:id="@+id/create_profile_user_image_view"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_marginTop="@dimen/onboarding_shared_margin_large"
android:clickable="true"
android:contentDescription="@string/create_profile_activity_current_picture_content_description"
android:focusable="true"
android:padding="@dimen/onboarding_profile_picture_padding"
android:scaleType="fitXY"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@id/create_profile_background"
app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.RoundedShape"
app:srcCompat="@{@drawable/ic_default_avatar}"
app:strokeColor="@color/component_color_onboarding_shared_white_color"
app:strokeWidth="@dimen/onboarding_profile_picture_stroke_width" />

<ImageView
android:id="@+id/create_profile_edit_picture_icon"
android:layout_width="56dp"
android:layout_height="56dp"
android:contentDescription="@string/create_profile_activity_edit_icon_content_description"
android:elevation="@dimen/onboarding_shared_elevation"
android:paddingStart="@dimen/onboarding_shared_padding_medium"
android:paddingTop="@dimen/onboarding_shared_padding_medium"
app:layout_constraintBottom_toBottomOf="@id/create_profile_user_image_view"
app:layout_constraintEnd_toEndOf="@id/create_profile_user_image_view"
app:srcCompat="@drawable/create_profile_picture_icon" />

<TextView
android:id="@+id/create_profile_picture_prompt"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="@dimen/onboarding_shared_margin_large"
android:background="@color/component_color_onboarding_shared_green_color"
android:fontFamily="sans-serif"
android:padding="@dimen/onboarding_shared_padding_medium_small"
android:text="@string/create_profile_activity_profile_picture_prompt"
android:textAlignment="center"
android:textColor="@color/component_color_onboarding_shared_white_color"
android:textSize="@dimen/onboarding_shared_text_size_medium"
app:layout_constraintBottom_toBottomOf="@id/create_profile_user_image_view"
app:layout_constraintEnd_toEndOf="@id/create_profile_user_image_view"
app:layout_constraintStart_toStartOf="@id/create_profile_user_image_view"
app:layout_constraintTop_toTopOf="@id/create_profile_user_image_view" />

<TextView
android:id="@+id/create_profile_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/onboarding_shared_margin_large"
android:fontFamily="sans-serif-medium"
android:text="@string/create_profile_activity_header"
android:textColor="@color/component_color_onboarding_shared_black_color"
android:textSize="@dimen/onboarding_shared_text_size_large"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/create_profile_user_image_view" />

<TextView
android:id="@+id/create_profile_nickname_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/onboarding_shared_margin_4xl"
android:layout_marginTop="@dimen/onboarding_shared_margin_large"
android:fontFamily="sans-serif"
android:labelFor="@id/create_profile_nickname_edittext"
android:text="@string/create_profile_activity_nickname_label"
android:textColor="@color/component_color_onboarding_shared_text_color"
android:textSize="@dimen/onboarding_shared_text_size_medium"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/create_profile_title" />

<EditText
android:id="@+id/create_profile_nickname_edittext"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/onboarding_shared_margin_4xl"
android:layout_marginTop="@dimen/onboarding_shared_margin_small"
android:layout_marginEnd="@dimen/onboarding_shared_margin_4xl"
android:layout_marginBottom="@dimen/onboarding_shared_margin_small"
android:autofillHints="false"
android:background="@{viewModel.hasError ? @drawable/edit_text_white_background_error_border: @drawable/edit_text_white_background_with_border}"
android:fontFamily="sans-serif"
android:imeOptions="actionDone"
android:inputType="text|textCapSentences"
android:minHeight="@dimen/clickable_item_min_height"
android:paddingStart="@dimen/onboarding_shared_padding_medium"
android:paddingTop="@dimen/onboarding_shared_padding_small"
android:paddingEnd="@dimen/onboarding_shared_padding_medium"
android:paddingBottom="@dimen/onboarding_shared_padding_small"
android:textColor="@color/component_color_onboarding_shared_text_color"
android:textSize="@dimen/onboarding_shared_text_size_medium_large"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/create_profile_nickname_label"
tools:text="John" />

<TextView
android:id="@+id/create_profile_nickname_error"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/onboarding_shared_margin_4xl"
android:layout_marginTop="@dimen/onboarding_shared_margin_small"
android:layout_marginEnd="@dimen/onboarding_shared_margin_medium_small"
android:fontFamily="sans-serif"
android:text="@string/create_profile_activity_nickname_error"
android:textColor="@color/component_color_shared_error_color"
android:textSize="@dimen/onboarding_shared_text_size_medium_small"
android:visibility="@{viewModel.hasError ? View.VISIBLE : View.GONE}"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/create_profile_nickname_edittext" />

<TextView
android:id="@+id/onboarding_steps_count"
style="@style/OnboardingStepCountStyle"
android:text="@string/onboarding_step_count_three"
android:visibility="@{viewModel.onboardingStepsCount}"
app:layout_constraintBottom_toTopOf="@id/onboarding_navigation_back"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />

<Button
android:id="@+id/onboarding_navigation_back"
style="@style/OnboardingNavigationSecondaryButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="@dimen/onboarding_shared_margin_xl"
android:text="@string/onboarding_navigation_back"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@id/onboarding_navigation_continue"
app:layout_constraintStart_toStartOf="parent" />

<Button
android:id="@+id/onboarding_navigation_continue"
style="@style/OnboardingNavigationPrimaryButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="@dimen/onboarding_shared_margin_xl"
android:text="@string/onboarding_navigation_continue"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/onboarding_navigation_back" />
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
177 changes: 177 additions & 0 deletions app/src/main/res/layout-sw600dp-port/create_profile_fragment.xml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,177 @@
<?xml version="1.0" encoding="utf-8"?>
<layout 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">

<data>

<import type="android.view.View" />

<variable
name="viewModel"
type="org.oppia.android.app.onboardingv2.CreateProfileViewModel" />
</data>

<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/component_color_onboarding_shared_green_color">

<androidx.constraintlayout.widget.Guideline
android:id="@+id/create_profile_picture_guide"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.15" />

<org.oppia.android.app.customview.OppiaCurveBackgroundView
android:id="@+id/create_profile_background"
android:layout_width="match_parent"
android:layout_height="0dp"
app:customBackgroundColor="@color/component_color_onboarding_shared_white_color"
app:layout_constraintTop_toTopOf="@id/create_profile_picture_guide" />

<com.google.android.material.imageview.ShapeableImageView
android:id="@+id/create_profile_user_image_view"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_marginTop="@dimen/onboarding_shared_margin_xl"
android:clickable="true"
android:contentDescription="@string/create_profile_activity_current_picture_content_description"
android:focusable="true"
android:padding="@dimen/onboarding_profile_picture_padding"
android:scaleType="fitXY"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@id/create_profile_background"
app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.RoundedShape"
app:srcCompat="@{@drawable/ic_default_avatar}"
app:strokeColor="@color/component_color_onboarding_shared_white_color"
app:strokeWidth="@dimen/onboarding_profile_picture_stroke_width" />

<ImageView
android:id="@+id/create_profile_edit_picture_icon"
android:layout_width="48dp"
android:layout_height="48dp"
android:contentDescription="@string/create_profile_activity_edit_icon_content_description"
android:elevation="@dimen/onboarding_shared_elevation"
android:paddingStart="@dimen/onboarding_shared_padding_medium"
android:paddingTop="@dimen/onboarding_shared_padding_medium"
app:layout_constraintBottom_toBottomOf="@id/create_profile_user_image_view"
app:layout_constraintEnd_toEndOf="@id/create_profile_user_image_view"
app:srcCompat="@drawable/create_profile_picture_icon" />

<TextView
android:id="@+id/create_profile_picture_prompt"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="@dimen/onboarding_shared_margin_large"
android:background="@color/component_color_onboarding_shared_green_color"
android:fontFamily="sans-serif"
android:padding="@dimen/onboarding_shared_padding_medium_small"
android:text="@string/create_profile_activity_profile_picture_prompt"
android:textAlignment="center"
android:textColor="@color/component_color_onboarding_shared_white_color"
android:textSize="@dimen/onboarding_shared_text_size_medium_small"
app:layout_constraintBottom_toBottomOf="@id/create_profile_user_image_view"
app:layout_constraintEnd_toEndOf="@id/create_profile_user_image_view"
app:layout_constraintStart_toStartOf="@id/create_profile_user_image_view"
app:layout_constraintTop_toTopOf="@id/create_profile_user_image_view" />

<TextView
android:id="@+id/create_profile_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/onboarding_shared_margin_large"
android:fontFamily="sans-serif-medium"
android:text="@string/create_profile_activity_header"
android:textColor="@color/component_color_onboarding_shared_black_color"
android:textSize="@dimen/onboarding_shared_text_size_medium_large"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/create_profile_user_image_view" />

<TextView
android:id="@+id/create_profile_nickname_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/onboarding_shared_margin_4xl"
android:layout_marginTop="@dimen/onboarding_shared_margin_large"
android:fontFamily="sans-serif"
android:labelFor="@id/create_profile_nickname_edittext"
android:text="@string/create_profile_activity_nickname_label"
android:textColor="@color/component_color_onboarding_shared_text_color"
android:textSize="@dimen/onboarding_shared_text_size_medium_small"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/create_profile_title" />

<EditText
android:id="@+id/create_profile_nickname_edittext"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/onboarding_shared_margin_4xl"
android:layout_marginTop="@dimen/onboarding_shared_margin_small"
android:layout_marginEnd="@dimen/onboarding_shared_margin_4xl"
android:autofillHints="false"
android:background="@{viewModel.hasError ? @drawable/edit_text_white_background_error_border: @drawable/edit_text_white_background_with_border}"
android:fontFamily="sans-serif"
android:imeOptions="actionDone"
android:inputType="text|textCapSentences"
android:minHeight="@dimen/clickable_item_min_height"
android:paddingStart="@dimen/onboarding_shared_padding_medium"
android:paddingTop="@dimen/onboarding_shared_padding_small"
android:paddingEnd="@dimen/onboarding_shared_padding_medium"
android:paddingBottom="@dimen/onboarding_shared_padding_small"
android:textColor="@color/component_color_onboarding_shared_text_color"
android:textSize="@dimen/onboarding_shared_text_size_medium"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/create_profile_nickname_label"
tools:text="John" />

<TextView
android:id="@+id/create_profile_nickname_error"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/onboarding_shared_margin_4xl"
android:layout_marginTop="@dimen/onboarding_shared_margin_small"
android:layout_marginEnd="@dimen/onboarding_shared_margin_medium_small"
android:fontFamily="sans-serif"
android:text="@string/create_profile_activity_nickname_error"
android:textColor="@color/component_color_shared_error_color"
android:textSize="@dimen/onboarding_shared_text_size_medium_small"
android:visibility="@{viewModel.hasError ? View.VISIBLE : View.GONE}"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/create_profile_nickname_edittext" />

<TextView
android:id="@+id/onboarding_steps_count"
style="@style/OnboardingStepCountStyle"
android:text="@string/onboarding_step_count_three"
android:visibility="@{viewModel.onboardingStepsCount}"
app:layout_constraintBottom_toTopOf="@id/onboarding_navigation_back"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />

<Button
android:id="@+id/onboarding_navigation_back"
style="@style/OnboardingNavigationSecondaryButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="@dimen/onboarding_shared_margin_xl"
android:text="@string/onboarding_navigation_back"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@id/onboarding_navigation_continue"
app:layout_constraintStart_toStartOf="parent" />

<Button
android:id="@+id/onboarding_navigation_continue"
style="@style/OnboardingNavigationPrimaryButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="@dimen/onboarding_shared_margin_xl"
android:text="@string/onboarding_navigation_continue"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/onboarding_navigation_back" />
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>

0 comments on commit 312fc38

Please sign in to comment.