Android Jetpack Compose API Data to List View

UpdatedOctober 26, 2021

Comments

No comments yet. Be the first to comment.

Model–View–ViewModel (MVVM) is a software architectural pattern that facilitates the separation of the development of the GUI (the view) from the development of the business logic or back-end logic (the model) so that the view is not dependent on any...

More from this blog

Login / Logout Flow: SwiftUI and EnvironmentObject

EnvironmentObject is useful when you want to create a dependency in a higher component of the layout tree and use it on a lower component without having to pass it down the tree through every child component. We will now use EnvironmentObject to moni...

Nov 8, 20213 min read3.4K

Login / Logout Flow: SwiftUI and EnvironmentObject

Login / Logout Flow: Android Jetpack Compose and CompositionLocal

CompositionLocal is useful when you want to create a dependency in a higher node of the layout tree and use it on a lower node without having to pass it down the tree through every child Composable. Here we will use it to direct our application when ...

Nov 5, 20213 min read2.0K

Login / Logout Flow: Android Jetpack Compose and CompositionLocal

Getting Started with TDD: SwiftUI

The TDD (Test Driven Development) approach is important when it comes to testing small portions of business logic code in isolation. In this blog, I'll cover how I would use TDD to build a clean architecture To-do SwiftUI application I'll cover imp...

Oct 27, 20215 min read872

Getting Started with TDD: Kotlin and Jetpack Compose

Oct 27, 20214 min read484

Room(SQLite) and Kotlin

The Room persistence library provides an abstraction layer over SQLite. To use Room in your app, add the following dependencies to your app’s build.gradle file: dependencies { .... kapt "org.xerial:sqlite-jdbc:3.34.0" // Room def roo...

Oct 25, 20214 min read164

Nanosoft Code Foundation

18 posts

data class Todo( var userId: Int, var id: Int, var title: String, var completed: Boolean ) const val BASE_URL = "https://jsonplaceholder.typicode.com/" interface APIService { @GET("todos") suspend fun getTodos(): List<Todo> companion object { var apiService: APIService? = null fun getInstance(): APIService { if (apiService == null) { apiService = Retrofit.Builder() .baseUrl(BASE_URL) .addConverterFactory(GsonConverterFactory.create()) .build().create(APIService::class.java) } return apiService!! } } }

class TodoViewModel : ViewModel() { private val _todoList = mutableStateListOf<Todo>() var errorMessage: String by mutableStateOf("") val todoList: List<Todo> get() = _todoList fun getTodoList() { viewModelScope.launch { val apiService = APIService.getInstance() try { _todoList.clear() _todoList.addAll(apiService.getTodos()) } catch (e: Exception) { errorMessage = e.message.toString() } } } }

class MainActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { val vm = TodoViewModel() super.onCreate(savedInstanceState) setContent { MaterialTheme { TodoView(vm) } } } } @Composable fun TodoView(vm: TodoViewModel) { LaunchedEffect(Unit, block = { vm.getTodoList() }) Scaffold( topBar = { TopBar() }, content = { if (vm.errorMessage.isEmpty()) { TodoList(vm) } else { Text(vm.errorMessage) } } ) } @Composable private fun TodoList(vm: TodoViewModel) { Column(modifier = Modifier.padding(16.dp)) { LazyColumn(modifier = Modifier.fillMaxHeight()) { items(vm.todoList) { todo -> Column { Row( modifier = Modifier .fillMaxWidth() .padding(16.dp), horizontalArrangement = Arrangement.SpaceBetween ) { Box( modifier = Modifier .fillMaxWidth() .padding(0.dp, 0.dp, 16.dp, 0.dp) ) { Text( todo.title, maxLines = 1, overflow = TextOverflow.Ellipsis ) } Spacer(modifier = Modifier.width(16.dp)) Checkbox(checked = todo.completed, onCheckedChange = null) } Divider() } } } } } @Composable private fun TopBar() { TopAppBar( title = { Row { Text("Todos") } }) }

Android Jetpack Compose API Data to List View

Comments

Android

Android Jetpack Compose MVVM

More from this blog

Login / Logout Flow: SwiftUI and EnvironmentObject

Login / Logout Flow: Android Jetpack Compose and CompositionLocal

Getting Started with TDD: SwiftUI

Getting Started with TDD: Kotlin and Jetpack Compose

Room(SQLite) and Kotlin

The Todo APIService

The Todo ViewModel

The Todo View

Command Palette

Comments

Android

Android Jetpack Compose MVVM

More from this blog

The Todo APIService

The Todo ViewModel

The Todo View