Iterate design on the scroll to bottom FAB, and make it visible on preview.

This commit is contained in:
Benoit Marty 2023-07-03 13:36:04 +02:00 committed by Benoit Marty
parent 8d46fc2138
commit 14d314f87c

View file

@ -22,6 +22,7 @@ import androidx.compose.foundation.layout.BoxScope
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.size
import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.LazyListState import androidx.compose.foundation.lazy.LazyListState
@ -30,7 +31,6 @@ import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.shape.CircleShape import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.icons.Icons import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.ArrowDownward import androidx.compose.material.icons.filled.ArrowDownward
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.derivedStateOf import androidx.compose.runtime.derivedStateOf
@ -41,6 +41,7 @@ import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.runtime.saveable.rememberSaveable import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalInspectionMode
import androidx.compose.ui.res.pluralStringResource import androidx.compose.ui.res.pluralStringResource
import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.tooling.preview.PreviewParameter import androidx.compose.ui.tooling.preview.PreviewParameter
@ -60,6 +61,7 @@ import io.element.android.libraries.designsystem.theme.components.FloatingAction
import io.element.android.libraries.designsystem.theme.components.Icon import io.element.android.libraries.designsystem.theme.components.Icon
import io.element.android.libraries.matrix.api.core.EventId import io.element.android.libraries.matrix.api.core.EventId
import io.element.android.libraries.matrix.api.core.UserId import io.element.android.libraries.matrix.api.core.UserId
import io.element.android.libraries.theme.ElementTheme
import kotlinx.collections.immutable.ImmutableList import kotlinx.collections.immutable.ImmutableList
import kotlinx.coroutines.launch import kotlinx.coroutines.launch
@ -245,8 +247,8 @@ internal fun BoxScope.TimelineScrollHelper(
} }
} }
// Jump to bottom button // Jump to bottom button (display also in previews)
if (!shouldAutoScrollToBottom) { if (!shouldAutoScrollToBottom || LocalInspectionMode.current) {
FloatingActionButton( FloatingActionButton(
onClick = { onClick = {
coroutineScope.launch { coroutineScope.launch {
@ -259,12 +261,17 @@ internal fun BoxScope.TimelineScrollHelper(
}, },
shape = CircleShape, shape = CircleShape,
modifier = Modifier modifier = Modifier
.align(Alignment.BottomCenter) .align(Alignment.BottomEnd)
.size(40.dp), .padding(end = 16.dp, bottom = 12.dp)
containerColor = MaterialTheme.colorScheme.surfaceVariant, .size(36.dp),
contentColor = MaterialTheme.colorScheme.onSurfaceVariant containerColor = ElementTheme.colors.bgSubtleSecondary,
contentColor = ElementTheme.colors.iconSecondary
) { ) {
Icon(Icons.Default.ArrowDownward, "") Icon(
modifier = Modifier.size(24.dp),
imageVector = Icons.Filled.ArrowDownward,
contentDescription = "",
)
} }
} }
} }