[Android] UserListApp - UI -Part5

#android #kotlin #retrofit #api

Create UserViewModel

Here just one Event -> getDataBySize()
Inject UserRepository We created at part4

@HiltViewModel
class UserViewModel @Inject constructor(
    private val userRepository: UserRepository
) : ViewModel(){

    var state by mutableStateOf(
        listOf<User>()
    )
    private val _uiEvent = Channel<UiEvent>()
    var uiEvent = _uiEvent.receiveAsFlow()
    init {
        getDataBySize(20)
    }
    fun getDataBySize(size : Int = 20){
        viewModelScope.launch {
            userRepository.getUserBySize(size = size.toString()).collectLatest {
                when(it){
                    is Resource.Loading->{}
                    is Resource.Error->{
                        Log.d("TAG", "getDataBySize: ${it.message}")
                        _uiEvent.send(UiEvent.APIError)
                    }
                    is Resource.Success->{
                        it.data?.let {
                            state = it
                            Log.d("TAG", "getDataBySize: ${it}")
                        }
                    }
                }
            }
        }
    }



}

If API Failed , We can use UiEvent send Event to Screen

sealed class UiEvent{
    object APIError : UiEvent()
    object Success : UiEvent()
}

UI - UserScreen LazyColumn

@Composable
fun UserScreen(
    users : List<User>
) {
    LazyColumn{
        items(users){user ->
            UserItem(user)
        }
    }
}

UI - UserItem

@Composable
fun UserItem(
    user: User,
    modifier: Modifier = Modifier
) {
    Row(
        modifier = modifier
    ) {
        AsyncImage(
            modifier = Modifier
                .size(80.dp),
            model = user.avatar,
            contentDescription = null,
        )
        Column(
            modifier = Modifier
                .weight(1f)
                .fillMaxWidth()

        ) {
            Row{
                Icon(
                    imageVector = ImageVector.vectorResource(
                        id = when(user.gender){
                                "Male" -> R.drawable.baseline_man_24
                                "Female" -> R.drawable.baseline_woman_24
                                else->{
                                    R.drawable.baseline_question_mark_24
                                }
                            }
                    ),
                    tint = Color.Unspecified,
                    contentDescription = "gender mark"
                )
                Text(text = user.username)
            }
            Text(text = user.dateOfBirth)
            Text(text = user.email)
            Text(text = user.phoneNumber)


        }
    }

}