@@ -11,7 +11,11 @@ import androidx.compose.runtime.Composable
1111import androidx.compose.ui.Modifier
1212import androidx.compose.ui.graphics.Color
1313import androidx.compose.ui.layout.Layout
14+ import androidx.compose.ui.layout.Placeable
15+ import androidx.compose.ui.platform.LocalContext
1416import androidx.compose.ui.platform.testTag
17+ import androidx.compose.ui.semantics.contentDescription
18+ import androidx.compose.ui.semantics.semantics
1519import androidx.compose.ui.tooling.preview.Preview
1620import androidx.compose.ui.unit.Dp
1721import androidx.compose.ui.unit.IntOffset
@@ -31,22 +35,16 @@ fun TagViewContainer(
3135 tagViewData : List <TagViewData >,
3236 tagViewContainerModifiers : TagViewContainerModifiers
3337) {
38+ // add more tag into the list
3439 val updatedTagViewData = tagViewData.toMutableList()
35- val moreTagModifier = TagViewModifiers .Builder ()
36- .shape(CircleShape )
37- .backgroundColor(Color .Black )
38- .textColor(Color .White )
39- .build()
40-
41- updatedTagViewData.add(TagViewData (" More" , moreTagModifier))
40+ val moreTag = tagViewContainerModifiers.moreTagConfiguration
41+ updatedTagViewData.add(moreTag)
4242
4343 with (tagViewContainerModifiers) {
4444 val modifier = Modifier
45+ val context = LocalContext .current
4546 Box (
4647 modifier = modifier
47- .width(width = width ? : Dp .Unspecified )
48- .height(height = height)
49- .defaultMinSize(minWidth = minWidth, minHeight = minHeight)
5048 .run {
5149 if (enableBorder) {
5250 border(
@@ -58,25 +56,39 @@ fun TagViewContainer(
5856 background(color = backgroundColor, shape = shape)
5957 }
6058 }
59+ .width(width = width ? : Dp .Unspecified )
60+ .height(height = height)
61+ .defaultMinSize(minWidth = minWidth, minHeight = minHeight)
6162 .clickable { }
63+ .semantics {
64+ this .contentDescription =
65+ context.getString(co.yml.coreui.ui.R .string.tag_view_container_accessibility_title)
66+ }
6267 .testTag(" tag_view_container" )
63- .padding(containerPaddingValues)
6468 .background(
6569 color = backgroundColor,
6670 shape = shape
6771 )
72+ .padding(containerPaddingValues)
6873 ) {
74+
75+
6976 TagViewContainerLayout (
7077 tagViewContainerModifiers = tagViewContainerModifiers,
7178 content = {
7279 updatedTagViewData.forEach {
7380 with (it) {
81+ val containerItemClick = {
82+ tagViewContainerModifiers.onClick.invoke(it)
83+ }
7484 TagView (
7585 text = text,
7686 leadingIcon = leadingIcon,
7787 trailingIcon = trailingIcon,
7888 enabled = enabled,
79- tagViewModifiers = tagViewModifiers
89+ tagViewModifiers = tagViewModifiers,
90+ overFlowText = " " ,
91+ onClick = containerItemClick
8092 )
8193 }
8294 }
@@ -104,12 +116,9 @@ fun TagViewContainerLayout(
104116 var currentRow = 0
105117 var currentOffset = IntOffset .Zero
106118
107- // todo sree_ check whether the padding is correct
108-
109119 val placeAbles = measurables.map { measurable ->
110- val placeAble = measurable.measure(looseConstraints)
120+ val placeAble: Placeable = measurable.measure(looseConstraints)
111121
112- // todo sree_ is horizontal and vertical space [surface] required
113122 if (currentOffset.x > 0f && currentOffset.x + placeAble.width + tagViewContainerModifiers.tagSpacingHorizontal.toPx()
114123 .toInt() > constraints.maxWidth
115124 ) {
@@ -178,6 +187,10 @@ fun TagViewContainerLayout(
178187 // check space to accommodate more tag
179188 Log .i(" check_placeable" , " index: $index next item has no space" )
180189 val moreTagPlaceAble = placeAbles.last()
190+ val remainingTags = placeAbles.lastIndex - 1 - index
191+
192+
193+ // tagViewContainerModifiers.moreTagConfiguration.overFlowText.invoke(remainingTags)
181194 val moreTagHorizontalSpace =
182195 moreTagPlaceAble.first.width + tagViewContainerModifiers.tagSpacingHorizontal.toPx()
183196 .toInt()
@@ -199,6 +212,7 @@ fun TagViewContainerLayout(
199212 // current item has no space
200213 // check space to accommodate more tag
201214 Log .i(" check_placeable" , " index: $index current item has no space" )
215+ val remainingTags = placeAbles.lastIndex - 1 - index
202216 val moreTagPlaceAble = placeAbles.last()
203217 val moreTagHorizontalSpace =
204218 moreTagPlaceAble.first.width + tagViewContainerModifiers.tagSpacingHorizontal.toPx()
@@ -225,6 +239,66 @@ fun TagViewContainerLayout(
225239@Composable
226240fun DefaultTagContainer () {
227241 val tagViewModifiers = TagViewModifiers .Builder ()
242+ .shape(CircleShape )
243+ .backgroundColor(Color .Black )
244+ .textColor(Color .White )
245+ .build()
246+ val tagViewData = listOf (
247+ TagViewData (text = " Tag 1" , tagViewModifiers = tagViewModifiers),
248+ TagViewData (text = " Tag 2" , tagViewModifiers = tagViewModifiers),
249+ TagViewData (text = " Tag 3" , tagViewModifiers = tagViewModifiers),
250+ TagViewData (text = " Tag 4" , tagViewModifiers = tagViewModifiers)
251+ )
252+
253+ val tagViewContainerModifiers = TagViewContainerModifiers .Builder ()
254+ .shape(RoundedCornerShape (10 .dp))
255+ .width(200 .dp)
256+ .height(120 .dp)
257+ .build()
258+
259+ TagViewContainer (
260+ tagViewData = tagViewData,
261+ tagViewContainerModifiers = tagViewContainerModifiers
262+ )
263+ }
264+
265+ @Preview(name = " Tag container with border" )
266+ @Composable
267+ fun BorderTagContainer () {
268+ val tagViewModifiers = TagViewModifiers .Builder ()
269+ .shape(CircleShape )
270+ .backgroundColor(Color .Black )
271+ .textColor(Color .White )
272+ .build()
273+ val tagViewData = listOf (
274+ TagViewData (text = " Tag 1" , tagViewModifiers = tagViewModifiers),
275+ TagViewData (text = " Tag 2" , tagViewModifiers = tagViewModifiers),
276+ TagViewData (text = " Tag 3" , tagViewModifiers = tagViewModifiers),
277+ TagViewData (text = " Tag 4" , tagViewModifiers = tagViewModifiers)
278+ )
279+
280+ val tagViewContainerModifiers = TagViewContainerModifiers .Builder ()
281+ .shape(RoundedCornerShape (10 .dp))
282+ .width(200 .dp)
283+ .height(120 .dp)
284+ .enableBorder(true )
285+ .borderColor(Color .Red )
286+ .borderWidth(1 .dp)
287+ .build()
288+
289+ TagViewContainer (
290+ tagViewData = tagViewData,
291+ tagViewContainerModifiers = tagViewContainerModifiers
292+ )
293+ }
294+
295+ @Preview(name = " Tag container with background" )
296+ @Composable
297+ fun BackgroundTagContainer () {
298+ val tagViewModifiers = TagViewModifiers .Builder ()
299+ .shape(CircleShape )
300+ .backgroundColor(Color .Black )
301+ .textColor(Color .White )
228302 .build()
229303 val tagViewData = listOf (
230304 TagViewData (text = " Tag 1" , tagViewModifiers = tagViewModifiers),
@@ -236,6 +310,8 @@ fun DefaultTagContainer() {
236310 val tagViewContainerModifiers = TagViewContainerModifiers .Builder ()
237311 .shape(RoundedCornerShape (10 .dp))
238312 .backgroundColor(Color .Gray )
313+ .width(200 .dp)
314+ .height(120 .dp)
239315 .build()
240316
241317 TagViewContainer (
0 commit comments