Skip to content

Commit f4770ae

Browse files
author
Vasyl Melnyk
committed
- Updated versions.
- Added support for LazyGrid and LazyStaggeredGrid.
1 parent 0fae400 commit f4770ae

46 files changed

Lines changed: 1050 additions & 262 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

ComposeFadingEdges/src/main/kotlin/com/gigamole/composefadingedges/FadingEdges.kt

Lines changed: 686 additions & 176 deletions
Large diffs are not rendered by default.

ComposeFadingEdges/src/main/kotlin/com/gigamole/composefadingedges/content/FadingEdgesContentType.kt

Lines changed: 90 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@ package com.gigamole.composefadingedges.content
22

33
import androidx.compose.foundation.ScrollState
44
import androidx.compose.foundation.lazy.LazyListState
5+
import androidx.compose.foundation.lazy.grid.LazyGridState
6+
import androidx.compose.foundation.lazy.staggeredgrid.LazyStaggeredGridState
57
import com.gigamole.composefadingedges.content.scrollconfig.FadingEdgesScrollConfig
68
import com.gigamole.composefadingedges.fadingEdges
79
import com.gigamole.composefadingedges.fill.FadingEdgesFillType
@@ -16,27 +18,92 @@ import com.gigamole.composefadingedges.fill.FadingEdgesFillType
1618
sealed interface FadingEdgesContentType {
1719

1820
/** The fading edges for a static content. The fading edges are always fully shown. */
19-
object Static : FadingEdgesContentType
20-
21-
/**
22-
* The fading edges for a [ScrollState] scrollable content.
23-
*
24-
* @property scrollState The scrollable container state.
25-
* @property scrollConfig The fading edges scroll configuration.
26-
*/
27-
data class Scroll(
28-
val scrollState: ScrollState,
29-
val scrollConfig: FadingEdgesScrollConfig = FadingEdgesContentTypeDefaults.ScrollConfig
30-
) : FadingEdgesContentType
31-
32-
/**
33-
* The fading edges for a [LazyListState] scrollable content.
34-
*
35-
* @property lazyListState The lazy list state.
36-
* @property scrollConfig The fading edges scroll configuration.
37-
*/
38-
data class LazyList(
39-
val lazyListState: LazyListState,
40-
val scrollConfig: FadingEdgesScrollConfig = FadingEdgesContentTypeDefaults.ScrollConfig
41-
) : FadingEdgesContentType
21+
data object Static : FadingEdgesContentType
22+
23+
/** The fading edges for a dynamic content. The fading edges are dynamic by the scroll amount. */
24+
sealed interface Dynamic : FadingEdgesContentType {
25+
26+
/** The fading edges scroll configuration. */
27+
val scrollConfig: FadingEdgesScrollConfig
28+
29+
/** Indicates whether the scroll is possible. */
30+
val isScrollPossible: Boolean
31+
32+
/**
33+
* The fading edges for a [ScrollState] scrollable content.
34+
*
35+
* @property scrollConfig The fading edges scroll configuration.
36+
* @property state The scrollable container state.
37+
*/
38+
data class Scroll(
39+
override val scrollConfig: FadingEdgesScrollConfig = FadingEdgesContentTypeDefaults.ScrollConfig,
40+
val state: ScrollState
41+
) : Dynamic {
42+
43+
/** Indicates whether the scroll is possible. */
44+
override val isScrollPossible: Boolean
45+
get() = state.canScrollForward || state.canScrollBackward
46+
}
47+
48+
/** The fading edges for a dynamic lazy content. */
49+
sealed interface Lazy : Dynamic {
50+
51+
/**
52+
* The fading edges for a [LazyListState] scrollable content.
53+
*
54+
* @property scrollConfig The fading edges scroll configuration.
55+
* @property state The lazy list state.
56+
*/
57+
data class List(
58+
override val scrollConfig: FadingEdgesScrollConfig = FadingEdgesContentTypeDefaults.ScrollConfig,
59+
val state: LazyListState
60+
) : Lazy {
61+
62+
/** Indicates whether the scroll is possible. */
63+
override val isScrollPossible: Boolean
64+
get() = state.canScrollForward || state.canScrollBackward
65+
}
66+
67+
/**
68+
* The fading edges for a [LazyGridState] scrollable content.
69+
*
70+
* @property scrollConfig The fading edges scroll configuration.
71+
* @property state The lazy list state.
72+
* @property spanCount The grid span count.
73+
*/
74+
data class Grid(
75+
override val scrollConfig: FadingEdgesScrollConfig = FadingEdgesContentTypeDefaults.ScrollConfig,
76+
val state: LazyGridState,
77+
val spanCount: Int
78+
) : Lazy {
79+
80+
/** Indicates whether the scroll is possible. */
81+
override val isScrollPossible: Boolean
82+
get() = state.canScrollForward || state.canScrollBackward
83+
}
84+
85+
/**
86+
* The fading edges for a [LazyStaggeredGridState] scrollable content.
87+
*
88+
* The ComposeFadingEdges library highly recommends to use a [scrollConfig] with a provided [FadingEdgesScrollConfig.animationSpec], because staggered layout
89+
* sometimes can be unpredicted and some items can be placed in the way that the interpolation between these items is too short or almost zero, which causes
90+
* some fading edges jumps. Also, [LazyStaggeredGridState.layoutInfo] item spacing, before and after content paddings, causes some extra calculations, so if
91+
* it is possible, add these padding to the items/cards instead, to improve performance.
92+
*
93+
* @property scrollConfig The fading edges scroll configuration.
94+
* @property state The lazy list state.
95+
* @property spanCount The staggered grid span count.
96+
*/
97+
data class StaggeredGrid(
98+
override val scrollConfig: FadingEdgesScrollConfig = FadingEdgesContentTypeDefaults.ScrollConfig,
99+
val state: LazyStaggeredGridState,
100+
val spanCount: Int
101+
) : Lazy {
102+
103+
/** Indicates whether the scroll is possible. */
104+
override val isScrollPossible: Boolean
105+
get() = state.canScrollForward || state.canScrollBackward
106+
}
107+
}
108+
}
42109
}

