Android 뷰에서 엽니다.
app/java/com/example/hellonews/ui/home/HomeScreen.kt,
앱의 미리보기가
오디오 뉴스 위에 인쇄물 기사로 구성된 일반 텍스트 형식으로 구성됩니다.
app/java
(generated)/com/example/hellonews/newscard/NewsCard.kt. 이
Figma 구성요소를 위해 생성된 Jetpack Compose 코드입니다.
NewsCard 구성요소의 세 가지 변형이
코드가 Figma에서 코드로 변환되었습니다. 코드를 자세히 살펴보겠습니다.
View enum을 사용하면 이 구성요소에 사용할 변형을 선택할 수 있습니다.
enum의 이름과 그 값은
Figma 구성요소 NewsCard의 view 매개변수에 사용됩니다.
있습니다.
NewsCard 컴포저블이 UI 패키지에서 생성되었습니다. 여기에는
View 유형의 매개변수로, 뉴스 카드의 변형을 다음과 같이 설정합니다.
인스턴스화합니다.
package com.example.myapplication.newscard
import ...
// Design to select for NewsCard
enum class View {
HeroItem,
ArticleItem,
AudioItem
}
/**
* News card component intended to display news items for a list.
*
* This composable was generated from the UI Package 'news_card'.
* Generated code; do not edit directly
*/
@Composable
fun NewsCard(
modifier: Modifier = Modifier,
view: View = View.HeroItem
) {...}
다음 단계
아직 NewsCard를 사용할 준비가 되지 않았습니다. 구성요소는
여러 뉴스 기사를 표시할 수 있습니다. 이는 Figma에서 하드코딩된 뉴스 중 하나만 표시합니다. 따라서
이제 구성요소를 추가하면 동일한 뉴스 기사만 표시됩니다.
반복되지 않습니다. NewsCard의 어떤 부분을 채워야 하는지 지정하는 방법이 필요합니다.
사용할 수 있습니다.
프로젝트를 빌드합니다 1분 정도 걸릴 수 있습니다.
