Merge pull request #246 from amir1376/add-scroll-fade

add scroll fade
This commit is contained in:
AmirHossein Abdolmotallebi 2024-12-02 04:30:45 +03:30 committed by GitHub
commit 94fa2007ec
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 101 additions and 13 deletions

View File

@ -11,13 +11,18 @@ import com.abdownloadmanager.utils.compose.WithContentColor
import ir.amirab.util.compose.action.MenuItem
import com.abdownloadmanager.desktop.utils.div
import androidx.compose.foundation.*
import androidx.compose.foundation.gestures.Orientation
import androidx.compose.foundation.layout.*
import com.abdownloadmanager.desktop.ui.widget.Text
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import com.abdownloadmanager.utils.compose.widget.ScrollFade
import org.http4k.routing.inspect.BackgroundColour
@Composable
fun Actions(list: List<MenuItem>) {
@ -31,7 +36,8 @@ fun Actions(list: List<MenuItem>) {
for (a in list) {
when (a) {
MenuItem.Separator -> {
Spacer(Modifier
Spacer(
Modifier
.padding(horizontal = 4.dp)
.fillMaxHeight()
.padding(vertical = 4.dp)
@ -50,13 +56,11 @@ fun Actions(list: List<MenuItem>) {
}
}
}
val adapter = rememberScrollbarAdapter(scrollState)
HorizontalScrollbar(
modifier = Modifier
.align(Alignment.TopCenter)
.fillMaxWidth(),
adapter = adapter
ScrollFade(
scrollState,
Orientation.Horizontal,
gradientLength = 0.2f,
targetBackground = myColors.background / 0.8f
)
}
}

View File

@ -0,0 +1,84 @@
package com.abdownloadmanager.utils.compose.widget
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.foundation.ScrollState
import androidx.compose.foundation.background
import androidx.compose.foundation.gestures.Orientation
import androidx.compose.foundation.layout.BoxScope
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
@Composable
fun BoxScope.ScrollFade(
scrollState: ScrollState,
orientation: Orientation,
gradientLength: Float = 0.2f, // 0f .. 1f
targetBackground: Color,
) {
AnimatedVisibility(
scrollState.canScrollBackward,
modifier = Modifier.matchParentSize(),
enter = fadeIn(),
exit = fadeOut(),
) {
Spacer(
Modifier
.fillMaxSize()
.background(
Brush.gradientOrientation(
colorStops = arrayOf(
0f to targetBackground,
gradientLength to Color.Transparent,
1f to Color.Transparent,
),
orientation = orientation,
)
)
)
}
AnimatedVisibility(
scrollState.canScrollForward,
modifier = Modifier.matchParentSize(),
enter = fadeIn(),
exit = fadeOut(),
) {
Spacer(
Modifier
.fillMaxSize()
.background(
Brush.gradientOrientation(
colorStops = arrayOf(
0f to Color.Transparent,
(1 - gradientLength) to Color.Transparent,
1f to targetBackground,
),
orientation = orientation,
)
)
)
}
}
private fun Brush.Companion.gradientOrientation(
vararg colorStops: Pair<Float, Color>,
orientation: Orientation,
): Brush {
return when (orientation) {
Orientation.Vertical -> Brush.verticalGradient(
colorStops = colorStops
)
Orientation.Horizontal -> {
Brush.horizontalGradient(
colorStops = colorStops
)
}
}
}