ComposeFadingEdges/src/main/kotlin/com/gigamole/composefadingedges/content/scrollconfig/FadingEdgesScrollConfig.kt

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,14 @@ package com.gigamole.composefadingedges.content.scrollconfig
22

33
import androidx.compose.animation.core.AnimationSpec
44
import com.gigamole.composefadingedges.content.FadingEdgesContentType
5-
import com.gigamole.composefadingedges.content.scrollconfig.FadingEdgesScrollConfig.Dynamic
65
import com.gigamole.composefadingedges.fadingEdges
76
import com.gigamole.composefadingedges.lerpLazyListPartialContentByDifference
87

98
/**
10-
* The fading edges scroll config for [FadingEdgesContentType.Scroll] and [FadingEdgesContentType.LazyList] types.
9+
* The fading edges scroll config for [FadingEdgesContentType.Dynamic] types.
1110
*
1211
* The ComposeFadingEdges advises using an animation (custom or default [FadingEdgesScrollConfigDefaults.AnimationSpec]) to provide an interactive fading edges size
13-
* transitions (due to the dynamic items size or partial content). Especially useful for [Dynamic].
12+
* transitions (due to the dynamic items size or partial content).
1413
*
1514
* @see FadingEdgesContentType
1615
* @see fadingEdges
@@ -24,9 +23,9 @@ sealed interface FadingEdgesScrollConfig {
2423
* The dynamic fading edges scroll configuration interpolates their lengths on the scroll offset. The fading edges fade in when the content is away from the edges and
2524
* fade out as it gets closer. The fading edges are fully hidden when the content size is not scrollable.
2625
*
27-
* The [isLerpByDifferenceForPartialContent] functionality is useful when the [FadingEdgesContentType.Scroll] or [FadingEdgesContentType.LazyList] combined content
28-
* size (items size and offset) is slightly larger than the viewport size but smaller than the fading edges length. By enabling this feature, the fading edges can
29-
* smoothly interpolate their scroll offset length by considering the partial content difference, rather than fading edges length.
26+
* The [isLerpByDifferenceForPartialContent] functionality is useful when the [FadingEdgesContentType.Dynamic] combined content size (items size and offset) is
27+
* slightly larger than the viewport size but smaller than the fading edges length. By enabling this feature, the fading edges can smoothly interpolate their scroll
28+
* offset length by considering the partial content difference, rather than fading edges length.
3029
*
3130
* @property animationSpec The fading edges scroll animation specification.
3231
* @property isLerpByDifferenceForPartialContent Determines whether the fading edges should interpolate their scroll offset length for partial content.

ComposeFadingEdges/src/main/kotlin/com/gigamole/composefadingedges/content/scrollconfig/FadingEdgesScrollConfigDefaults.kt

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,9 +29,9 @@ object FadingEdgesScrollConfigDefaults {
2929
/**
3030
* Determines whether the fading edges should interpolate their scroll offset length for partial content.
3131
*
32-
* This functionality is useful when the [FadingEdgesContentType.Scroll] or [FadingEdgesContentType.LazyList] combined content size (items size and offset) is
33-
* slightly larger than the viewport size but smaller than the fading edges length. By enabling this feature, the fading edges can smoothly interpolate their
34-
* scroll offset length by considering the partial content difference, rather than fading edges length.
32+
* This functionality is useful when the [FadingEdgesContentType.Dynamic] combined content size (items size and offset) is slightly larger than the viewport size
33+
* but smaller than the fading edges length. By enabling this feature, the fading edges can smoothly interpolate their scroll offset length by considering the
34+
* partial content difference, rather than fading edges length.
3535
*
3636
* @see FadingEdgesDefaults
3737
* @see fadingEdges

ComposeFadingEdges/src/main/kotlin/com/gigamole/composefadingedges/fill/FadingEdgesFillTypeDefaults.kt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ object FadingEdgesFillTypeDefaults {
2525
*
2626
* @see SecondStopAlpha
2727
*/
28-
val SecondStopAlpha: Float = 0.5F
28+
const val SecondStopAlpha: Float = 0.5F
2929

