Skip to content

Commit

Permalink
separated list and list card maker
Browse files Browse the repository at this point in the history
  • Loading branch information
vextorspace committed Jun 3, 2024
1 parent e37f9ea commit f8ef677
Show file tree
Hide file tree
Showing 3 changed files with 62 additions and 55 deletions.
4 changes: 3 additions & 1 deletion composeApp/src/commonMain/kotlin/App.kt
Original file line number Diff line number Diff line change
@@ -1,12 +1,14 @@
import androidx.compose.runtime.*
import model.Item
import model.ItemList
import view.ItemListCardMaker
import org.jetbrains.compose.ui.tooling.preview.Preview


@Composable
@Preview
fun App() {
val itemList = ItemList(listOf(Item("Card 1"), Item("Card 2"), Item("Card 3")), "Inbox")
itemList.compose()

ItemListCardMaker(itemList).compose()
}
55 changes: 1 addition & 54 deletions composeApp/src/commonMain/kotlin/model/ItemList.kt
Original file line number Diff line number Diff line change
@@ -1,60 +1,7 @@
package model

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material.Button
import androidx.compose.material.Card
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
import view.ItemCardMaker
data class ItemList(val items: List<Item> = listOf(), val label: String = "") {

class ItemList(val items: List<Item> = listOf(), val label: String = "") {

@Composable
fun compose() {
val itemList = remember {mutableStateListOf<Item>(*items.toTypedArray())}
val selectedCard = remember { mutableStateOf<Item?>(null)}

val onDeleteItem: (Item) -> Unit = {
val index = itemList.indexOf(it)

if(index != -1) {
itemList.removeAt(index)
}
}

MaterialTheme {
Card(Modifier.width(200.dp)) {
Column {
Text(label, style = MaterialTheme.typography.h4)

LazyColumn(
horizontalAlignment = Alignment.CenterHorizontally
) {
items(itemList) { item ->
key(item) {
ItemCardMaker(
item,
selectedCard,
onDeleteItem
).compose()
}
}
}

Button(onClick = { itemList += Item("New") }) {
Text("New Card", style = MaterialTheme.typography.body2)
}
}
}
}
}


}
58 changes: 58 additions & 0 deletions composeApp/src/commonMain/kotlin/view/ItemListCardMaker.kt
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
package view

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material.Button
import androidx.compose.material.Card
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
import model.Item
import model.ItemList

class ItemListCardMaker(val items: ItemList) {
@Composable
fun compose() {
val itemList = remember {mutableStateListOf<Item>(*items.items.toTypedArray())}
val selectedCard = remember { mutableStateOf<Item?>(null)}

val onDeleteItem: (Item) -> Unit = {
val index = itemList.indexOf(it)

if(index != -1) {
itemList.removeAt(index)
}
}

MaterialTheme {
Card(Modifier.width(200.dp)) {
Column {
Text(items.label, style = MaterialTheme.typography.h4)

LazyColumn(
horizontalAlignment = Alignment.CenterHorizontally
) {
items(itemList) { item ->
key(item) {
ItemCardMaker(
item,
selectedCard,
onDeleteItem
).compose()
}
}
}

Button(onClick = { itemList += Item("New") }) {
Text("New Card", style = MaterialTheme.typography.body2)
}
}
}
}
}
}

0 comments on commit f8ef677

Please sign in to comment.