Skip to content

Commit c38a78a

Browse files
voyagerfancooltey
voyagerfan
and
cooltey
authored
Build a BottomSheet for the Explore Screen and add it the navigation path - T390121 (#5465)
* added explore screen, added navigation to YearInReviewActivity * add strings, route back to explore screen from onboarding screen * added button text string resource, minor formatting changes * address context in ImageView with 'it' and 'this' * remove padding constants and xml binding * Removed 'Scaffold' from 'YearInReviewBottomSheetScaffold' * added scrollstate YearInReviewBottomSheet to handle screen rotation * Moved ExclusiveBottomSheetPresenter for the Explore Screen to MainFragment * correct linting --------- Co-authored-by: cooltey <[email protected]>
1 parent 01f3e24 commit c38a78a

File tree

7 files changed

+157
-3
lines changed

7 files changed

+157
-3
lines changed

‎app/src/main/java/org/wikipedia/main/MainFragment.kt‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,7 @@ import org.wikipedia.util.TabUtil
8686
import org.wikipedia.views.NotificationButtonView
8787
import org.wikipedia.views.TabCountsView
8888
import org.wikipedia.watchlist.WatchlistActivity
89-
import org.wikipedia.yearinreview.YearInReviewActivity
89+
import org.wikipedia.yearinreview.YearInReviewDialog
9090
import java.io.File
9191
import java.util.concurrent.TimeUnit
9292

@@ -473,7 +473,7 @@ class MainFragment : Fragment(), BackPressedHandler, MenuProvider, FeedFragment.
473473
}
474474

475475
override fun yearInReviewClick() {
476-
startActivity(YearInReviewActivity.newIntent(requireActivity()))
476+
ExclusiveBottomSheetPresenter.show(childFragmentManager, YearInReviewDialog.newInstance())
477477
}
478478

