Skip to content

Commit

Permalink
Fix #953: Highfi HomeFragment (#954)
Browse files Browse the repository at this point in the history 
* welcome screen

* Updated implementation

* Approach 2

* Fixed issue

* Updated UI

* ! added

* Space issue fix

* Nit change

* Linter issue fixes

* Nit change for lint fixes

Co-authored-by: Rajat Talesra <talesra@talesra-macbookpro.roam.corp.google.com>
  • Loading branch information
@rt4914
rt4914 and Rajat Talesra committed Apr 8, 2020
1 parent fd97958 commit 49f3522
Show file tree
Hide file tree
Showing 20 changed files with 325 additions and 293 deletions.
11 changes: 10 additions & 1 deletion app/src/main/java/org/oppia/app/home/topiclist/PromotedStoryListAdapter.kt
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
package org.oppia.app.home.topiclist

import android.content.Context
import android.content.res.Configuration
import android.content.res.Resources
import android.view.LayoutInflater
import android.view.ViewGroup
import androidx.appcompat.app.AppCompatActivity
Expand All @@ -15,6 +17,8 @@ class PromotedStoryListAdapter(
) :
RecyclerView.Adapter<RecyclerView.ViewHolder>() {

private val orientation = Resources.getSystem().configuration.orientation

override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder {
val inflater = LayoutInflater.from(parent.context)
val binding =
Expand All @@ -41,7 +45,12 @@ class PromotedStoryListAdapter(
binding.viewModel = promotedStoryViewModel
val layoutParams = binding.promotedStoryCardContainer.layoutParams
layoutParams.width = if (itemCount > 1) {
(activity as Context).resources.getDimensionPixelSize(R.dimen.promoted_story_card_width)
if (orientation == Configuration.ORIENTATION_PORTRAIT) {
ViewGroup.LayoutParams.MATCH_PARENT
}
else{
(activity as Context).resources.getDimensionPixelSize(R.dimen.promoted_story_card_width)
}
} else {
ViewGroup.LayoutParams.MATCH_PARENT
}
Expand Down
56 changes: 43 additions & 13 deletions app/src/main/java/org/oppia/app/home/topiclist/TopicListAdapter.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import android.content.res.Resources
import android.view.LayoutInflater
import android.view.ViewGroup
import androidx.appcompat.app.AppCompatActivity
import androidx.recyclerview.widget.GridLayoutManager
import androidx.recyclerview.widget.LinearLayoutManager
import androidx.recyclerview.widget.RecyclerView
import org.oppia.app.R
Expand Down Expand Up @@ -123,7 +122,8 @@ class TopicListAdapter(
return itemList.size
}

private class WelcomeViewHolder(val binding: WelcomeBinding) : RecyclerView.ViewHolder(binding.root) {
private class WelcomeViewHolder(val binding: WelcomeBinding) :
RecyclerView.ViewHolder(binding.root) {
internal fun bind(welcomeViewModel: WelcomeViewModel) {
binding.viewModel = welcomeViewModel
}
Expand Down Expand Up @@ -151,10 +151,11 @@ class TopicListAdapter(
*/
val snapHelper = StartSnapHelper()
binding.promotedStoryListRecyclerView.layoutManager = horizontalLayoutManager
binding.promotedStoryListRecyclerView.setOnFlingListener(null)
snapHelper.attachToRecyclerView(binding.promotedStoryListRecyclerView)

val paddingEnd = if (orientation == Configuration.ORIENTATION_PORTRAIT) {
(activity as Context).resources.getDimensionPixelSize(R.dimen.padding_48)
(activity as Context).resources.getDimensionPixelSize(R.dimen.padding_44)
} else {
(activity as Context).resources.getDimensionPixelSize(R.dimen.padding_72)
}
Expand All @@ -171,17 +172,21 @@ class TopicListAdapter(
}
}

private class AllTopicsViewHolder(binding: AllTopicsBinding) : RecyclerView.ViewHolder(binding.root) {
private class AllTopicsViewHolder(binding: AllTopicsBinding) :
RecyclerView.ViewHolder(binding.root) {
internal fun bind() {
}
}

inner class TopicListViewHolder(val binding: TopicSummaryViewBinding) : RecyclerView.ViewHolder(binding.root) {
inner class TopicListViewHolder(val binding: TopicSummaryViewBinding) :
RecyclerView.ViewHolder(binding.root) {
internal fun bind(topicSummaryViewModel: TopicSummaryViewModel, position: Int) {
binding.viewModel = topicSummaryViewModel
val param = binding.topicContainer.layoutParams as GridLayoutManager.LayoutParams

val marginLayoutParams = binding.topicContainer.layoutParams as ViewGroup.MarginLayoutParams

val marginMax = if (orientation == Configuration.ORIENTATION_PORTRAIT) {
(activity as Context).resources.getDimensionPixelSize(R.dimen.margin_32)
(activity as Context).resources.getDimensionPixelSize(R.dimen.margin_28)
} else {
(activity as Context).resources.getDimensionPixelSize(R.dimen.margin_72)
}
Expand All @@ -196,17 +201,42 @@ class TopicListAdapter(

if (orientation == Configuration.ORIENTATION_PORTRAIT) {
when {
position % 2 == 0 -> param.setMargins(marginMin, marginTopBottom, marginMax, marginTopBottom)
else -> param.setMargins(marginMax, marginTopBottom, marginMin, marginTopBottom)
position % 2 == 0 -> marginLayoutParams.setMargins(
marginMin,
marginTopBottom,
marginMax,
marginTopBottom
)
else -> marginLayoutParams.setMargins(
marginMax,
marginTopBottom,
marginMin,
marginTopBottom
)
}
} else {
when {
position % 3 == 0 -> param.setMargins(marginMax, marginTopBottom, /* right= */ 0, marginTopBottom)
position % 3 == 1 -> param.setMargins(marginMin, marginTopBottom, marginMin, marginTopBottom)
position % 3 == 2 -> param.setMargins(/* left= */ 0, marginTopBottom, marginMax, marginTopBottom)
position % 3 == 0 -> marginLayoutParams.setMargins(
marginMax,
marginTopBottom,
/* right= */ 0,
marginTopBottom
)
position % 3 == 1 -> marginLayoutParams.setMargins(
marginMin,
marginTopBottom,
marginMin,
marginTopBottom
)
position % 3 == 2 -> marginLayoutParams.setMargins(
/* left= */ 0,
marginTopBottom,
marginMax,
marginTopBottom
)
}
}
binding.topicContainer.layoutParams = param
binding.topicContainer.layoutParams = marginLayoutParams
}
}
}
8 changes: 4 additions & 4 deletions app/src/main/res/layout-land/all_topics.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,10 @@
android:id="@+id/all_topics_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="72dp"
android:layout_marginTop="56dp"
android:layout_marginEnd="72dp"
android:layout_marginBottom="16dp"
android:layout_marginStart="76dp"
android:layout_marginTop="32dp"
android:layout_marginEnd="76dp"
android:layout_marginBottom="12dp"
android:fontFamily="sans-serif-medium"
android:text="@string/all_topics"
android:textColor="@color/oppiaPrimaryText"
Expand Down
13 changes: 9 additions & 4 deletions app/src/main/res/layout-land/home_fragment.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
type="org.oppia.app.home.HomeFragmentPresenter" />
</data>

<LinearLayout
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white"
Expand All @@ -23,8 +23,13 @@
android:layout_height="match_parent"
android:clipToPadding="false"
android:overScrollMode="never"
android:paddingTop="36dp"
android:paddingBottom="@dimen/bottom_white_space"
android:paddingTop="40dp"
android:paddingBottom="96dp"
android:scrollbars="none" />
</LinearLayout>

<View
android:layout_width="match_parent"
android:layout_height="6dp"
android:background="@drawable/toolbar_drop_shadow" />
</FrameLayout>
</layout>
135 changes: 71 additions & 64 deletions app/src/main/res/layout-land/promoted_story_card.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,85 +11,92 @@
type="org.oppia.app.home.topiclist.PromotedStoryViewModel" />
</data>

<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/promoted_story_card_container"
<com.google.android.material.card.MaterialCardView
android:layout_width="280dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:elevation="4dp"
android:onClick="@{(v) -> viewModel.clickOnStoryTile()}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/recently_played_stories_text_view"
app:roundedRectDrawableWithColor="@{viewModel.promotedStoryObservable.lessonThumbnail.backgroundColorRgb}">
app:cardElevation="4dp"
app:cardCornerRadius="4dp">

<ImageView
android:id="@+id/lesson_thumbnail"
android:layout_width="0dp"
android:layout_height="120dp"
android:importantForAccessibility="no"
android:scaleType="centerInside"
android:src="@{viewModel.promotedStoryObservable.lessonThumbnail.thumbnailGraphic}"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<LinearLayout
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/bottom_rounded_rect_white_background"
android:orientation="vertical"
android:id="@+id/promoted_story_card_container"
android:onClick="@{(v) -> viewModel.clickOnStoryTile()}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/lesson_thumbnail">
app:layout_constraintTop_toBottomOf="@id/recently_played_stories_text_view"
app:roundedRectDrawableWithColor="@{viewModel.promotedStoryObservable.lessonThumbnail.backgroundColorRgb}">

<TextView
android:id="@+id/chapter_name_text_view"
style="@style/TextAppearance.AppCompat.Headline"
<ImageView
android:id="@+id/lesson_thumbnail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:maxLines="1"
android:ellipsize="end"
android:layout_marginEnd="16dp"
android:fontFamily="sans-serif-medium"
android:text="@{viewModel.promotedStoryObservable.nextChapterName}"
android:textSize="18sp" />
android:layout_height="0dp"
android:importantForAccessibility="no"
android:scaleType="centerInside"
android:src="@{viewModel.promotedStoryObservable.lessonThumbnail.thumbnailGraphic}"
app:layout_constraintDimensionRatio="H, 16:9"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<TextView
android:id="@+id/story_name_text_view"
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="16dp"
android:maxLines="1"
android:ellipsize="end"
android:fontFamily="sans-serif"
android:text="@{viewModel.promotedStoryObservable.storyName}"
android:textColor="@color/oppiaPrimaryText"
android:textSize="14sp" />
android:background="@drawable/bottom_rounded_rect_white_background"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/lesson_thumbnail">

<TextView
android:id="@+id/topic_name_text_view"
style="@style/TextAppearance.AppCompat.Caption"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:maxLines="1"
android:ellipsize="end"
android:layout_marginBottom="8dp"
android:fontFamily="sans-serif-light"
android:text="@{viewModel.promotedStoryObservable.topicName}"
android:textAllCaps="true"
android:textSize="14sp" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<TextView
android:id="@+id/chapter_name_text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:maxLines="1"
android:ellipsize="end"
android:layout_marginEnd="16dp"
android:fontFamily="sans-serif-medium"
android:text="@{viewModel.promotedStoryObservable.nextChapterName}"
android:textSize="18sp"
android:textColor="@color/oppiaPrimaryText" />

<TextView
android:id="@+id/story_name_text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="16dp"
android:maxLines="1"
android:ellipsize="end"
android:fontFamily="sans-serif"
android:text="@{viewModel.promotedStoryObservable.storyName}"
android:textColor="@color/oppiaPrimaryText"
android:textSize="14sp" />

<TextView
android:id="@+id/topic_name_text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:maxLines="1"
android:ellipsize="end"
android:paddingBottom="8dp"
android:fontFamily="sans-serif-light"
android:text="@{viewModel.promotedStoryObservable.topicName}"
android:textAllCaps="true"
android:textSize="14sp"
android:textColor="@color/oppiaPrimaryText" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</com.google.android.material.card.MaterialCardView>
</layout>
6 changes: 4 additions & 2 deletions app/src/main/res/layout-land/promoted_story_list.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,8 @@
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
android:orientation="horizontal"
android:gravity="center_vertical">

<TextView
android:id="@+id/recently_played_stories_text_view"
Expand All @@ -35,7 +36,8 @@
<TextView
android:id="@+id/view_all_text_view"
android:layout_width="wrap_content"
android:layout_height="48dp"
android:layout_height="wrap_content"
android:minHeight="48dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="72dp"
android:fontFamily="sans-serif-medium"
Expand Down
Loading

0 comments on commit 49f3522

Please sign in to comment.