2

I have a glance widget that contains a column. The column has tiles containing text and image. The row has clickable modifier, however, I can click only the whitespace. Any way to solve this?

There is a similar question however the answer to it suggests reverting to alpha-03 but I have alpha-05 which I believe the bug should be solved.

Sample code:

Column(
        modifier = GlanceModifier
            .fillMaxSize()
            .cornerRadiusCompat(
                cornerRadius = 16,
                color = if(uiState.isDark)
                    LocalContext.current.getColor(R.color.dark_list_widget_background_color)
                else
                    LocalContext.current.getColor(R.color.light_list_widget_background_color)
            )
    ) {
        ListWidgetHeader(
            isDark = uiState.isDark,
            type = uiState.type
        )
        Box(
            modifier = GlanceModifier
                .fillMaxSize()
                .background(
                    if (uiState.isDark)
                        R.color.dark_list_widget_background_color
                    else
                        R.color.light_list_widget_background_color
                ),
            contentAlignment = Alignment.Center
        ) {
            ListWidgetContent(
                data = uiState.data,
                isDark = uiState.isDark,
                type = uiState.type
            )
        }
    }

@Composable
private fun ListWidgetContent(
    data: List<ListWidgetData>,
    isDark: Boolean,
    type: WidgetCategoryEnum
) {
    Column{
        data.forEachIndexed { index, model ->
            ListWidgetTile(
                model = model,
                isDark = isDark,
                bottomPadding = 16.dp,
                topPadding = if (index == 0) 16.dp else 0.dp,
                type = type
            )
        }
    }
}

@Composable
private fun ListWidgetTile(
    model: ListWidgetData,
    isDark: Boolean,
    bottomPadding: Dp,
    topPadding: Dp,
    type: WidgetCategoryEnum,
) {
    val action = // Some Action related to app-logic
    val intent = Intent(
        Intent.ACTION_VIEW,
        "${URL}/${Screens.Splash.navigateWithDeepLink(DeepLinkModel(model.id, action))}".toUri()
    )
    val bitmap = if(model.image != "") {
        model.image.decodeToBase64()
    } else {
        null
    }
    Row(
        modifier = GlanceModifier
            .fillMaxWidth()
            .padding(
                start = 24.dp,
                end = 15.dp,
                bottom = bottomPadding,
                top = topPadding
            )
            .clickable(
                actionStartActivity(intent)
            ) // WORKS ONLY IN WHITESPACE
    ) {
        Column(
            modifier = GlanceModifier
                .fillMaxWidth()
                .defaultWeight()
                .padding(
                    end = 8.dp
                )
                .clickable(
                    actionStartActivity(intent)
                ) // NOT WORKS
        ) {
            Text(
                text = model.source,
                style = TextStyle(
                    fontSize = 8.sp,
                    fontWeight = FontWeight.Medium,
                    color = ColorProvider(
                        resId = if (isDark)
                            R.color.dark_list_widget_source_time_color
                        else
                            R.color.light_list_widget_source_time_color
                    )
                ),
                modifier = GlanceModifier
                    .padding(
                        bottom = 8.dp
                    )
            )
            Text(
                text = model.title,
                style = TextStyle(
                    fontSize = 16.sp,
                    fontWeight = FontWeight.Bold,
                    color = ColorProvider(
                        resId = if (isDark)
                            R.color.dark_list_widget_title_color
                        else
                            R.color.light_list_widget_title_color
                    )
                ),
                maxLines = 3,
            )
        }
        if (bitmap != null) {
            Image(
                provider = ImageProvider(
                    bitmap
                ),
                contentDescription = "Image",
                modifier = GlanceModifier
                    .size(70.dp)
                    .imageCornerRadius(),
                contentScale = ContentScale.Crop
            )
        }
    }
}
Subfly
  • 492
  • 2
  • 13
  • If you think this might be a bug I would recommend you to submit a new bug at https://issuetracker.google.com/issues/new?component=1097239&template=1611667 – Marcel Nov 17 '22 at 09:05
  • I have the same issue, this was already addressed on Stackoverflow: https://stackoverflow.com/questions/73770486/glanceappwidget-with-clickable-row-inner-elements-steal-focus-and-clicks But actually the thread does not mention a source, so I'm not sure if this is really going to be addressed soon as it still occurs in 1.0.0-alpha05 – Patrick Lang Nov 21 '22 at 20:15
  • As I see In Kotlin slack channel, this fix will be released in next release. its already in snapshot version. Until then you have to add click to all the lowest possible children e.g. Text, images etc. – sha Nov 29 '22 at 03:14

0 Answers0