Enable Auto-scrolling LazyColumn to the bottom when reverseLayout = false

See also questions close to this topic

• Do I still need to use traditional way to implement Preferences Settings Screen in Jetpack Compose?

  At present I use Jetpack Compose in my Android Studio project.

  I find many projects still to use traditional way to implement a Preferences Settings Screen after I Google it.

  I hope to implement a Preferences Settings Screen when I use Jetpack Compose, I don't know if there is a new way to implement Preferences Settings Screen, could you tell me?

  And more, from the official document, it still need to use XML resource and PreferenceFragmentCompat to create Preference screen. It seems that I havn't found a sample project to create Preference screen with Jetpack Compose or other way.

  But, from the document, it seems that SharedPreferences will be obsoleted.
• Admob Banner randomly changing from BANNER to FULL_BANNER size with Jetpack Compose

  I am integrating Admob's banners in my app, this app runs both in AndroidTV and Android, where it's running in mobile the dimensions must be 320x50(BANNER) which is part of the standard sizes in the docs, but it turns of nowhere to 468x60(FULL_BANNER), this behavior happens oftentimes when you run the app. I am using Jetpack Compose for this, and the add is placed inside a LazyColumn which is the equivalent to a recycler view

  My code for the banner is like this:

  enum class BannerSize {
      NORMAL,
      RECTANGLE;
  
      internal fun map(): AdSize = when (this) {
          NORMAL -> AdSize.BANNER
          RECTANGLE -> AdSize.MEDIUM_RECTANGLE
      }
  }
  
  
  
      /*
       This Composable goes inside a lazy column with other composable where I have a 
       when statement, where I look if the index is 0 or 5 which are the specific 
       indexes I want to place the ads.
      */
  @Composable
  internal fun BannerAd(
      modifier: Modifier = Modifier,
      size: BannerSize = BannerSize.NORMAL,
      id: String = "TODO",
      pos: String = "TODO",
      adId: String,
  ) {
      val isInEditMode = LocalInspectionMode.current
      if (!isInEditMode) {
          Box(
              modifier = modifier
                  .fillMaxWidth()
                  .padding(20.dp),
              contentAlignment = Alignment.Center
          ) {
              AndroidView(
                  modifier = modifier
                      .height(size.map().height.dp)
                      .width(size.map().width.dp),
                  factory = { context ->
                      Napier.d(
                          tag = "Ads",
                          message = "Creating Ad, id: $id, adId: $adId, pos: $pos, size: $size"
                      )
                      AdView(context).apply {
                          adListener = object : AdListener() {
                              override fun onAdFailedToLoad(p0: LoadAdError) {
                                  Napier.e(tag = "Ads", message = p0.message)
                              }
                          }
                          adSize = size.map()
                          adUnitId = adId
                          loadAd(
                              AdRequest.Builder()
                                  .addNetworkExtrasBundle(
                                      AdMobAdapter::class.java,
                                      Bundle().also {
                                          it.putString("pos", pos)
                                      }
                                  )
                                  .build()
                          )
                      }
                  }
              )
          }
      } else {
          EditModeText()
      }
  }
  

  

  Has someone encountered something like this while integrating ads with Compose? I've looking for some questions related to this, but I haven't found any
• Coil gives error while loading multiple image in parallel in jetpack compose

  I'm us jetpack compose in my project and coil to show the images. I have almost ten icons retrieved from the server and want to show them using coil since they are URL addresses. So I wrote this code:

  for (item in equipments.indices) {
  
                  AsyncImage(
                      modifier = Modifier.size(25.dp),
                      model = ImageRequest.Builder(LocalContext.current)
                          .data(equipments[item].icon)
                          .build(),
                      contentDescription = equipments[item].title,
                      onState = {
                          Log.i("Log", "Equipments: state is $it")
                      }
                  )
  
              }
  

  But when I looked at the log, I realized the coil was throwing the error:

  state is Error(painter=null, result=coil.request.ErrorResult@89c09f28)
  

  I realized the is also the same problem when not to use jetpack compose. And it is because of multiple threading. It was indicated to refer to the context to solve the problem. Like this, while using coil in main activity:

  ImageRequest.Builder(this).data(url)
  

  So I also tried to add LocalContext.current, but still the problem exists. How can I solve that?
