Блог

Я создал пустой шаблон действия Compose, используя Android Studio Canara 2020.03. Вот код файла » MainActivity. kt «:

 class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
            setContent {
                ButtonPage()
            }
        }
}
@Composable
fun ButtonPage(){
    Button(onClick = {}){Text("Click to go next")}
}
@Composable 
fun TextPage(){
    Text("Second Page")
}
 

Как мне изменить код, чтобы при нажатии на эту кнопку отображался только текст? (То есть вам нужно, чтобы при нажатии на кнопку программа рисовала другой контент, сначала удалив этот).
Версия Jetpack Compose 1.0.0-alpha09, версия jdk 15, версия Android 11
Заранее благодарю

Простым решением было бы иметь переменную, которая определяет текущий экран.

 var showSecondScreen by remember { mutableStateOf(false) }
if (!showSecondScreen) {
  Button(onClick = {showSecondScreen = true}){Text("Click to go next")}
} else {
  Text("Second screen")
}
 

Это не обязательно должно быть логическим значением, вы можете объявить var currentScreen by remember { mutableStateOf("homeScreen") } и использовать when блок, для которого отображается экран.

 @Composable fun MyApp(currentScreen: String) {
  when (currentScreen) {
    "homeScreen" -> HomeScreen()
    "secondScreen" -> SecondScreen()
  }
}
 

Таким образом, вы можете думать об этом не столько как о транзакции, сколько как о навигации с отслеживанием состояния.

Но вскоре вы поймете, что это не справляется с обратной навигацией, поэтому вам понадобится библиотека навигации, такая как jetpack compose navigation, decompose, compose-router и т. Д. Вот дополнительная информация о jetpack compose navigation.