Измените альфа — представление после изменения пульсации в Jetpack compose

#android #android-jetpack-compose

Вопрос:

Я хочу отобразить эффект пульсации после нажатия на представление, а также изменить его альфа после нажатия на него.
Однако эффект пульсации хорошо работает только в том случае, если альфа изменяется с 0,5-gt;1, когда альфа изменяется с 1-gt;gt;0,5, эффект пульсации отображается не полностью.

 fun Greeting2(name: String) {  val isProcessing = remember { mutableStateOf(false) }  Column(  modifier = Modifier  .padding(36.dp)  .alpha(if (isProcessing.value) 0.5f else 1f)  .clickable(  interactionSource = remember { MutableInteractionSource() },  indication = rememberRipple(bounded = false),  ) {  isProcessing.value = !isProcessing.value  }  ) {  Image(  painter = painterResource(R.drawable.ic_btn_speak_now),  contentDescription = "",  modifier = Modifier  .width(80.dp)  .height(80.dp)  )  Text(text = "Hello $name!")  } }  

Вот демонстрационная версия. Есть ли способ достичь как альфа-эффекта, так и эффекта пульсации вместе?

Ответ №1:

Я предполагаю, что это может быть связано с механизмом внутреннего отображения пульсации. Возможно, это своего рода столкновение между перестановками, происходящими как из-за изменения альфы, так и из-за распространяющейся пульсации. Чтобы исправить это, вы можете просто обернуть свою колонку в другую составную, вот так.

 @Preview @Composable fun Greeting2() {  val name = "Android!" // I used preview so had to remove the parameter  var isProcessing by remember { mutableStateOf(false) }  val alpha by animateFloatAsState(targetValue = if (isProcessing) 0.5f else 1f, animationSpec = keyframes { durationMillis = 1 })  Box(  Modifier  .alpha(alpha)  ){  Column(  modifier = Modifier  .padding(36.dp)  .clickable(  interactionSource = remember { MutableInteractionSource() },  indication = rememberRipple(bounded = false),  ) {  isProcessing = !isProcessing  }  ) {  Image(  painter = painterResource(R.drawable.ic_launcher_foreground),  contentDescription = "",  modifier = Modifier  .width(80.dp)  .height(80.dp)  )  Text(text = "Hello $name!")  }  } }  

Я мог бы внести некоторые изменения, но вы поняли идею. Кроме того, я завернул в коробку вместо поверхности, так как по умолчанию она имеет фон.

Комментарии:

1. хорошая идея разобраться с этой проблемой. Я постараюсь применить его

2. Я следую вашей идее, но я немного изменился. Вместо того , чтобы перемещать альфа в Box , я перемещаю прослушиватель щелчков в Box . Тогда изменение альфа-цвета не повлияет на цвет эффекта пульсации.

3. Хм. Имеет смысл.