ComposeFadingEdges: Enrich your Android Compose UI with fading edges
| Setup Guide | Report new issue
The ComposeFadingEdges
is a powerful Android Compose library that seamlessly incorporates customisable fading edges with horizontal or vertical orientations, static or scrollable content, clip or color draw.
Features:
ScrollState
, LazyListState
, LazyGridState
, LazyStaggeredGridState
.Sample 1 | Sample 2 | Sample 3 |
---|---|---|
Download or clone this repository to discover the sample app.
Add to the root settings.gradle.kts
:
dependencyResolutionManagement {
repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
repositories {
mavenCentral()
maven { url 'https://jitpack.io' }
}
}
Add to the package build.gradle.kts
:
dependencies {
implementation("com.github.GIGAMOLE:ComposeFadingEdges:{latest-version}")
}
Latest version: .
Also, it's possible to download the latest artifact from the releases page.
The ComposeFadingEdges
comes with multiple Modifiers
: Modifier.horizontalFadingEdges(...)
, Modifier.verticalFadingEdges(...)
, etc.
For more technical and detailed documentation, read the library KDoc
.
The fading edges Modifiers
are available for different content orientation and type.
Param | Description |
---|---|
orientation |
The fading edges orientation: Horizontal or Vertical . |
gravity |
The fading edges gravity: All , Start , or End . |
length |
The fading edges length. |
contentType |
The FadingEdgesContentType . |
fillType |
The FadingEdgesFillType . |
In case, contentType
is not provided, the FadingEdgesContentType
equals to Static
.
The ComposeFadingEdges
also provides fading edges for text marquee.
The FadingEdgesContentType
can be Static
or Dynamic
.
The Dynamic
content sub-type can be the following:
Scroll
: The dynamic fading edges for a ScrollState
content.Lazy.List
: The dynamic fading edges for a LazyListState
content.Lazy.Grid
: The dynamic fading edges for a LazyGridState
content.Lazy.StaggeredGrid
: The dynamic fading edges for a LazyStaggeredGridState
content.The Dynamic
content type requires FadingEdgesScrollConfig
.
The FadingEdgesScrollConfig
can be Dynamic
, Full
or Static
.
All of them can configure fading edges scroll based offset animationSpec
.
The Dynamic
configuration comes with additional params:
Param | Description |
---|---|
isLerpByDifferenceForPartialContent |
Determines whether the fading edges should interpolate their scroll offset length for partial content. |
scrollFactor |
The fading edges scroll factor. |
The FadingEdgesFillType
can be FadeClip
or FadeColor
.
The fading edges fill gradient is automatically faded from max alpha to min alpha.
All of them can configure fading edges fill gradient fillStops
and secondStopAlpha
.
The FadeClip
type clips the content with the fading edges fill gradient.
The FadeColor
type requires a color
param and draws the fading edges fill gradient over the content.
The utility Modifier
to add fading edges to the text marquee (custom or default basicMarquee
).
This Modifier
comes with common fading edges params and a few additional params:
Param | Description |
---|---|
isMarqueeAutoLayout |
Determines whether the horizontalFadingEdges(...) and text marquee should be automatically aligned during the layout process to accommodate additional text paddings required for proper fading edges drawing. |
isMarqueeAutoPadding |
Determines if padding values according to the gravity and length should be applied. |
marqueeProvider |
The custom or default basicMarquee provider. |
MIT License. See the LICENSE file for more details.
Special thanks to the GoDaddy for the amazing color picker library.