인프런 커뮤니티 질문&답변

MainActivity.kt

import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.setValue
import androidx.compose.runtime.getValue
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.foundation.pager.HorizontalPager
import androidx.compose.material3.ExperimentalMaterial3Api
import com.google.accompanist.pager.ExperimentalPagerApi
import com.google.accompanist.pager.HorizontalPagerIndicator


class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            ShopEx()
        }
    }
}

@Composable
fun ShopEx() {
    Surface(
        modifier = Modifier.fillMaxSize(),
        color = MaterialTheme.colorScheme.background
    ) {
        Column() {
            TopLogo()
            TopSearchBar()
            TopBanner()
        }
    }
}

@Composable
fun TopLogo(){
    Box(){
        Box(
            modifier = Modifier
                .fillMaxWidth()
                .height(60.dp),
            contentAlignment = Alignment.Center
        ){
            Row(){
                Text("C", fontSize = 30.sp, color= Color(0xff964b00))
                Text("O", fontSize = 30.sp, color= Color(0xff964b00))
                Text("U", fontSize = 30.sp, color= Color(0xff964b00))
                Text("P", fontSize = 30.sp, color= Color.Red)
                Text("A", fontSize = 30.sp, color= Color.Yellow)
                Text("N", fontSize = 30.sp, color= Color.Green)
                Text("G", fontSize = 30.sp, color= Color.Blue)
            }
            Icon(
                imageVector = Icons.Default.ShoppingCart,      // ImageVector 아이콘지정
                contentDescription = "쇼핑",
                modifier = Modifier
                    .align(Alignment.CenterEnd)
                    .padding(end = 20.dp)
            )
        }
    }
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun TopSearchBar(){
    var inputText by remember {
        mutableStateOf("")
    }

    Box(
        modifier = Modifier
            .fillMaxWidth()
            .border(1.dp, Color.Gray, shape = RoundedCornerShape(10.dp))
            .padding(start = 20.dp, end = 20.dp),
        contentAlignment = Alignment.Center
    ){
        TextField(
            value = inputText,
            onValueChange = {
                inputText = it
            },
            leadingIcon = { Icon(imageVector = Icons.Default.Search, contentDescription = null)},
            placeholder = { Text(text = "쿠팡에서 검색하세요")},
            modifier = Modifier.fillMaxWidth(),
            colors = TextFieldDefaults.textFieldColors(
                containerColor = Color.White,
                focusedIndicatorColor = Color.Transparent,
                unfocusedIndicatorColor = Color.Transparent
            )
        )
    }
}

@OptIn(ExperimentalFoundationApi::class, ExperimentalPagerApi::class)
@Composable
fun TopBanner(){
    val pageCount = 5
    val pageState = rememberPagerState()

    val textList = listOf(
        "광고 문구1",
        "광고 문구2",
        "광고 문구3",
        "광고 문구4",
        "광고 문구5"
    )

    Box(
        modifier = Modifier.padding(top = 20.dp)
    ) {
        HorizontalPager(
            pageCount = pageCount,
            state = pageState,
            modifier = Modifier
                .fillMaxSize()
                .height(200.dp)
                .background(Color.LightGray),
        ) { page ->
            Text(
                text = textList[page],
                fontSize = 30.sp,
                fontWeight = FontWeight.ExtraBold,
            )
        }

        HorizontalPagerIndicator(
            pagerState = pageState,
            modifier = Modifier
                .align(Alignment.BottomCenter)
                .padding(15.dp)
        )

    }

}

@Preview(showBackground = true)
@Composable
fun GreetingPreview() {
    ShopExTheme {
        ShopEx()
    }
}

build.gradle.kts

dependencies {

    implementation("androidx.core:core-ktx:1.9.0")
    implementation("androidx.lifecycle:lifecycle-runtime-ktx:2.6.2")
    implementation("androidx.activity:activity-compose:1.8.2")
    implementation(platform("androidx.compose:compose-bom:2023.03.00"))
    implementation("androidx.compose.ui:ui")
    implementation("androidx.compose.ui:ui-graphics")
    implementation("androidx.compose.ui:ui-tooling-preview")
    implementation("androidx.compose.material3:material3")
    testImplementation("junit:junit:4.13.2")
    implementation ("com.google.accompanist:accompanist-pager:0.20.2")
    implementation ("com.google.accompanist:accompanist-pager-indicators:0.20.2")
    implementation ("com.google.accompanist:accompanist.pager.PagerState")
    androidTestImplementation("androidx.test.ext:junit:1.1.5")
    androidTestImplementation("androidx.test.espresso:espresso-core:3.5.1")
    androidTestImplementation(platform("androidx.compose:compose-bom:2023.03.00"))
    androidTestImplementation("androidx.compose.ui:ui-test-junit4")
    debugImplementation("androidx.compose.ui:ui-tooling")
    debugImplementation("androidx.compose.ui:ui-test-manifest")

}