@momo-kits/native-kits 0.113.1-beta.16 → 0.113.1-beta.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -137,7 +137,6 @@ fun Header(
137
137
  if (goBack != null && titlePosition == TitlePosition.LEFT) {
138
138
  Spacer(Modifier.width(40.dp))
139
139
  }
140
-
141
140
  if (inputSearchProps != null && !useAnimationSearch) {
142
141
  InputSearch(inputSearchProps = inputSearchProps.copy(backgroundColor = backgroundSearch))
143
142
  } else {
@@ -33,9 +33,6 @@ import vn.momo.kits.const.Spacing
33
33
  import vn.momo.kits.platform.getScreenDimensions
34
34
  import vn.momo.kits.utils.bottomBorder
35
35
 
36
- private const val SCREEN_PADDING = 12
37
- private const val BACK_WIDTH = 28
38
-
39
36
  @Composable
40
37
  fun HeaderExtended(
41
38
  opacityAni: Float,
@@ -47,38 +44,17 @@ fun HeaderExtended(
47
44
  statusBarHeight: Dp,
48
45
  backgroundColor: Color
49
46
  ) {
50
- val screenWidth = getScreenDimensions().width
51
- val leftPosition = if (isBack) (BACK_WIDTH + 20).dp else 20.dp
52
- val searchWidth = screenWidth - (SCREEN_PADDING * 2)
53
-
54
- val backgroundSearch by animateColorAsState(
55
- targetValue = animateColor(
56
- AppTheme.current.colors.background.default,
57
- Colors.black_01,
58
- opacityAni
59
- ),
60
- )
61
-
62
- val animatedTranslateX by animateFloatAsState(
63
- targetValue = (scrollState / 52f).coerceIn(0f, 1f) * (leftPosition.value - 12) + 12,
47
+ val animations = useHeaderSearchAnimation(
48
+ opacityAni = opacityAni,
49
+ scrollState = scrollState,
50
+ headerRightWidth = headerRightWidth,
51
+ statusBarHeight = statusBarHeight,
52
+ isBack = isBack
64
53
  )
65
54
 
66
- val animatedWidth by animateFloatAsState(
67
- targetValue = (scrollState / 52f).coerceIn(
68
- 0f,
69
- 1f
70
- ) * ((searchWidth - leftPosition.value - headerRightWidth.value + 12) - searchWidth) + searchWidth,
71
- )
72
-
73
- val animatedHeight by animateFloatAsState(
74
- targetValue = (1 - (scrollState / 52f).coerceIn(
75
- 0f,
76
- 1f
77
- )) * (statusBarHeight.value + 94 - (statusBarHeight.value + 52)) + (statusBarHeight.value + 52),
78
- )
79
55
  Box(
80
56
  modifier = Modifier.fillMaxWidth()
81
- .height(animatedHeight.dp)
57
+ .height(animations.height.dp)
82
58
  ) {
83
59
  Box(
84
60
  modifier = Modifier
@@ -132,16 +108,16 @@ fun HeaderExtended(
132
108
  modifier = Modifier
133
109
  .height(52.dp)
134
110
  .offset(
135
- x = animatedTranslateX.dp
111
+ x = animations.translateX.dp
136
112
  )
137
113
  .padding(vertical = Spacing.S)
138
114
  .align(Alignment.BottomStart)
139
115
  ) {
140
116
  Box(
141
117
  modifier = Modifier
142
- .width(animatedWidth.dp)
118
+ .width(animations.width.dp)
143
119
  .background(
144
- color = backgroundSearch,
120
+ color = animations.backgroundSearch,
145
121
  shape = RoundedCornerShape(Radius.XL)
146
122
  )
147
123
  ) {
@@ -165,7 +165,7 @@ fun Screen(
165
165
  Spacer(modifier = Modifier.padding(top = statusBarHeight + 52.dp + layoutOffset))
166
166
  }
167
167
 
168
- if (useAnimationSearch && headerType == HeaderType.EXTENDED && inputSearchProps != null) {
168
+ if (useAnimationSearch && inputSearchProps != null && headerType == HeaderType.EXTENDED) {
169
169
  Spacer(modifier = Modifier.padding(top = statusBarHeight))
170
170
  }
171
171
  content()
@@ -0,0 +1,69 @@
1
+ package vn.momo.kits.application
2
+
3
+ import androidx.compose.animation.animateColorAsState
4
+ import androidx.compose.animation.core.animateFloatAsState
5
+ import androidx.compose.runtime.Composable
6
+ import androidx.compose.runtime.getValue
7
+ import androidx.compose.ui.graphics.Color
8
+ import androidx.compose.ui.unit.Dp
9
+ import androidx.compose.ui.unit.dp
10
+ import vn.momo.kits.const.AppTheme
11
+ import vn.momo.kits.const.Colors
12
+ import vn.momo.kits.platform.getScreenDimensions
13
+
14
+ data class HeaderAnimations(
15
+ val opacity: Float,
16
+ val backgroundSearch: Color,
17
+ val translateX: Float,
18
+ val width: Float,
19
+ val height: Float
20
+ )
21
+
22
+ private const val SCREEN_PADDING = 12
23
+ private const val BACK_WIDTH = 28
24
+
25
+ @Composable
26
+ fun useHeaderSearchAnimation(
27
+ opacityAni: Float,
28
+ scrollState: Int,
29
+ headerRightWidth: Dp,
30
+ statusBarHeight: Dp,
31
+ isBack: Boolean
32
+ ): HeaderAnimations {
33
+ val screenWidth = getScreenDimensions().width
34
+ val leftPosition = if (isBack) (BACK_WIDTH + 20).dp else 20.dp
35
+ val searchWidth = screenWidth - (SCREEN_PADDING * 2)
36
+
37
+ val backgroundSearch by animateColorAsState(
38
+ targetValue = animateColor(
39
+ AppTheme.current.colors.background.default,
40
+ Colors.black_01,
41
+ opacityAni
42
+ ),
43
+ )
44
+
45
+ val animatedTranslateX by animateFloatAsState(
46
+ targetValue = (scrollState / 52f).coerceIn(0f, 1f) * (leftPosition.value - 12) + 12,
47
+ )
48
+
49
+ val animatedWidth by animateFloatAsState(
50
+ targetValue = (scrollState / 52f).coerceIn(
51
+ 0f,
52
+ 1f
53
+ ) * ((searchWidth - leftPosition.value - headerRightWidth.value + 12) - searchWidth) + searchWidth,
54
+ )
55
+
56
+ val animatedHeight by animateFloatAsState(
57
+ targetValue = (1 - (scrollState / 52f).coerceIn(
58
+ 0f,
59
+ 1f
60
+ )) * (statusBarHeight.value + 94 - (statusBarHeight.value + 52)) + (statusBarHeight.value + 52),
61
+ )
62
+ return HeaderAnimations(
63
+ opacity = opacityAni,
64
+ backgroundSearch = backgroundSearch,
65
+ translateX = animatedTranslateX,
66
+ width = animatedWidth,
67
+ height = animatedHeight
68
+ )
69
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@momo-kits/native-kits",
3
- "version": "0.113.1-beta.16",
3
+ "version": "0.113.1-beta.20",
4
4
  "private": false,
5
5
  "dependencies": {},
6
6
  "devDependencies": {},
Binary file