This message was deleted.

# compose

[Slackbot]

This message was deleted.

[Nthily]

Row {
  Text("Hello")
  Box(
    modifier = Modifier.padding(16.dp)
//                .thenIf(true) { border(10.dp, Color.Red) }
      .border(10.dp, Color.Red)
      .size(60.dp)
      .background(Color.Blue)
  )
  Text("World!")
}

result is :

[Nthily]

Row {
  Text("Hello")
  Box(
    modifier = Modifier.padding(16.dp)
      .thenIf(true) { border(10.dp, Color.Red) }
      .size(60.dp)
      .background(Color.Blue)
  )
  Text("World!")
}

result is:

[Nthily]

@Composable with thenIf has a larger Padding, but I don't know why this is the case, I would expect the result to be the same as the first one 🤔

[Nthily]

oh btw, in this case, my thenIf function is

inline fun Modifier.thenIf(
  condition: Boolean,
  modifier: Modifier.() -> Modifier,
): Modifier = if (condition) this.then(modifier()) else this

[Nthily]

if i use:

inline fun Modifier.thenIf(
  condition: Boolean,
  modifier: Modifier.() -> Modifier,
): Modifier = if (condition) modifier() else this

and

Row {
  Text("Hello")
  Box(
    modifier = Modifier.padding(16.dp)
      .thenIf(true) { border(10.dp, Color.Red) }
      .size(60.dp)
      .background(Color.Blue)
  )
  Text("World!")
}

the result will be the same as the first one

[Nthily]

I think the problem might be with inline + then, but is there anything special about the then method? 🤔

[Khubaib Khan]

No, There is no issues with thenif modifier. Basically, it's used as alternative of clickable.

[Sergey Dmitriev]

Because if (condition) modifier() else this will return modifier() or receiver’s Modifier
When this.then() version will return receiver’s Modifier + modifier() or just receiver’s Modifier

[Nthily]

but my function is inline , the if (condition) modifier() else this block will be replace by Modifier.xxxx.modifier() 🤔

[Sergey Dmitriev]

I’m not so sure about it 🙂

Not using this.then is actually en error: https://googlesamples.github.io/android-custom-lint-rules/checks/ModifierFactoryUnreferencedReceiver.md.html

I think the compiler gets confused because there is still an occurrence of this in the body, it’s there but used wrongly 🤔

[eygraber]

I believe this.then(modifier()) is causing the receiver to be used twice

[eygraber]

Because the receiver is in scope it becomes this.then(this.modifier()) which is using the padding modifier twice, hence the larger padding.

[Nthily]

oh 😯 it seems to make sense, I accidentally mixed up the scope of lambda 😭

[Zulfadhli]

maybe write then(Modifier.modifier())

[shikasd]

modifier() usually already does this.then for you
the correct version is if (condition) this.modifier() else this

[Nthily]

yes, I didn't realize that my lambda's were in the same Modifier scope before 😭🤧