compose ui-实践1

@Preview(name = "mysign screen ")
@Composable
fun MySignScreen() {

    Scaffold(
        topBar = { MyTopbar() }, content = { MyContent()}
    )

}

@Composable
fun MyContent() {


    Column(modifier = Modifier.padding(20.dp)) {
        Spacer(modifier = Modifier.height(44.dp))

        val focusRequester = remember { FocusRequester() }
        val emailState = remember { EmailState() }
        Email(emailState, onImeAction = { focusRequester.requestFocus() })

        Spacer(modifier = Modifier.height(16.dp))

        val passwordState = remember { PasswordState() }
        Password(
            label = stringResource(id = R.string.password),
            passwordState = passwordState,
            modifier = Modifier.focusRequester(focusRequester),
            onImeAction = {   }
        )
        Spacer(modifier = Modifier.height(16.dp))

        Button(
            onClick = {  },
            modifier = Modifier
                .fillMaxWidth()
               ,
            enabled = true
        ) {
            Text(
                text = "login "
            )
        }


        Spacer(modifier = Modifier.height(16.dp))
        TextButton(
            onClick = {

            },
            modifier = Modifier.fillMaxWidth()
        ) {
            Text(text = stringResource(id = R.string.forgot_password))
        }



        Text(
            text = stringResource(id = R.string.or),
            style = MaterialTheme.typography.subtitle2,
          textAlign = TextAlign.Center,
            modifier = Modifier.paddingFromBaseline(top = 25.dp).fillMaxWidth()



        )


        OutlinedButton(
            onClick = {},
            modifier = Modifier
                .fillMaxWidth()
                .padding(top = 20.dp, bottom = 24.dp)
        ) {
            Text(text = stringResource(id = R.string.sign_in_guest))
        }
    }




}


@Composable
fun MyTopbar() {
    SignInSignUpTopAppBar("xxxx", {})
}