[android] ImageButton in Compose (IconButton) # Android View 시스템의 ImageButton 는 Compose 에서 'IconButton' 에 매칭된다. # IconButton 의 function signature 는 아래와 같다. @Composable fun IconButton( onClick: () -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, interactionSource: MutableInteractionSource = remember { MutableInteractionSource() }, content: @Composable () -> Unit ) # Button 과의 차이점은 IconButton 은 내부에 보통 Icon 을 포함하고, Button 은 내부에.. 2022. 9. 16. [android] compose instrumentation test tutorial # Compose Test 는 view 영역이기 때문에 Instrumentation test 를 통해야 한다. # test 를 위해 아래 dependency 가 필요하다. androidTestImplementation "androidx.compose.ui:ui-test-junit4:$compose_version" debugImplementation("androidx.compose.ui:ui-test-manifest:$compose_version") # TestRule 은 createComposeRule 을 사용한다. 만약 Activity 에 접근해야 한다면 createAndroidComposeRule()를 사용한다. class UiTests{ @get:Rule val composeTestRule = cr.. 2022. 9. 15. [android] Switch in Compose # Android View 시스템의 Switch 는 Compose 에서 동일한 이름인 'Switch' 를 사용한다. # Switch 의 function signature 는 아래와 같다. @Composable @OptIn(ExperimentalMaterialApi::class) fun Switch( checked: Boolean, onCheckedChange: ((Boolean) -> Unit)?, modifier: Modifier = Modifier, enabled: Boolean = true, interactionSource: MutableInteractionSource = remember { MutableInteractionSource() }, colors: SwitchColors = SwitchD.. 2022. 9. 14. [android] EditText in Compose (TextField) # Android View 시스템의 EditText 는 Compose 의 'TextField' 에 매칭된다. # TextField 의 function signature 는 아래와 같다. fun TextField( value: TextFieldValue, onValueChange: (TextFieldValue) -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, readOnly: Boolean = false, textStyle: TextStyle = LocalTextStyle.current, label: @Composable (() -> Unit)? = null, placeholder: @Composable (() -> Unit)? = nul.. 2022. 9. 13. [android] margin in Compose # Android View 시스템에서 margin 은 View 가 가지고 있는 속성이었지만, Compose 에서는 View 가 해당 속성을 가지지 않는다. 그래서 Modifier 에 padding 은 있지만 margin 은 없다. 그러면 Compose 에서 margin 은 어떻게 구현할까? # 사실 Compose 에서는 Android View 시스템에서 사용하던 box model 을 사용하지 않는다. 그래서 padding 이라는 말은 Android View 시스템의 padding 에 딱 맞지 않고, spacing (공간 주기)로만 이해하면 된다. # 가장 간단한 방법은 "Spacer" 라는 composable 을 이용하는 것! Text(text = "Hello!") Spacer(modifier = Mod.. 2022. 9. 12. [android] modifier in compose # Compose 의 Modifier 란 녀석을 View 를 꾸며주는 많은 역할을 한다. Modifier 자체는 interface 이고, 이의 extension function 들이 사방에 널려 정의되어 있다. 에를 들어 Row 에서만 사용할 수 있는 Modifier 는 Row.kt 안의 RowScope interface 안에 정의되어 있고, // Row.kt @LayoutScopeMarker @Immutable interface RowScope { @Stable fun Modifier.weight( /*@FloatRange(from = 0.0, fromInclusive = false)*/ weight: Float, fill: Boolean = true ): Modifier @Stable fun Modi.. 2022. 9. 11. [android] Button in Compose # Android View 시스템의 Button 은 Compose 에서도 'Button' 이다. # Button 의 function signature 는 아래와 같다. @Composable fun Button( onClick: () -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, interactionSource: MutableInteractionSource = remember { MutableInteractionSource() }, elevation: ButtonElevation? = ButtonDefaults.elevation(), shape: Shape = MaterialTheme.shapes.small, border: BorderS.. 2022. 9. 10. [android] TextView in Compose (Text) # Android View 시스템의 TextView 는 Compose 에서 'Text' 에 매핑된다. # Text 는 아래와 같은 signature 를 갖고 있다. fun Text( text: String, modifier: Modifier = Modifier, color: Color = Color.Unspecified, fontSize: TextUnit = TextUnit.Unspecified, fontStyle: FontStyle? = null, fontWeight: FontWeight? = null, fontFamily: FontFamily? = null, letterSpacing: TextUnit = TextUnit.Unspecified, textDecoration: TextDecoration? .. 2022. 9. 9. [android] ImageView in Compose (Image) # Android View 시스템의 ImageView 는 Compose 에서 'Image' 에 매칭된다. # Image 의 function signature 는 아래와 같다. @Composable fun Image( painter: Painter, contentDescription: String?, modifier: Modifier = Modifier, alignment: Alignment = Alignment.Center, contentScale: ContentScale = ContentScale.Fit, alpha: Float = DefaultAlpha, colorFilter: ColorFilter? = null ) # Compose 에서 Image 에 imageRes (drawable) 를 그리기 .. 2022. 9. 8. 반응형 이전 1 2 다음
