Kotlin

Criação da interface de bate-papo

Para poder conversar, você precisará criar uma nova View para a interface de bate-papo. Para simplificar, vamos adicionar uma nova tela composable para exibir a interface do bate-papo e um terceiro composable para gerenciar a alternância entre as duas views.

No seu MainActivity.kt adicionar:

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun ChatScreen() {
    var text by remember { mutableStateOf("") }

    Column(
        modifier = Modifier.fillMaxSize(),
        horizontalAlignment = Alignment.CenterHorizontally,
        verticalArrangement = Arrangement.Bottom
    ) {
        LazyColumn(
            modifier = Modifier.fillMaxWidth()
        ) {
            
        }
        Row(){
            TextField(
                value = text,
                onValueChange = { text = it },
                label = { Text("Message") }
            )
            Button(onClick = { }) {
                Text("Send")
            }
        }
    }
}

Esta é a interface de usuário básica de um aplicativo de bate-papo, com LazyColumn que exibirá as mensagens, um TextField para digitar uma mensagem e enviá-la Button para enviar a mensagem.

A seguir, vamos criar o Composable que irá gerenciar a alternância entre as duas visualizações da interface do usuário. Adicione o Composable abaixo ao seu MainActivity.kt:

@Composable
fun ApplicationSwitcher() {
    val vm = LocalChatState.current
    val error = vm.error
    if (vm.isLoggedIn) {
        ChatScreen()
    } else {
        LoginScreen()
    }
    if(vm.isError){
        Toast.makeText(LocalContext.current, error, Toast.LENGTH_LONG).show()
        vm.isError = false
    }
}

Isso verificará o estado atual do isLoggedIn flag e exibir a interface de usuário correta, ele também exibirá um Toast quando um erro é detectado.

Por fim, atualize seu MainActivity classe para chamar o ApplicationSwitcher em vez do LoginScreen:

class MainActivity : ComponentActivity() {
    private val chatState by viewModels<ChatViewModel>()
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContent {
            CompositionLocalProvider(LocalChatState provides chatState) {
                ApplicationSwitcher()
            }
        }
    }
}

Compilar e executar

Execute o projeto novamente para abri-lo no simulador. Se você fizer login com um dos usuários, verá a interface de bate-papo

Chat interface