479479
fun setBottomNavVisible(visible: Boolean) {

‎app/src/main/java/org/wikipedia/yearinreview/BottomSheetScaffold.kt‎

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
package org.wikipedia.yearinreview
2+
3+
import android.widget.ImageView
4+
import androidx.compose.foundation.layout.Arrangement
5+
import androidx.compose.foundation.layout.Column
6+
import androidx.compose.foundation.layout.aspectRatio
7+
import androidx.compose.foundation.layout.fillMaxWidth
8+
import androidx.compose.foundation.layout.padding
9+
import androidx.compose.foundation.layout.wrapContentHeight
10+
import androidx.compose.foundation.rememberScrollState
11+
import androidx.compose.foundation.shape.RoundedCornerShape
12+
import androidx.compose.foundation.verticalScroll
13+
import androidx.compose.material3.Button
14+
import androidx.compose.material3.ButtonDefaults
15+
import androidx.compose.material3.ExperimentalMaterial3Api
16+
import androidx.compose.material3.MaterialTheme
17+
import androidx.compose.material3.Text
18+
import androidx.compose.runtime.Composable
19+
import androidx.compose.ui.Alignment
20+
import androidx.compose.ui.Modifier
21+
import androidx.compose.ui.draw.clip
22+
import androidx.compose.ui.platform.LocalContext
23+
import androidx.compose.ui.res.stringResource
24+
import androidx.compose.ui.text.style.TextAlign
25+
import androidx.compose.ui.tooling.preview.Preview
26+
import androidx.compose.ui.unit.dp
27+
import androidx.compose.ui.viewinterop.AndroidView
28+
import com.bumptech.glide.Glide
29+
import org.wikipedia.R
30+
import org.wikipedia.compose.theme.WikipediaTheme
31+
32+
@OptIn(ExperimentalMaterial3Api::class)
33+
@Composable
34+
fun YearInReviewBottomSheet() {
35+
val context = LocalContext.current
36+
val scrollState = rememberScrollState()
37+
Column(
38+
modifier = Modifier
39+
.fillMaxWidth()
40+
.wrapContentHeight()
41+
.clip(RoundedCornerShape(topStart = 20.dp, topEnd = 20.dp))
42+
.padding(20.dp)
43+
.verticalScroll(scrollState),
44+
horizontalAlignment = Alignment.CenterHorizontally,
45+
verticalArrangement = Arrangement.spacedBy(10.dp)
46+
) {
47+
Text(
48+
modifier = Modifier.padding(
49+
horizontal = 30.dp
50+
),
51+
text = stringResource(R.string.year_in_review_explore_screen_title),
52+
color = WikipediaTheme.colors.primaryColor,
53+
style = MaterialTheme.typography.headlineSmall,
54+
textAlign = TextAlign.Center
55+
56+
)
57+
Text(
58+
modifier = Modifier.padding(
59+
horizontal = 45.dp
60+
),
61+
text = stringResource(R.string.year_in_review_explore_screen_bodytext),
62+
color = WikipediaTheme.colors.primaryColor,
63+
style = MaterialTheme.typography.bodyMedium,
64+
textAlign = TextAlign.Center
65+
)
66+
AndroidView(
67+
factory = {
68+
ImageView(it).apply {
69+
Glide.with(this)
70+
.asGif()
71+
.load(R.drawable.wyir_puzzle_4_v2)
72+
.centerCrop()
73+
.into(this)
74+
}
75+
},
76+
modifier = Modifier
77+
.fillMaxWidth()
78+
.aspectRatio(3f / 2f)
79+
.clip(RoundedCornerShape(16.dp))
80+
)
81+
Button(
82+
onClick = {
83+
context.startActivity((YearInReviewActivity.newIntent(context)))
84+
},
85+
modifier = Modifier
86+
.fillMaxWidth()
87+
.padding(horizontal = 20.dp),
88+
colors = ButtonDefaults.buttonColors(
89+
containerColor = WikipediaTheme.colors.progressiveColor,
90+
contentColor = WikipediaTheme.colors.paperColor
91+
)
92+
) {
93+
Text(
94+
text = stringResource(R.string.year_in_review_explore_screen_continue),
95+
color = WikipediaTheme.colors.paperColor,
96+
style = MaterialTheme.typography.labelLarge
97+
)
98+
}
99+
}
100+
}
101+
102+
@Preview
103+
@Composable
104+
fun PreviewBottomSheet() {
105+
YearInReviewBottomSheet()
106+
}

‎app/src/main/java/org/wikipedia/yearinreview/YearInReviewDialog.kt‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
package org.wikipedia.yearinreview
2+
3+
import android.os.Bundle
4+
import android.view.LayoutInflater
5+
import android.view.View
6+
import android.view.ViewGroup
7+
import androidx.compose.ui.platform.ComposeView
8+
import com.google.android.material.bottomsheet.BottomSheetBehavior
9+
import com.google.android.material.bottomsheet.BottomSheetDialog
10+
import org.wikipedia.compose.theme.BaseTheme
11+
import org.wikipedia.page.ExtendedBottomSheetDialogFragment
12+
13+
class YearInReviewDialog : ExtendedBottomSheetDialogFragment() {
14+
15+
override fun onCreateView(
16+
inflater: LayoutInflater,
17+
container: ViewGroup?,
18+
savedInstance: Bundle?
19+
): View? {
20+
(dialog as? BottomSheetDialog)?.behavior.apply {
21+
this?.state = BottomSheetBehavior.STATE_EXPANDED
22+
}
23+
return ComposeView(requireContext()).apply {
24+
setContent {
25+
BaseTheme {
26+
YearInReviewBottomSheet()
27+
}
28+
}
29+
}
30+
}
31+
32+
companion object {
33+
fun newInstance(): YearInReviewDialog {
34+
return YearInReviewDialog()
35+
}
36+
}
37+
}

‎app/src/main/java/org/wikipedia/yearinreview/YearInReviewScaffold.kt‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
package org.wikipedia.yearinreview
22

33
import android.widget.ImageView
4+
import androidx.activity.ComponentActivity
45
import androidx.compose.animation.animateColorAsState
56
import androidx.compose.animation.core.animateDpAsState
67
import androidx.compose.animation.core.tween
@@ -46,6 +47,7 @@ import androidx.compose.runtime.rememberCoroutineScope
4647
import androidx.compose.ui.Alignment
4748
import androidx.compose.ui.Modifier
4849
import androidx.compose.ui.draw.clip
50+
import androidx.compose.ui.platform.LocalContext
4951
import androidx.compose.ui.res.painterResource
5052
import androidx.compose.ui.res.stringResource
5153
import androidx.compose.ui.unit.dp
@@ -69,6 +71,8 @@ fun YearInReviewScreen(
6971
) {
7072
val coroutineScope = rememberCoroutineScope()
7173
val pagerState = rememberPagerState(pageCount = { totalPages })
74+
val context = LocalContext.current
75+
7276
Scaffold(
7377
containerColor = WikipediaTheme.colors.paperColor,
7478
topBar = {
@@ -86,6 +90,8 @@ fun YearInReviewScreen(
8690
IconButton(onClick = {
8791
if (totalPages > 1 && pagerState.currentPage != 0) {
8892
coroutineScope.launch { pagerState.animateScrollToPage(pagerState.currentPage - 1) }
93+
} else if (navController.currentDestination?.route == YearInReviewNavigation.Onboarding.name) {
94+
(context as? ComponentActivity)?.finish()
8995
} else {
9096
navController.navigate(
9197
route = YearInReviewNavigation.Onboarding.name)

‎app/src/main/res/drawable/wyir_puzzle_4_v2.gif‎

994 KB
Loading

‎app/src/main/res/values-qq/strings.xml‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1793,4 +1793,7 @@
17931793
<string name="year_in_review_read_count_bodytext">Body text for the year in review readcount page. \"%d\" represents the total number of articles in the HistoryEntry table for the current year</string>
17941794
<string name="year_in_review_edit_count_headline">Headline text for the year in review editcount page. \"%d\" represents the total number of userContribs for the current year</string>
17951795
<string name="year_in_review_edit_count_bodytext">Body text for the year in review editcount page. \"%d\" represents the total number of userContribs for the current year</string>
1796+
<string name="year_in_review_explore_screen_title">Headline for the year in review Explore Screen</string>
1797+
<string name="year_in_review_explore_screen_bodytext">Body text for the year in review Explore Screen</string>
1798+
<string name="year_in_review_explore_screen_continue">Button text for the year in review Explore Screen</string>
17961799
</resources>

‎app/src/main/res/values/strings.xml‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1876,5 +1876,7 @@
18761876
<string name="year_in_review_read_count_bodytext">This year, you read %d articles, including Climate change, Dogs, and Cats. Wikipedia had more than 63 million articles available across over 300 languages. You joined millions in expanding knowledge and exploring diverse topics.</string>
18771877
<string name="year_in_review_edit_count_headline">You edited Wikipedia %d times</string>
18781878
<string name="year_in_review_edit_count_bodytext">You edited Wikipedia %d times. Thank you for being one of the volunteer editors making a difference on Wikimedia projects around the world.</string>
1879-
1879+
<string name="year_in_review_explore_screen_title">Explore your Wikipedia in Review</string>
1880+
<string name="year_in_review_explore_screen_bodytext">See insights about what articles we read and edited, and share highlights from our year on Wikipedia.</string>
1881+
<string name="year_in_review_explore_screen_continue">Continue</string>
18801882
</resources>

0 commit comments

Comments
 (0)