CircularProgressIndicator:无法正确调整大小

huangapple go评论110阅读模式
英文:

CircularProgressIndicator: Can't resize properly

问题

我的代码:

  1. Row (
  2. modifier = Modifier.fillMaxWidth().padding(16.dp),
  3. verticalAlignment = Alignment.CenterVertically
  4. ) {
  5. Checkbox(
  6. checked = checked,
  7. enabled = habit.enabled,
  8. onCheckedChange = { checked = !checked },
  9. modifier = Modifier.size(23.dp).padding(end = 8.dp)
  10. )
  11. CircularProgressIndicator(
  12. progress = animatedProgress,
  13. modifier = Modifier.size(23.dp).padding(end = 8.dp)
  14. )
  15. Icon(
  16. imageVector = habit.icon,
  17. contentDescription = null,
  18. modifier = Modifier.padding(end = 8.dp)
  19. )
  20. Text(
  21. text = LocalContext.current.getString(habit.stringResourceId),
  22. maxLines = 1
  23. )
  24. }

这是它的输出:

CircularProgressIndicator:无法正确调整大小

我希望它与复选框和图标的大小相同,但由于某种原因它没有达到这个效果。

英文:

My code:

  1. Row (
  2. modifier = Modifier.fillMaxWidth().padding(16.dp),
  3. verticalAlignment = Alignment.CenterVertically
  4. ) {
  5. Checkbox(
  6. checked = checked,
  7. enabled = habit.enabled,
  8. onCheckedChange = { checked = !checked },
  9. modifier = Modifier.size(23.dp).padding(end = 8.dp)
  10. )
  11. CircularProgressIndicator(
  12. progress = animatedProgress,
  13. modifier = Modifier.size(23.dp).padding(end = 8.dp)
  14. )
  15. Icon(
  16. imageVector = habit.icon,
  17. contentDescription = null,
  18. modifier = Modifier.padding(end = 8.dp)
  19. )
  20. Text(
  21. text = LocalContext.current.getString(habit.stringResourceId),
  22. maxLines = 1
  23. )
  24. }

Here's what it outputs:

CircularProgressIndicator:无法正确调整大小

I want it to be the same size as checkbox and icon, but it does that for some reason.

答案1

得分: 1

请注意,我将为您提供代码的翻译,但是我无法显示图片。以下是您提供的代码的翻译:

将Row的每个项目使用Box布局包装,使用以下代码片段。

  1. @Preview(showBackground = true)
  2. @Composable
  3. fun Test() {
  4. Row(
  5. modifier = Modifier
  6. .fillMaxWidth()
  7. .padding(16.dp),
  8. verticalAlignment = Alignment.CenterVertically
  9. ) {
  10. val modifier = Modifier
  11. .padding(end = 8.dp)
  12. Box(
  13. modifier = modifier,
  14. ) {
  15. Checkbox(
  16. checked = true,
  17. enabled = true,
  18. onCheckedChange = {},
  19. modifier = Modifier.size(23.dp)
  20. )
  21. }
  22. Box(
  23. modifier = modifier,
  24. ) {
  25. CircularProgressIndicator(
  26. progress = 0.9f,
  27. strokeWidth = 2.dp,
  28. modifier = Modifier.size(23.dp)
  29. )
  30. }
  31. Box(
  32. modifier = modifier,
  33. ) {
  34. Icon(
  35. imageVector = Icons.Default.Info,
  36. contentDescription = null,
  37. modifier = Modifier
  38. .size(23.dp)
  39. )
  40. }
  41. Text(
  42. text = "Some Text Goes Here",
  43. maxLines = 1
  44. )
  45. }
  46. }

上述代码片段将产生以下结果。

CircularProgressIndicator:无法正确调整大小

英文:

Wrap each item of Row with Box layout, Use below code snippet.

  1. @Preview(showBackground = true)
  2. @Composable
  3. fun Test() {
  4. Row(
  5. modifier = Modifier
  6. .fillMaxWidth()
  7. .padding(16.dp),
  8. verticalAlignment = Alignment.CenterVertically
  9. ) {
  10. val modifier = Modifier
  11. .padding(end = 8.dp)
  12. Box(
  13. modifier = modifier,
  14. ) {
  15. Checkbox(
  16. checked = true,
  17. enabled = true,
  18. onCheckedChange = {},
  19. modifier = Modifier.size(23.dp)
  20. )
  21. }
  22. Box(
  23. modifier = modifier,
  24. ) {
  25. CircularProgressIndicator(
  26. progress = 0.9f,
  27. strokeWidth = 2.dp,
  28. modifier = Modifier.size(23.dp)
  29. )
  30. }
  31. Box(
  32. modifier = modifier,
  33. ) {
  34. Icon(
  35. imageVector = Icons.Default.Info,
  36. contentDescription = null,
  37. modifier = Modifier
  38. .size(23.dp)
  39. )
  40. }
  41. Text(
  42. text = "Some Text Goes Here",
  43. maxLines = 1
  44. )
  45. }
  46. }

This above code snippet will yield result like this.

CircularProgressIndicator:无法正确调整大小

huangapple
  • 本文由 发表于 2023年8月9日 11:24:40
  • 转载请务必保留本文链接:https://go.coder-hub.com/76864361.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定