• Nested State for checkbox in jetpack compose

  I have face problem related to states in jetpack compose. Problem is that I have list that contains questions. Some question need radio button for single selection and some question need checkbox for multiple selection. see below image..

  Screen shot example.

  Raio Buttino Code

  View Model class

  private val _isRadioChecked = mutableStateListOf<ResearchQuestion>()
  val optionState: List<ResearchQuestion> = _isRadioChecked
  
  fun setRadioChecked(index: Int,isChecked: ResearchQuestion) {
      _isRadioChecked[index] = isChecked
  }
  fun setRadioChecked(isChecked: ResearchQuestion) {
      _optionState.add(isChecked)
  }
  

  Data class -> ResearchQuestion

  val question: String = "",
  val isMultipleChoice: Boolean = false,
  val selectedMultipleOption: Set<Int> = emptySet(),
  val selectOption: Int = -1,
  

  Compose Screen -> Radio Button compose

  @Composable
  fun CodeRadioButton(
    options: List<String>,
    selectedOption: Int,
    onOptionSelected: (Int) -> Unit
  ) {
    options.forEachIndexed { index, option ->
      Row(
          modifier = Modifier
              .padding(vertical = 5.dp),
          verticalAlignment = Alignment.CenterVertically,
      ) {
          RadioButton(
              modifier = Modifier
                  .size(15.dp)
                  .padding(start = 15.dp),
              selected = (index == selectedOption),
              onClick = {
                  onOptionSelected(index)
              }
          )
          Spacer(modifier = Modifier.padding(horizontal = 15.dp))
          Text(
              modifier = Modifier
                  .clickable {
                      onOptionSelected(index)
                  },
              text = option,
              style = MaterialTheme.typography.body2
          )
          Spacer(modifier = Modifier.padding(vertical = 10.dp))
      }
    }
   }
  

  Compose Screen -> CheckBox Button compose

  @Composable
  fun CodeMultipleChoice(
    options: List<String>,
    isMultipleChecked: Set<Int>,
    onMultiOptionSelected: (List<Int>) -> Unit,
  ) {
  
    options.forEachIndexed { index, option ->
      Row(
          modifier = Modifier
              .padding(vertical = 5.dp),
          verticalAlignment = Alignment.CenterVertically,
      ) {
          Checkbox(
              modifier = Modifier
                  .size(15.dp)
                  .padding(start = 15.dp),
              checked = false, //State did not work
              onCheckedChange = {
                  //State did not work
              },
              colors = CheckboxDefaults.colors(
                  checkmarkColor = Color.White
              )
          )
          Spacer(modifier = Modifier.padding(horizontal = 15.dp))
          Text(
              modifier = Modifier
                  .clickable {
                      
                  },
              text = option,
              style = MaterialTheme.typography.body2
          )
          Spacer(modifier = Modifier.padding(vertical = 10.dp))
      }
    }
  }
  

  Noted: Radio button work perfectly but multiple selection(checkbox) state did not work. I create mutableStateList0f() but if check checkbox other question which having multiple question are also change.
• LazyColumn inside LazyColumn

  I am trying to create and list with sub list using LazyColumn with the code below

  DropdownMenu(
      expanded = expandedDomain,
      onDismissRequest = { expandedDomain = false },
  ) {
      LazyColumn {
          items(1) {
              Checkbox(checked = false /*checkedState.value*/,
                  onCheckedChange = {})
              Text(text = "$domainResponse.domains[0].name")
          }
          LazyColumn {
              items(domainResponse.domains[0].pwas) { pwas ->
                  Checkbox(checked = false /*checkedState.value*/,
                      onCheckedChange = {})
                  Text(text = "$pwas")
              }
          }
      }
  }
  

  Error:

  @Composable invocations can only happen from the context of a @Composable function