3030
/** The default values for [FadingEdgesFillType.FadeColor]. */
3131
object FadeColor {

README.md

Lines changed: 16 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -12,10 +12,10 @@ The `ComposeFadingEdges` is a powerful Android Compose library that seamlessly i
1212
Features:
1313

1414
- **Multiple Modifiers:** Add fading edges with custom orientation, gravity, length, content and fill type.
15-
- **Different Contents:** Support for static, scrollable, and lazy list content types.
15+
- **Scrolls States:** Ready for `ScrollState`, `LazyListState`, `LazyGridState`, `LazyStaggeredGridState`.
1616
- **Scrolling Settings:** Configure fading edges scroll behavior with dynamic, full, or static settings.
17-
- **Adjustable Fade:** Choose between fade clip or fade color fill types for fading edges.
1817
- **Text Marquee:** Easily add fading edges to text marquee with automatic layout alignment.
18+
- **Adjustable Fade:** Choose between fade clip or fade color fill types for fading edges.
1919
- **Sample App:** Explore and experiment with [sample app](#sample-app).
2020

2121
## Sample App
@@ -53,8 +53,8 @@ Also, it's possible to download the latest artifact from the [releases page](htt
5353

5454
## Guide
5555

56-
The `ComposeFadingEdges` comes with multiple `Modifiers`: [`Modifier.horizontalFadingEdges(...)`](#Fading-Edges-Modifiers)
57-
, [`Modifier.verticalFadingEdges(...)`](#Fading-Edges-Modifiers), etc.
56+
The `ComposeFadingEdges` comes with multiple `Modifiers`: [`Modifier.horizontalFadingEdges(...)`](#fading-edges-modifiers)
57+
, [`Modifier.verticalFadingEdges(...)`](#fading-edges-modifiers), etc.
5858

5959
For more technical and detailed documentation, read the library `KDoc`.
6060

@@ -67,18 +67,25 @@ The fading edges `Modifiers` are available for different content orientation and
6767
|`orientation`|The fading edges orientation: `Horizontal` or `Vertical`.|
6868
|`gravity`|The fading edges gravity: `All`, `Start`, or `End`.|
6969
|`length`|The fading edges length.|
70-
|`contentType`|The [`FadingEdgesContentType`](#FadingEdgesContentType).|
71-
|`fillType`|The [`FadingEdgesFillType`](#FadingEdgesFillType).|
70+
|`contentType`|The [`FadingEdgesContentType`](#fadingedgescontentType).|
71+
|`fillType`|The [`FadingEdgesFillType`](#fadingedgesfilltype).|
7272

7373
In case, `contentType` is not provided, the `FadingEdgesContentType` equals to `Static`.
7474

7575
The `ComposeFadingEdges` also provides fading edges for [text marquee](#modifiermarqueehorizontalfadingedges).
7676

7777
### FadingEdgesContentType
7878

79-
The `FadingEdgesContentType` can be `Static`, `Scroll` or `LazyList`.
79+
The `FadingEdgesContentType` can be `Static` or `Dynamic`.
80+
81+
The `Dynamic` content sub-type can be the following:
82+
83+
- `Scroll`: The dynamic fading edges for a `ScrollState` content.
84+
- `Lazy.List`: The dynamic fading edges for a `LazyListState` content.
85+
- `Lazy.Grid`: The dynamic fading edges for a `LazyGridState` content.
86+
- `Lazy.StaggeredGrid`: The dynamic fading edges for a `LazyStaggeredGridState` content.
8087

81-
The `Scroll`/`LazyList` content type require `ScrollState`/`LazyListState` and [`FadingEdgesScrollConfig`](#FadingEdgesScrollConfig).
88+
The `Dynamic` content type requires [`FadingEdgesScrollConfig`](#fadingedgesscrollconfig).
8289

8390
#### FadingEdgesScrollConfig
8491

@@ -109,7 +116,7 @@ The `FadeColor` type requires a `color` param and draws the fading edges fill gr
109116

110117
The utility `Modifier` to add fading edges to the text marquee (custom or default `basicMarquee`).
111118

112-
This `Modifier` comes with common [fading edges params](#Fading-Edges-Modifiers) and a few additional params:
119+
This `Modifier` comes with common [fading edges params](#fading-edges-modifiers) and a few additional params:
113120

114121
|Param|Description|
115122
|-|-|
3.77 KB
Loading

0 commit comments

Comments
 (0)