Skip to content

Commit 9377172

Browse files
AdamGrzybkowskiAdamGrzybkowski
authored
QuickEditor height adjustments for the new Scopes (#635)
* Limit the sheet height to the bottom of the status bar * Animate content size of AboutEditor * Update sheet detens/initial detent with new Scopes
1 parent 0ffd9ac commit 9377172

File tree

5 files changed

+105
-54
lines changed

5 files changed

+105
-54
lines changed

‎gravatar-quickeditor/src/main/java/com/gravatar/quickeditor/ui/abouteditor/AboutEditor.kt

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
package com.gravatar.quickeditor.ui.abouteditor
22

3+
import androidx.compose.animation.animateContentSize
34
import androidx.compose.foundation.border
45
import androidx.compose.foundation.layout.Box
56
import androidx.compose.foundation.layout.Column
@@ -105,7 +106,11 @@ internal fun AboutEditor(
105106
}
106107

107108
Surface {
108-
Box(modifier = Modifier.wrapContentSize()) {
109+
Box(
110+
modifier = Modifier
111+
.wrapContentSize()
112+
.animateContentSize(),
113+
) {
109114
AboutEditor(
110115
uiState = uiState,
111116
onEvent = { event ->

‎gravatar-quickeditor/src/main/java/com/gravatar/quickeditor/ui/editor/QuickEditorScopeOption.kt

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,13 @@ public class QuickEditorScopeOption private constructor(
4747
is Scope.AvatarPicker -> AboutInputField.all
4848
}
4949

50+
internal val initialPage: QuickEditorPage
51+
get() = when (scope) {
52+
is Scope.AvatarPicker -> QuickEditorPage.AvatarPicker
53+
is Scope.AboutEditor -> QuickEditorPage.AboutEditor
54+
is Scope.AvatarPickerAndAboutEditor -> scope.config.initialPage.internalType
55+
}
56+
5057
public companion object {
5158
internal val default = QuickEditorScopeOption(
5259
scope = Scope.AvatarPicker(AvatarPickerConfiguration.default),

‎gravatar-quickeditor/src/main/java/com/gravatar/quickeditor/ui/editor/QuickEditorViewModel.kt

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -121,14 +121,7 @@ internal class QuickEditorViewModelFactory(
121121
}
122122
}
123123

124-
private val QuickEditorScopeOption.initialPage: QuickEditorPage
125-
get() = when (scope) {
126-
is Scope.AvatarPicker -> QuickEditorPage.AvatarPicker
127-
is Scope.AboutEditor -> QuickEditorPage.AboutEditor
128-
is Scope.AvatarPickerAndAboutEditor -> scope.config.initialPage.internalType
129-
}
130-
131-
private val AvatarPickerAndAboutEditorConfiguration.Page.internalType: QuickEditorPage
124+
internal val AvatarPickerAndAboutEditorConfiguration.Page.internalType: QuickEditorPage
132125
get() = when (this) {
133126
AvatarPicker -> QuickEditorPage.AvatarPicker
134127
AboutEditor -> QuickEditorPage.AboutEditor

‎gravatar-quickeditor/src/main/java/com/gravatar/quickeditor/ui/editor/bottomsheet/GravatarQuickEditorBottomSheet.kt

Lines changed: 90 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,9 @@ import android.content.res.Configuration
44
import android.graphics.Color
55
import androidx.compose.foundation.background
66
import androidx.compose.foundation.isSystemInDarkTheme
7+
import androidx.compose.foundation.layout.Box
78
import androidx.compose.foundation.layout.Column
9+
import androidx.compose.foundation.layout.PaddingValues
810
import androidx.compose.foundation.layout.WindowInsets
911
import androidx.compose.foundation.layout.WindowInsetsSides
1012
import androidx.compose.foundation.layout.asPaddingValues
@@ -13,6 +15,7 @@ import androidx.compose.foundation.layout.imePadding
1315
import androidx.compose.foundation.layout.navigationBars
1416
import androidx.compose.foundation.layout.only
1517
import androidx.compose.foundation.layout.padding
18+
import androidx.compose.foundation.layout.statusBars
1619
import androidx.compose.foundation.layout.widthIn
1720
import androidx.compose.foundation.shape.RoundedCornerShape
1821
import androidx.compose.material3.MaterialTheme
@@ -54,6 +57,8 @@ import com.gravatar.quickeditor.ui.editor.GravatarQuickEditorDismissReason
5457
import com.gravatar.quickeditor.ui.editor.GravatarQuickEditorPage
5558
import com.gravatar.quickeditor.ui.editor.GravatarQuickEditorParams
5659
import com.gravatar.quickeditor.ui.editor.GravatarUiMode
60+
import com.gravatar.quickeditor.ui.editor.QuickEditorPage
61+
import com.gravatar.quickeditor.ui.editor.QuickEditorScopeOption
5762
import com.gravatar.quickeditor.ui.editor.UpdateHandler
5863
import com.gravatar.ui.GravatarTheme
5964
import com.gravatar.ui.LocalGravatarTheme
@@ -84,7 +89,7 @@ public fun GravatarQuickEditorBottomSheet(
8489
authenticationMethod = authenticationMethod,
8590
updateHandler = updateHandler,
8691
onDismiss = onDismiss,
87-
modalDetents = gravatarQuickEditorParams.scopeOption.avatarPickerContentLayout.modalDetents(),
92+
modalDetents = gravatarQuickEditorParams.scopeOption.modalDetents(),
8893
)
8994
}
9095

@@ -120,7 +125,7 @@ public fun GravatarQuickEditorBottomSheet(
120125
}
121126
},
122127
onDismiss = onDismiss,
123-
modalDetents = gravatarQuickEditorParams.scopeOption.avatarPickerContentLayout.modalDetents(),
128+
modalDetents = gravatarQuickEditorParams.scopeOption.modalDetents(),
124129
)
125130
}
126131

@@ -261,36 +266,49 @@ private fun GravatarModalBottomSheet(
261266
Scrim(
262267
scrimColor = MaterialTheme.colorScheme.scrim.copy(alpha = 0.32f),
263268
)
264-
Sheet(
269+
Box(
265270
modifier = Modifier
266-
.imePadding()
267-
.clip(RoundedCornerShape(topStart = 28.dp, topEnd = 28.dp))
268-
.background(MaterialTheme.colorScheme.surfaceColorAtElevation(1.dp))
269-
.widthIn(max = 640.dp)
270-
.fillMaxWidth()
271271
.padding(
272-
WindowInsets.navigationBars
273-
.only(WindowInsetsSides.Vertical)
274-
.asPaddingValues(),
272+
paddingValues = if (configuration.orientation == Configuration.ORIENTATION_LANDSCAPE) {
273+
PaddingValues(0.dp)
274+
} else {
275+
WindowInsets.statusBars
276+
.only(WindowInsetsSides.Top)
277+
.asPaddingValues()
278+
},
275279
),
276280
) {
277-
val window = LocalModalWindow.current
278-
val isDarkTheme = isSystemInDarkTheme()
279-
LaunchedEffect(Unit) {
280-
window.navigationBarColor = Color.TRANSPARENT
281-
WindowInsetsControllerCompat(window, window.decorView).isAppearanceLightNavigationBars =
282-
!isDarkTheme
283-
}
284-
Surface(
281+
Sheet(
285282
modifier = Modifier
286-
.fillMaxWidth(),
287-
tonalElevation = 1.dp,
283+
.imePadding()
284+
.clip(RoundedCornerShape(topStart = 28.dp, topEnd = 28.dp))
285+
.background(MaterialTheme.colorScheme.surfaceColorAtElevation(1.dp))
286+
.widthIn(max = 640.dp)
287+
.fillMaxWidth()
288+
.padding(
289+
WindowInsets.navigationBars
290+
.only(WindowInsetsSides.Vertical)
291+
.asPaddingValues(),
292+
),
288293
) {
289-
Column(
290-
horizontalAlignment = Alignment.CenterHorizontally,
294+
val window = LocalModalWindow.current
295+
val isDarkTheme = isSystemInDarkTheme()
296+
LaunchedEffect(Unit) {
297+
window.navigationBarColor = Color.TRANSPARENT
298+
WindowInsetsControllerCompat(window, window.decorView).isAppearanceLightNavigationBars =
299+
!isDarkTheme
300+
}
301+
Surface(
302+
modifier = Modifier
303+
.fillMaxWidth(),
304+
tonalElevation = 1.dp,
291305
) {
292-
QEDragHandle()
293-
content()
306+
Column(
307+
horizontalAlignment = Alignment.CenterHorizontally,
308+
) {
309+
QEDragHandle()
310+
content()
311+
}
294312
}
295313
}
296314
}
@@ -300,35 +318,63 @@ private fun GravatarModalBottomSheet(
300318
}
301319
}
302320

303-
internal val peek = SheetDetent(identifier = "peek") { containerHeight, _ ->
321+
private val peek = SheetDetent(identifier = "peek") { containerHeight, _ ->
304322
containerHeight * 0.6f
305323
}
306324

307325
@Composable
308-
internal fun AvatarPickerContentLayout.modalDetents(): ModalDetents {
326+
internal fun QuickEditorScopeOption.modalDetents(): ModalDetents {
309327
val windowHeightSizeClass = currentWindowAdaptiveInfo().windowSizeClass.windowHeightSizeClass
310-
val initialDetent = if (windowHeightSizeClass == WindowHeightSizeClass.COMPACT) {
311-
FullyExpanded
312-
} else {
313-
when (this) {
314-
AvatarPickerContentLayout.Horizontal -> FullyExpanded
315-
AvatarPickerContentLayout.Vertical -> peek
316-
}
317-
}
318328

319-
val detents = buildList {
320-
add(Hidden)
321-
if (this@modalDetents == AvatarPickerContentLayout.Horizontal) {
322-
add(FullyExpanded)
323-
} else {
329+
val detents = buildDetentsList()
330+
val initialDetent = initialDetent(windowHeightSizeClass)
331+
332+
return ModalDetents(
333+
initialDetent = if (detents.contains(initialDetent)) initialDetent else detents.last(),
334+
detents = detents,
335+
)
336+
}
337+
338+
private fun QuickEditorScopeOption.buildDetentsList(): List<SheetDetent> {
339+
return when (this.scope) {
340+
is QuickEditorScopeOption.Scope.AvatarPickerAndAboutEditor,
341+
is QuickEditorScopeOption.Scope.AboutEditor,
342+
-> buildList {
343+
add(Hidden)
324344
add(peek)
325345
add(FullyExpanded)
326346
}
347+
348+
is QuickEditorScopeOption.Scope.AvatarPicker -> buildList {
349+
add(Hidden)
350+
if (avatarPickerContentLayout == AvatarPickerContentLayout.Vertical) {
351+
add(peek)
352+
}
353+
add(FullyExpanded)
354+
}
355+
}
356+
}
357+
358+
private fun QuickEditorScopeOption.initialDetent(windowHeightSizeClass: WindowHeightSizeClass): SheetDetent {
359+
return if (windowHeightSizeClass == WindowHeightSizeClass.COMPACT) {
360+
FullyExpanded
361+
} else {
362+
when (this.scope) {
363+
is QuickEditorScopeOption.Scope.AboutEditor -> peek
364+
is QuickEditorScopeOption.Scope.AvatarPickerAndAboutEditor,
365+
is QuickEditorScopeOption.Scope.AvatarPicker,
366+
-> {
367+
if (
368+
this.avatarPickerContentLayout == AvatarPickerContentLayout.Horizontal &&
369+
this.initialPage == QuickEditorPage.AvatarPicker
370+
) {
371+
FullyExpanded
372+
} else {
373+
peek
374+
}
375+
}
376+
}
327377
}
328-
return ModalDetents(
329-
initialDetent = initialDetent,
330-
detents = detents,
331-
)
332378
}
333379

334380
internal data class ModalDetents(

‎gravatar-quickeditor/src/main/java/com/gravatar/quickeditor/ui/editor/extensions/QuickEditorExtensions.kt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ internal fun addQuickEditorToView(
2525
authenticationMethod = authenticationMethod,
2626
updateHandler = updateHandler,
2727
onDismiss = onDismiss,
28-
modalDetents = gravatarQuickEditorParams.scopeOption.avatarPickerContentLayout.modalDetents(),
28+
modalDetents = gravatarQuickEditorParams.scopeOption.modalDetents(),
2929
onCurrentDetentChanged = {
3030
if (it == Hidden) {
3131
viewGroup.removeView(this)

0 commit comments

Comments
 (0)