JetpackCompose

Remember dipakai untuk memberitahu jetpack compose bahwa variabel itu harus diingat nilainya apabila terjadi recomposition (proses menggambar ulang ui karna perubahan nilai state) misal gini, jika kita buat variabel var counter = mutableStateOf(0) Button( onClick = { counter++ } ){ Tex("+") } yang terjadi dengan kode di atas adalah saat counter diklik memang dia akan bertambah nialninya jadi 1 tapi karna terjadi pemanggilan fungsi lagi dari atas maka variabel counter ini akan dibuat ulang lagi jadi 0 nah karna kembali ke 0 jadi tidak berubah deh di layar kalau mutableState itu sebuah helper function yang digunakan untuk memebri tahu composable bahwa variabel ini perlu diawasi alias variabel ini dia nilainya akan berubah dan harus memepngaruhi ui, jika tidak pakai ini maka perubahan akan diabaikan oleh ui dan tidak terjadi recomposition ...

@Composable fun AddPlusMinusButton() { val primaryOrange = Color(0xFFED954D) val lightPeach = Color(0xFFFAF0E7) val lightCream = Color(0xFFFFF6EE) val darkGray = Color(0xFF2C2C2C) val textGray = Color(0xFF8C8C8C) val dividerColor = Color(0xFFEFEFEF) Scaffold() { paddingValues -> Box( modifier = Modifier.fillMaxSize() ) { Row( modifier = Modifier .clip(RoundedCornerShape(8.dp)) .background(lightCream) .padding(horizontal = 4.dp, vertical = 2.dp) .align( Alignment.Center ), verticalAlignment = Alignment.CenterVertically, horizontalArrangement = Arrangement.Center ) { // Minus Button Box( modifier = Modifier .size(28.dp) .clickable { }, contentAlignment = Alignment.Center ) { Text( text = "–", fontSize = 16.sp, fontWeight = FontWeight.Medium, color = darkGray ) } // Quantity Value Text( text = "$2", fontSize = 15.sp, fontWeight = FontWeight.Medium, color = darkGray, modifier = Modifier.padding(horizontal = 8.dp) ) // Plus Button Box( modifier = Modifier .size(28.dp) .clickable { }, contentAlignment = Alignment.Center ) { Text( text = "+", fontSize = 16.sp, fontWeight = FontWeight.Medium, color = darkGray ) } } } } }

Untuk membuat garis lengkung di jepatck compose dengan cara melakukan clipping pada shape bisa menggunakan perintah quadraticTo(x1,y1,x2,y2) begini cara pakainya //di sini mau buat bentuk yang mirip huruf u class QuadraticPath:Shape{ size: Size, layoutDirection: LayoutDirection, density: Density ): Outline { val path = Path().apply{ moveTo(0f,0f) //posisi awal pena pojok kiri atas lineTo(size.width,0f) // ditarik garis ke pojok kanan atas val ySide = size.height - 100 // kita mau tarik agar sebelum tepat jatuh setinggi ukuran dia sudah mulai melengkung lineTo(size.width,ySide) // tarik garis mendekati ukuran quadraticTo( x1 = sise.width/2f, // posisi magnet mau diletakkan di tengah layar y1 = size.height+50 // kalau isi plus berarti nanti akan ditarik ke bawah x2 = 0f // kita pengin titk horizontal terakhir itu ke aras pojok kiri bawah y2 = ySide // kita pengin titik vertikal terakhir itu ada di ySized jadi dia nanti setinggi lengkungan di sisi kanan seperti di lineTo(size.width,ySide) // tarik garis mendekati ukuran ) close() } return Outline.Generic(path) } } Contoh ...