diff --git a/app/build.gradle b/app/build.gradle index 3819abe..bbf84ce 100644 --- a/app/build.gradle +++ b/app/build.gradle @@ -4,12 +4,12 @@ plugins { } android { - compileSdk 30 + compileSdk 31 defaultConfig { applicationId "com.semicolon.semicolondesign" minSdk 21 - targetSdk 30 + targetSdk 31 versionCode 1 versionName "1.0" @@ -33,17 +33,29 @@ android { kotlinOptions { jvmTarget = '1.8' } + composeOptions { + kotlinCompilerExtensionVersion compose_version + kotlinCompilerVersion kotlin_version + } + buildFeatures { + compose true + } } dependencies { + implementation project(path: ':design') - implementation 'androidx.core:core-ktx:1.6.0' - implementation 'androidx.appcompat:appcompat:1.3.1' + implementation 'androidx.core:core-ktx:1.7.0' + implementation 'androidx.appcompat:appcompat:1.4.0' implementation 'com.google.android.material:material:1.4.0' + implementation 'androidx.constraintlayout:constraintlayout:2.1.2' testImplementation 'junit:junit:4.+' androidTestImplementation 'androidx.test.ext:junit:1.1.3' androidTestImplementation 'androidx.test.espresso:espresso-core:3.4.0' //compose implementation "androidx.compose.ui:ui:$compose_version" + implementation "androidx.compose.ui:ui-tooling:$compose_version" + implementation "androidx.compose.material:material:$compose_version" + implementation 'androidx.activity:activity-compose:1.4.0' } \ No newline at end of file diff --git a/app/src/main/AndroidManifest.xml b/app/src/main/AndroidManifest.xml index d23500a..5839004 100644 --- a/app/src/main/AndroidManifest.xml +++ b/app/src/main/AndroidManifest.xml @@ -8,6 +8,15 @@ android:label="@string/app_name" android:roundIcon="@mipmap/ic_launcher_round" android:supportsRtl="true" - android:theme="@style/Theme.SemicolonDesign" /> + android:theme="@style/Theme.SemicolonDesign"> + + + + + + + \ No newline at end of file diff --git a/app/src/main/java/com/semicolon/semicolondesign/TestActivity.kt b/app/src/main/java/com/semicolon/semicolondesign/TestActivity.kt new file mode 100644 index 0000000..10adc47 --- /dev/null +++ b/app/src/main/java/com/semicolon/semicolondesign/TestActivity.kt @@ -0,0 +1,235 @@ +package com.semicolon.semicolondesign + +import androidx.appcompat.app.AppCompatActivity +import android.os.Bundle +import android.widget.Toast +import androidx.activity.compose.setContent +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.rememberScrollState +import androidx.compose.foundation.verticalScroll +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.unit.dp +import com.semicolon.design.button.* + +class TestActivity : AppCompatActivity() { + + override fun onCreate(savedInstanceState: Bundle?) { + super.onCreate(savedInstanceState) + setContent { + Column( + modifier = Modifier.verticalScroll(rememberScrollState()), + verticalArrangement = Arrangement.spacedBy(8.dp), + horizontalAlignment = Alignment.CenterHorizontally + ) { + DefaultFillButton(text = "버튼") { makeToast("기본 꽉찬 버튼 눌림") } + DefaultFillButton(text = "버튼", isEnabled = false) {} + ColoredFillButton(text = "버튼") { makeToast("컬러 꽉찬 버튼 눌림") } + ColoredFillButton(text = "버튼", isEnabled = false) {} + + DefaultLargeButton(text = "버튼") { makeToast("기본 큰 버튼 눌림") } + DefaultLargeButton(text = "버튼", isEnabled = false) {} + ColoredLargeButton(text = "버튼") { makeToast("색깔 큰 버튼 눌림") } + ColoredLargeButton(text = "버튼", isEnabled = false) {} + PaleColoredLargeButton(text = "버튼") { makeToast("연한 큰 버튼 눌림") } + PaleColoredLargeButton(text = "버튼", isEnabled = false) {} + OutlinedLargeButton(text = "버튼") { makeToast("테두리 큰 버튼 눌림") } + OutlinedLargeButton(text = "버튼", isEnabled = false) {} + + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + DefaultMediumButton(text = "버튼") { makeToast("기본 중간 버튼 눌림") } + DefaultMediumButton(text = "버튼", isEnabled = false) {} + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + ColoredMediumButton(text = "버튼") { makeToast("색깔 중간 버튼 눌림") } + ColoredMediumButton(text = "버튼", isEnabled = false) {} + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + PaleColoredMediumButton(text = "버튼") { makeToast("연한 중간 버튼 눌림") } + PaleColoredMediumButton(text = "버튼", isEnabled = false) {} + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + OutlinedMediumButton(text = "버튼") { makeToast("테두리 중간 버튼 눌림") } + OutlinedMediumButton(text = "버튼", isEnabled = false) {} + } + + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + ClearDefaultSmallButton(text = "버튼") { makeToast("배경x 기본 작은 버튼 눌림") } + ClearDefaultSmallButton(text = "버튼", isEnabled = false) {} + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + ClearDefaultSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_favorite), + iconPosition = IconPosition.LEFT + ) { + makeToast("왼쪽 아이콘 배경x 기본 작은 버튼 눌림") + } + ClearDefaultSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_favorite), + iconPosition = IconPosition.RIGHT + ) { + makeToast("오른쪽 아이콘 배경x 기본 작은 버튼 눌림") + } + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + ClearColoredSmallButton(text = "버튼") { makeToast("배경x 색깔 작은 버튼 눌림") } + ClearColoredSmallButton(text = "버튼", isEnabled = false) {} + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + ClearColoredSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_favorite), + iconPosition = IconPosition.LEFT + ) { + makeToast("왼쪽 아이콘 배경x 색깔 작은 버튼 눌림") + } + ClearColoredSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_favorite), + iconPosition = IconPosition.RIGHT + ) { + makeToast("오른쪽 아이콘 배경x 색깔 작은 버튼 눌림") + } + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + LinkSmallButton(text = "버튼") { makeToast("링크 작은 버튼 눌림") } + LinkSmallButton(text = "버튼", isEnabled = false) {} + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + LinkSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_north_east), + iconPosition = IconPosition.LEFT + ) { + makeToast("왼쪽 아이콘 링크 작은 버튼 눌림") + } + LinkSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_north_east), + iconPosition = IconPosition.RIGHT + ) { + makeToast("오른쪽 아이콘 링크 작은 버튼 눌림") + } + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + DefaultSmallButton(text = "버튼") { makeToast("기본 작은 버튼 눌림") } + DefaultSmallButton(text = "버튼", isEnabled = false) {} + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + DefaultSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_favorite), + iconPosition = IconPosition.LEFT + ) { + makeToast("왼쪽 아이콘 기본 작은 버튼 눌림") + } + DefaultSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_favorite), + iconPosition = IconPosition.RIGHT + ) { + makeToast("오른쪽 아이콘 기본 작은 버튼 눌림") + } + DefaultSmallButton( + text = "버튼", + isLoading = true + ) { + makeToast("로딩중 기본 작은 버튼 눌림") + } + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + ColoredSmallButton(text = "버튼") { makeToast("색깔 작은 버튼 눌림") } + ColoredSmallButton(text = "버튼", isEnabled = false) {} + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + ColoredSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_favorite), + iconPosition = IconPosition.LEFT + ) { + makeToast("왼쪽 아이콘 색깔 작은 버튼 눌림") + } + ColoredSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_favorite), + iconPosition = IconPosition.RIGHT + ) { + makeToast("오른쪽 아이콘 색깔 작은 버튼 눌림") + } + ColoredSmallButton( + text = "버튼", + isLoading = true + ) { + makeToast("로딩중 색깔 작은 버튼 눌림") + } + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + PaleColoredSmallButton(text = "버튼") { makeToast("연한 색깔 작은 버튼 눌림") } + PaleColoredSmallButton(text = "버튼", isEnabled = false) {} + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + PaleColoredSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_favorite), + iconPosition = IconPosition.LEFT + ) { + makeToast("왼쪽 아이콘 연한 색깔 작은 버튼 눌림") + } + PaleColoredSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_favorite), + iconPosition = IconPosition.RIGHT + ) { + makeToast("오른쪽 아이콘 연한 색깔 작은 버튼 눌림") + } + PaleColoredSmallButton( + text = "버튼", + isLoading = true + ) { + makeToast("로딩중 연한 색깔 작은 버튼 눌림") + } + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + OutlinedSmallButton(text = "버튼") { makeToast("테두리 작은 버튼 눌림") } + OutlinedSmallButton(text = "버튼", isEnabled = false) {} + } + Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + OutlinedSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_favorite), + iconPosition = IconPosition.LEFT + ) { + makeToast("왼쪽 아이콘 테두리 작은 버튼 눌림") + } + OutlinedSmallButton( + text = "버튼", + icon = painterResource(id = R.drawable.ic_favorite), + iconPosition = IconPosition.RIGHT + ) { + makeToast("오른쪽 아이콘 테두리 작은 버튼 눌림") + } + OutlinedSmallButton( + text = "버튼", + isLoading = true + ) { + makeToast("로딩중 테두리 작은 버튼 눌림") + } + } + + ToggleSwitch() + ToggleButton(items = arrayOf("버튼", "버튼")) + ToggleButton(items = arrayOf("버튼", "버튼", "버튼")) + ToggleButton(items = arrayOf("버튼", "버튼", "버튼", "버튼")) + ToggleButton(items = arrayOf()) + } + } + } + + private fun makeToast(message: String) = + Toast.makeText(this, message, Toast.LENGTH_SHORT).show() +} \ No newline at end of file diff --git a/app/src/main/res/drawable/ic_favorite.xml b/app/src/main/res/drawable/ic_favorite.xml new file mode 100644 index 0000000..47d2990 --- /dev/null +++ b/app/src/main/res/drawable/ic_favorite.xml @@ -0,0 +1,11 @@ + + + + diff --git a/app/src/main/res/drawable/ic_north_east.xml b/app/src/main/res/drawable/ic_north_east.xml new file mode 100644 index 0000000..5893394 --- /dev/null +++ b/app/src/main/res/drawable/ic_north_east.xml @@ -0,0 +1,10 @@ + + + diff --git a/build.gradle b/build.gradle index d168f8e..0225c1c 100644 --- a/build.gradle +++ b/build.gradle @@ -2,14 +2,14 @@ buildscript { ext { compose_version = '1.0.5' - kotlin_version = '1.6.0' + kotlin_version = '1.5.31' } repositories { google() mavenCentral() } dependencies { - classpath "com.android.tools.build:gradle:7.0.3" + classpath 'com.android.tools.build:gradle:7.0.4' classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version" // NOTE: Do not place your application dependencies here; they belong diff --git a/design/build.gradle b/design/build.gradle index c5bdf11..8a2445b 100644 --- a/design/build.gradle +++ b/design/build.gradle @@ -30,6 +30,13 @@ android { kotlinOptions { jvmTarget = '1.8' } + composeOptions { + kotlinCompilerExtensionVersion compose_version + kotlinCompilerVersion kotlin_version + } + buildFeatures { + compose true + } } dependencies { @@ -42,6 +49,9 @@ dependencies { androidTestImplementation 'androidx.test.espresso:espresso-core:3.4.0' implementation "androidx.compose.ui:ui:$compose_version" + implementation "androidx.compose.ui:ui-tooling:$compose_version" + implementation "androidx.compose.ui:ui-tooling-preview:$compose_version" + implementation "androidx.compose.material:material:$compose_version" } afterEvaluate { diff --git a/design/src/main/java/com/semicolon/design/button/BasicButton.kt b/design/src/main/java/com/semicolon/design/button/BasicButton.kt new file mode 100644 index 0000000..3b5b1cd --- /dev/null +++ b/design/src/main/java/com/semicolon/design/button/BasicButton.kt @@ -0,0 +1,254 @@ +package com.semicolon.design.button + +import androidx.compose.foundation.background +import androidx.compose.foundation.border +import androidx.compose.foundation.clickable +import androidx.compose.foundation.interaction.MutableInteractionSource +import androidx.compose.foundation.interaction.collectIsPressedAsState +import androidx.compose.foundation.layout.* +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material.Icon +import androidx.compose.material.Text +import androidx.compose.runtime.Composable +import androidx.compose.runtime.remember +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.painter.Painter +import androidx.compose.ui.text.TextStyle +import androidx.compose.ui.text.style.TextDecoration +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import com.semicolon.design.util.CircularProgressBar + +@Composable +fun BasicFillButton( + text: String, + defaultColor: Color, + pressedColor: Color, + disabledColor: Color, + defaultTextColor: Color, + disabledTextColor: Color, + isEnabled: Boolean, + modifier: Modifier, + onClick: () -> Unit +) { + BasicBigButton( + text = text, + defaultColor = defaultColor, + pressedColor = pressedColor, + disabledColor = disabledColor, + defaultTextColor = defaultTextColor, + disabledTextColor = disabledTextColor, + isEnabled = isEnabled, + modifier = modifier + .fillMaxWidth(), + onClick = onClick + ) +} + +@Composable +fun BasicLargeButton( + text: String, + defaultColor: Color, + pressedColor: Color, + disabledColor: Color, + defaultTextColor: Color, + disabledTextColor: Color, + outlineColor: Color? = null, + isEnabled: Boolean, + modifier: Modifier, + onClick: () -> Unit +) { + var fixedModifier = modifier + .fillMaxWidth() + .padding(horizontal = 16.dp) + .clip(RoundedCornerShape(12.dp)) + if (outlineColor != null && isEnabled) + fixedModifier = fixedModifier.border(1.dp, outlineColor, RoundedCornerShape(12.dp)) + BasicBigButton( + text = text, + defaultColor = defaultColor, + pressedColor = pressedColor, + disabledColor = disabledColor, + defaultTextColor = defaultTextColor, + disabledTextColor = disabledTextColor, + isEnabled = isEnabled, + modifier = fixedModifier, + onClick = onClick + ) +} + +@Composable +fun BasicMediumButton( + text: String, + defaultColor: Color, + pressedColor: Color, + disabledColor: Color, + defaultTextColor: Color, + disabledTextColor: Color, + outlineColor: Color? = null, + isEnabled: Boolean, + modifier: Modifier, + onClick: () -> Unit +) { + var fixedModifier = modifier + .width(160.dp) + .clip(RoundedCornerShape(12.dp)) + if (outlineColor != null && isEnabled) + fixedModifier = fixedModifier.border(1.dp, outlineColor, RoundedCornerShape(12.dp)) + BasicBigButton( + text = text, + defaultColor = defaultColor, + pressedColor = pressedColor, + disabledColor = disabledColor, + defaultTextColor = defaultTextColor, + disabledTextColor = disabledTextColor, + isEnabled = isEnabled, + modifier = fixedModifier, + onClick = onClick + ) +} + +@Composable +fun BasicBigButton( + text: String, + defaultColor: Color, + pressedColor: Color, + disabledColor: Color, + defaultTextColor: Color, + disabledTextColor: Color, + isEnabled: Boolean, + modifier: Modifier, + onClick: () -> Unit +) { + val textColor = if (isEnabled) defaultTextColor else disabledTextColor + BasicButton( + defaultColor = defaultColor, + pressedColor = pressedColor, + disabledColor = disabledColor, + isEnabled = isEnabled, + modifier = modifier + .height(52.dp), + onClick = onClick + ) { + Text(text = text, fontSize = 14.sp, color = textColor) + } +} + +@Composable +fun BasicSmallButton( + text: String, + defaultColor: Color, + pressedColor: Color, + disabledColor: Color, + defaultContentColor: Color, + disabledContentColor: Color, + outlineColor: Color? = null, + progressBarColor: Color = Color.Black, + progressBarBackgroundColor: Color = Color.Transparent, + isEnabled: Boolean, + isLoading: Boolean, + underlineEffect: Boolean = false, + icon: Painter? = null, + iconPosition: IconPosition = IconPosition.LEFT, + modifier: Modifier, + onClick: () -> Unit +) { + var fixedModifier = modifier + .clip(RoundedCornerShape(4.dp)) + if (outlineColor != null && isEnabled) + fixedModifier = fixedModifier.border(1.dp, outlineColor, RoundedCornerShape(4.dp)) + val contentColor = if (isEnabled) defaultContentColor else disabledContentColor + Box( + modifier = Modifier.padding(horizontal = 16.dp, vertical = 8.dp) + ) { + BasicButton( + defaultColor = defaultColor, + pressedColor = pressedColor, + disabledColor = disabledColor, + isEnabled = isEnabled, + isLoading = isLoading, + modifier = fixedModifier + .height(36.dp) + .wrapContentWidth(), + onClick = onClick + ) { + Row( + modifier.padding(horizontal = 16.dp), + verticalAlignment = Alignment.CenterVertically + ) { + if (!isLoading && icon != null && iconPosition == IconPosition.LEFT) { + Icon( + painter = icon, + tint = contentColor, + contentDescription = "", + modifier = Modifier + .width(16.dp) + .height(16.dp) + ) + Spacer(modifier = Modifier.width(4.dp)) + } + Text( + text = text, + fontSize = 14.sp, + color = contentColor, + style = TextStyle(textDecoration = if (it && underlineEffect) TextDecoration.Underline else TextDecoration.None) + ) + if (!isLoading && icon != null && iconPosition == IconPosition.RIGHT) { + Spacer(modifier = Modifier.width(4.dp)) + Icon( + painter = icon, + tint = contentColor, + contentDescription = "", + modifier = Modifier + .width(16.dp) + .height(16.dp) + ) + } + if (isLoading) { + Row { + Spacer(modifier = Modifier.width(4.dp)) + CircularProgressBar( + progressColor = progressBarColor, + backgroundColor = progressBarBackgroundColor, + modifier = Modifier + .height(14.dp) + .width(14.dp) + ) + } + } + } + } + } +} + +@Composable +fun BasicButton( + defaultColor: Color, + pressedColor: Color, + disabledColor: Color, + isEnabled: Boolean, + isLoading: Boolean = false, + modifier: Modifier, + onClick: () -> Unit, + contents: @Composable (isPressed: Boolean) -> Unit +) { + val interactionSource = remember { MutableInteractionSource() } + val isPressed = interactionSource.collectIsPressedAsState() + val buttonColor = + if (!isEnabled) disabledColor else if (isPressed.value) pressedColor else defaultColor + Box( + modifier = modifier + .background(buttonColor) + .clickable( + interactionSource = interactionSource, + indication = null, + enabled = isEnabled && !isLoading + ) { onClick() }, + contentAlignment = Alignment.Center + ) { + contents(isPressed.value) + } +} diff --git a/design/src/main/java/com/semicolon/design/button/FillButton.kt b/design/src/main/java/com/semicolon/design/button/FillButton.kt new file mode 100644 index 0000000..9e6f4f0 --- /dev/null +++ b/design/src/main/java/com/semicolon/design/button/FillButton.kt @@ -0,0 +1,66 @@ +package com.semicolon.design.button + + +import androidx.compose.runtime.* +import androidx.compose.ui.Modifier +import androidx.compose.ui.tooling.preview.Preview +import com.semicolon.design.color.primary.gray.gray100 +import com.semicolon.design.color.primary.gray.gray300 +import com.semicolon.design.color.primary.gray.gray50 +import com.semicolon.design.color.primary.gray.gray700 +import com.semicolon.design.color.primary.purple.purple400 +import com.semicolon.design.color.primary.purple.purple50 +import com.semicolon.design.color.primary.purple.purple500 +import com.semicolon.design.color.primary.white.white + +@Composable +fun DefaultFillButton( + modifier: Modifier = Modifier, + text: String, + isEnabled: Boolean = true, + onClick: () -> Unit +) { + BasicFillButton( + text = text, + defaultColor = gray100, + pressedColor = gray300, + disabledColor = gray50, + defaultTextColor = gray700, + disabledTextColor = gray300, + isEnabled = isEnabled, + modifier = modifier, + onClick = onClick + ) +} + +@Composable +fun ColoredFillButton( + modifier: Modifier = Modifier, + text: String, + isEnabled: Boolean = true, + onClick: () -> Unit +) { + BasicFillButton( + text = text, + defaultColor = purple400, + pressedColor = purple500, + disabledColor = purple50, + defaultTextColor = white, + disabledTextColor = white, + isEnabled = isEnabled, + modifier = modifier, + onClick = onClick + ) +} + +@Preview(showBackground = true) +@Composable +private fun DefaultFillButtonPreview() { + DefaultFillButton(text = "버튼") {} +} + +@Preview(showBackground = true) +@Composable +private fun ColoredFillButtonPreview() { + ColoredFillButton(text = "버튼") {} +} \ No newline at end of file diff --git a/design/src/main/java/com/semicolon/design/button/IconPosition.kt b/design/src/main/java/com/semicolon/design/button/IconPosition.kt new file mode 100644 index 0000000..a6c8423 --- /dev/null +++ b/design/src/main/java/com/semicolon/design/button/IconPosition.kt @@ -0,0 +1,5 @@ +package com.semicolon.design.button + +enum class IconPosition { + LEFT, RIGHT +} \ No newline at end of file diff --git a/design/src/main/java/com/semicolon/design/button/LargeButton.kt b/design/src/main/java/com/semicolon/design/button/LargeButton.kt new file mode 100644 index 0000000..f5ccd18 --- /dev/null +++ b/design/src/main/java/com/semicolon/design/button/LargeButton.kt @@ -0,0 +1,118 @@ +package com.semicolon.design.button + + +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.tooling.preview.Preview +import com.semicolon.design.color.primary.gray.gray100 +import com.semicolon.design.color.primary.gray.gray300 +import com.semicolon.design.color.primary.gray.gray50 +import com.semicolon.design.color.primary.gray.gray700 +import com.semicolon.design.color.primary.purple.* +import com.semicolon.design.color.primary.white.white + +@Composable +fun DefaultLargeButton( + modifier: Modifier = Modifier, + text: String, + isEnabled: Boolean = true, + onClick: () -> Unit +) { + BasicLargeButton( + text = text, + defaultColor = gray100, + pressedColor = gray300, + disabledColor = gray50, + defaultTextColor = gray700, + disabledTextColor = gray300, + isEnabled = isEnabled, + modifier = modifier, + onClick = onClick + ) +} + +@Composable +fun ColoredLargeButton( + modifier: Modifier = Modifier, + text: String, + isEnabled: Boolean = true, + onClick: () -> Unit +) { + BasicLargeButton( + text = text, + defaultColor = purple400, + pressedColor = purple500, + disabledColor = purple50, + defaultTextColor = white, + disabledTextColor = white, + isEnabled = isEnabled, + modifier = modifier, + onClick = onClick + ) +} + +@Composable +fun PaleColoredLargeButton( + modifier: Modifier = Modifier, + text: String, + isEnabled: Boolean = true, + onClick: () -> Unit +) { + BasicLargeButton( + text = text, + defaultColor = purple50, + pressedColor = purple100, + disabledColor = gray50, + defaultTextColor = purple300, + disabledTextColor = gray300, + isEnabled = isEnabled, + modifier = modifier, + onClick = onClick + ) +} + + +@Composable +fun OutlinedLargeButton( + modifier: Modifier = Modifier, + text: String, + isEnabled: Boolean = true, + onClick: () -> Unit +) { + BasicLargeButton( + text = text, + defaultColor = white, + pressedColor = gray100, + disabledColor = gray50, + defaultTextColor = gray700, + disabledTextColor = gray300, + outlineColor = gray100, + isEnabled = isEnabled, + modifier = modifier, + onClick = onClick + ) +} + +@Preview(showBackground = true) +@Composable +private fun DefaultLargeButtonPreview() { + DefaultLargeButton(text = "버튼") {} +} + +@Preview(showBackground = true) +@Composable +private fun ColoredLargeButtonPreview() { + ColoredLargeButton(text = "버튼") {} +} + +@Preview(showBackground = true) +@Composable +private fun PaleColoredLargeButtonPreview() { + PaleColoredLargeButton(text = "버튼") {} +} + +@Preview(showBackground = true) +@Composable +private fun OutlinedLargeButtonPreview() { + OutlinedLargeButton(text = "버튼") {} +} diff --git a/design/src/main/java/com/semicolon/design/button/MediumButton.kt b/design/src/main/java/com/semicolon/design/button/MediumButton.kt new file mode 100644 index 0000000..f59ea12 --- /dev/null +++ b/design/src/main/java/com/semicolon/design/button/MediumButton.kt @@ -0,0 +1,117 @@ +package com.semicolon.design.button + +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.tooling.preview.Preview +import com.semicolon.design.color.primary.gray.gray100 +import com.semicolon.design.color.primary.gray.gray300 +import com.semicolon.design.color.primary.gray.gray50 +import com.semicolon.design.color.primary.gray.gray700 +import com.semicolon.design.color.primary.purple.* +import com.semicolon.design.color.primary.white.white + +@Composable +fun DefaultMediumButton( + modifier: Modifier = Modifier, + text: String, + isEnabled: Boolean = true, + onClick: () -> Unit +) { + BasicMediumButton( + text = text, + defaultColor = gray100, + pressedColor = gray300, + disabledColor = gray50, + defaultTextColor = gray700, + disabledTextColor = gray300, + isEnabled = isEnabled, + modifier = modifier, + onClick = onClick + ) +} + +@Composable +fun ColoredMediumButton( + modifier: Modifier = Modifier, + text: String, + isEnabled: Boolean = true, + onClick: () -> Unit +) { + BasicMediumButton( + text = text, + defaultColor = purple400, + pressedColor = purple500, + disabledColor = purple50, + defaultTextColor = white, + disabledTextColor = white, + isEnabled = isEnabled, + modifier = modifier, + onClick = onClick + ) +} + +@Composable +fun PaleColoredMediumButton( + modifier: Modifier = Modifier, + text: String, + isEnabled: Boolean = true, + onClick: () -> Unit +) { + BasicMediumButton( + text = text, + defaultColor = purple50, + pressedColor = purple100, + disabledColor = gray50, + defaultTextColor = purple300, + disabledTextColor = gray300, + isEnabled = isEnabled, + modifier = modifier, + onClick = onClick + ) +} + + +@Composable +fun OutlinedMediumButton( + modifier: Modifier = Modifier, + text: String, + isEnabled: Boolean = true, + onClick: () -> Unit +) { + BasicMediumButton( + text = text, + defaultColor = white, + pressedColor = gray100, + disabledColor = gray50, + defaultTextColor = gray700, + disabledTextColor = gray300, + outlineColor = gray100, + isEnabled = isEnabled, + modifier = modifier, + onClick = onClick + ) +} + +@Preview(showBackground = true) +@Composable +private fun DefaultMediumButtonPreview() { + DefaultMediumButton(text = "버튼") {} +} + +@Preview(showBackground = true) +@Composable +private fun ColoredMediumButtonPreview() { + ColoredMediumButton(text = "버튼") {} +} + +@Preview(showBackground = true) +@Composable +private fun PaleColoredMediumButtonPreview() { + PaleColoredMediumButton(text = "버튼") {} +} + +@Preview(showBackground = true) +@Composable +private fun OutlinedMediumButtonPreview() { + OutlinedMediumButton(text = "버튼") {} +} diff --git a/design/src/main/java/com/semicolon/design/button/SmallButton.kt b/design/src/main/java/com/semicolon/design/button/SmallButton.kt new file mode 100644 index 0000000..5984582 --- /dev/null +++ b/design/src/main/java/com/semicolon/design/button/SmallButton.kt @@ -0,0 +1,202 @@ +package com.semicolon.design.button + +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.painter.Painter +import com.semicolon.design.color.primary.gray.* +import com.semicolon.design.color.primary.purple.purple100 +import com.semicolon.design.color.primary.purple.purple400 +import com.semicolon.design.color.primary.purple.purple50 +import com.semicolon.design.color.primary.purple.purple500 +import com.semicolon.design.color.primary.white.white +import com.semicolon.design.color.system.blue.blue400 + +@Composable +fun ClearDefaultSmallButton( + modifier: Modifier = Modifier, + text: String, + icon: Painter? = null, + iconPosition: IconPosition = IconPosition.LEFT, + isEnabled: Boolean = true, + onClick: () -> Unit +) { + BasicSmallButton( + text = text, + defaultColor = Color.Transparent, + pressedColor = gray50, + disabledColor = Color.Transparent, + defaultContentColor = gray700, + disabledContentColor = gray300, + isEnabled = isEnabled, + isLoading = false, + icon = icon, + iconPosition = iconPosition, + modifier = modifier, + onClick = onClick + ) +} + +@Composable +fun ClearColoredSmallButton( + modifier: Modifier = Modifier, + text: String, + icon: Painter? = null, + iconPosition: IconPosition = IconPosition.LEFT, + isEnabled: Boolean = true, + onClick: () -> Unit +) { + BasicSmallButton( + text = text, + defaultColor = Color.Transparent, + pressedColor = purple50, + disabledColor = Color.Transparent, + defaultContentColor = purple400, + disabledContentColor = gray300, + isEnabled = isEnabled, + isLoading = false, + icon = icon, + iconPosition = iconPosition, + modifier = modifier, + onClick = onClick + ) +} + +@Composable +fun LinkSmallButton( + modifier: Modifier = Modifier, + text: String, + icon: Painter? = null, + iconPosition: IconPosition = IconPosition.LEFT, + isEnabled: Boolean = true, + onClick: () -> Unit +) { + BasicSmallButton( + text = text, + defaultColor = Color.Transparent, + pressedColor = Color.Transparent, + disabledColor = Color.Transparent, + defaultContentColor = blue400, + disabledContentColor = gray300, + isEnabled = isEnabled, + isLoading = false, + underlineEffect = true, + icon = icon, + iconPosition = iconPosition, + modifier = modifier, + onClick = onClick + ) +} + +@Composable +fun DefaultSmallButton( + modifier: Modifier = Modifier, + text: String, + icon: Painter? = null, + iconPosition: IconPosition = IconPosition.LEFT, + isEnabled: Boolean = true, + isLoading: Boolean = false, + onClick: () -> Unit +) { + BasicSmallButton( + text = text, + defaultColor = gray100, + pressedColor = gray300, + disabledColor = gray50, + defaultContentColor = gray700, + disabledContentColor = gray300, + progressBarColor = gray300, + progressBarBackgroundColor = gray500, + isEnabled = isEnabled, + isLoading = isLoading, + icon = icon, + iconPosition = iconPosition, + modifier = modifier, + onClick = onClick + ) +} + +@Composable +fun ColoredSmallButton( + modifier: Modifier = Modifier, + text: String, + icon: Painter? = null, + iconPosition: IconPosition = IconPosition.LEFT, + isEnabled: Boolean = true, + isLoading: Boolean = false, + onClick: () -> Unit +) { + BasicSmallButton( + text = text, + defaultColor = purple400, + pressedColor = purple500, + disabledColor = purple50, + defaultContentColor = white, + disabledContentColor = white, + progressBarColor = white, + progressBarBackgroundColor = purple500, + isEnabled = isEnabled, + isLoading = isLoading, + icon = icon, + iconPosition = iconPosition, + modifier = modifier, + onClick = onClick + ) +} + +@Composable +fun PaleColoredSmallButton( + modifier: Modifier = Modifier, + text: String, + icon: Painter? = null, + iconPosition: IconPosition = IconPosition.LEFT, + isEnabled: Boolean = true, + isLoading: Boolean = false, + onClick: () -> Unit +) { + BasicSmallButton( + text = text, + defaultColor = gray50, + pressedColor = purple100, + disabledColor = gray50, + defaultContentColor = purple400, + disabledContentColor = gray300, + progressBarColor = purple400, + progressBarBackgroundColor = purple100, + isEnabled = isEnabled, + isLoading = isLoading, + icon = icon, + iconPosition = iconPosition, + modifier = modifier, + onClick = onClick + ) +} + +@Composable +fun OutlinedSmallButton( + modifier: Modifier = Modifier, + text: String, + icon: Painter? = null, + iconPosition: IconPosition = IconPosition.LEFT, + isEnabled: Boolean = true, + isLoading: Boolean = false, + onClick: () -> Unit +) { + BasicSmallButton( + text = text, + defaultColor = white, + pressedColor = gray100, + disabledColor = gray50, + defaultContentColor = gray700, + disabledContentColor = gray300, + outlineColor = gray100, + progressBarColor = gray500, + progressBarBackgroundColor = gray300, + isEnabled = isEnabled, + isLoading = isLoading, + icon = icon, + iconPosition = iconPosition, + modifier = modifier, + onClick = onClick + ) +} \ No newline at end of file diff --git a/design/src/main/java/com/semicolon/design/button/ToggleButton.kt b/design/src/main/java/com/semicolon/design/button/ToggleButton.kt new file mode 100644 index 0000000..ccc1a6b --- /dev/null +++ b/design/src/main/java/com/semicolon/design/button/ToggleButton.kt @@ -0,0 +1,108 @@ +package com.semicolon.design.button + +import androidx.compose.animation.core.animateDpAsState +import androidx.compose.foundation.background +import androidx.compose.foundation.clickable +import androidx.compose.foundation.interaction.MutableInteractionSource +import androidx.compose.foundation.layout.* +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material.Text +import androidx.compose.runtime.* +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip +import androidx.compose.ui.layout.onSizeChanged +import androidx.compose.ui.platform.LocalDensity +import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import com.semicolon.design.color.primary.gray.gray100 +import com.semicolon.design.color.primary.gray.gray700 +import com.semicolon.design.color.primary.white.white + +@Composable +fun ToggleButton( + modifier: Modifier = Modifier, + items: Array, + position: Int = 0, + onSelectedItemChange: (position: Int) -> Unit = {} +) { + val toggleItems = if (items.size > 4) items.sliceArray(0..3) else items + BasicToggleButton( + modifier = modifier, + items = toggleItems, + position = position, + onSelectedItemChange = onSelectedItemChange + ) +} + +@Composable +fun BasicToggleButton( + modifier: Modifier = Modifier, + items: Array, + position: Int = 0, + onSelectedItemChange: (position: Int) -> Unit +) { + var eachContentWidth by remember { mutableStateOf(0) } + val eachContentDpWidth = LocalDensity.current.run { eachContentWidth.toDp() } + var positionState by remember { mutableStateOf(position) } + val emptySpaceWidth: Dp by animateDpAsState(((eachContentDpWidth.value * positionState) + (8 * positionState)).dp) + Box( + modifier = modifier + .padding(horizontal = 24.dp) + .height(44.dp) + .fillMaxWidth() + .clip(RoundedCornerShape(22.dp)) + .background(gray100) + .padding(4.dp) + .onSizeChanged { + if(items.isNotEmpty()) + eachContentWidth = (it.width - (8 * items.size)) / items.size + } + ) { + Row { + Spacer(modifier = Modifier.width(emptySpaceWidth)) + Spacer( + modifier = Modifier + .width(eachContentDpWidth) + .height(36.dp) + .clip(RoundedCornerShape(18.dp)) + .background(white) + ) + } + Row { + for (i in items.indices) { + ToggleItem( + modifier = Modifier + .height(36.dp) + .width(eachContentDpWidth), + text = items[i], + onClick = { + positionState = i + onSelectedItemChange(i) + } + ) + if (i != items.lastIndex) Spacer(modifier = Modifier.size(8.dp)) + if (i == 3) break + } + } + } +} + +@Composable +private fun ToggleItem( + modifier: Modifier, + text: String, + onClick: () -> Unit +) { + Box( + modifier = modifier + .clickable( + interactionSource = MutableInteractionSource(), + indication = null + ) { onClick() }, + contentAlignment = Alignment.Center + ) { + Text(text = text, fontSize = 14.sp, color = gray700) + } +} \ No newline at end of file diff --git a/design/src/main/java/com/semicolon/design/button/ToggleSwitch.kt b/design/src/main/java/com/semicolon/design/button/ToggleSwitch.kt new file mode 100644 index 0000000..e924595 --- /dev/null +++ b/design/src/main/java/com/semicolon/design/button/ToggleSwitch.kt @@ -0,0 +1,69 @@ +package com.semicolon.design.button + +import androidx.compose.animation.animateColorAsState +import androidx.compose.animation.core.animateDpAsState +import androidx.compose.foundation.background +import androidx.compose.foundation.clickable +import androidx.compose.foundation.interaction.MutableInteractionSource +import androidx.compose.foundation.layout.* +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.dp +import com.semicolon.design.color.primary.gray.gray100 +import com.semicolon.design.color.primary.purple.purple400 +import com.semicolon.design.color.primary.white.white + +@Composable +fun ToggleSwitch( + modifier: Modifier = Modifier, + defaultState: ToggleState = ToggleState.TOGGLE_OFF, + onToggleOn: () -> Unit = {}, + onToggleOff: () -> Unit = {} +) { + val isToggleOn = remember { mutableStateOf(defaultState == ToggleState.TOGGLE_ON) } + val backgroundColor: Color by animateColorAsState(if (isToggleOn.value) purple400 else gray100) + val spaceSize: Dp by animateDpAsState(if (isToggleOn.value) 20.dp else 0.dp) + Row( + modifier = modifier + .height(20.dp) + .width(40.dp) + .clip(RoundedCornerShape(10.dp)) + .background(backgroundColor) + .padding(1.dp) + .clickable( + interactionSource = MutableInteractionSource(), + indication = null + ) { + isToggleOn.value = !isToggleOn.value + if (isToggleOn.value) onToggleOn() else onToggleOff() + } + ) { + Spacer(modifier = Modifier.size(spaceSize)) + Spacer( + modifier = Modifier + .size(18.dp) + .clip(RoundedCornerShape(9.dp)) + .background(white) + ) + } +} + +@Preview(showBackground = true) +@Composable +fun ToggleSwitchPreview() { + ToggleSwitch( + defaultState = ToggleState.TOGGLE_OFF + ) +} + +enum class ToggleState { + TOGGLE_ON, TOGGLE_OFF +} \ No newline at end of file diff --git a/design/src/main/java/com/semicolon/design/NumberOfColor.kt b/design/src/main/java/com/semicolon/design/color/NumberOfColor.kt similarity index 78% rename from design/src/main/java/com/semicolon/design/NumberOfColor.kt rename to design/src/main/java/com/semicolon/design/color/NumberOfColor.kt index 5fd9dd3..8c71bbd 100644 --- a/design/src/main/java/com/semicolon/design/NumberOfColor.kt +++ b/design/src/main/java/com/semicolon/design/color/NumberOfColor.kt @@ -1,4 +1,4 @@ -package com.semicolon.design +package com.semicolon.design.color enum class NumberOfColor { N50, diff --git a/design/src/main/java/com/semicolon/design/primary/black/BlackColor.kt b/design/src/main/java/com/semicolon/design/color/primary/black/BlackColor.kt similarity index 59% rename from design/src/main/java/com/semicolon/design/primary/black/BlackColor.kt rename to design/src/main/java/com/semicolon/design/color/primary/black/BlackColor.kt index abd1bad..cfa223a 100644 --- a/design/src/main/java/com/semicolon/design/primary/black/BlackColor.kt +++ b/design/src/main/java/com/semicolon/design/color/primary/black/BlackColor.kt @@ -1,4 +1,4 @@ -package com.semicolon.design.primary.black +package com.semicolon.design.color.primary.black import androidx.compose.ui.graphics.Color diff --git a/design/src/main/java/com/semicolon/design/primary/black/BlackResource.kt b/design/src/main/java/com/semicolon/design/color/primary/black/BlackResource.kt similarity index 60% rename from design/src/main/java/com/semicolon/design/primary/black/BlackResource.kt rename to design/src/main/java/com/semicolon/design/color/primary/black/BlackResource.kt index a5cedc0..c424a66 100644 --- a/design/src/main/java/com/semicolon/design/primary/black/BlackResource.kt +++ b/design/src/main/java/com/semicolon/design/color/primary/black/BlackResource.kt @@ -1,4 +1,4 @@ -package com.semicolon.design.primary.black +package com.semicolon.design.color.primary.black import androidx.compose.ui.graphics.Color diff --git a/design/src/main/java/com/semicolon/design/primary/gray/GrayColor.kt b/design/src/main/java/com/semicolon/design/color/primary/gray/GrayColor.kt similarity index 84% rename from design/src/main/java/com/semicolon/design/primary/gray/GrayColor.kt rename to design/src/main/java/com/semicolon/design/color/primary/gray/GrayColor.kt index 1040696..450f5c0 100644 --- a/design/src/main/java/com/semicolon/design/primary/gray/GrayColor.kt +++ b/design/src/main/java/com/semicolon/design/color/primary/gray/GrayColor.kt @@ -1,7 +1,7 @@ -package com.semicolon.design.primary.gray +package com.semicolon.design.color.primary.gray import androidx.compose.ui.graphics.Color -import com.semicolon.design.NumberOfColor +import com.semicolon.design.color.NumberOfColor fun gray(number: NumberOfColor): Color { diff --git a/design/src/main/java/com/semicolon/design/primary/gray/GrayResource.kt b/design/src/main/java/com/semicolon/design/color/primary/gray/GrayResource.kt similarity index 88% rename from design/src/main/java/com/semicolon/design/primary/gray/GrayResource.kt rename to design/src/main/java/com/semicolon/design/color/primary/gray/GrayResource.kt index c849a96..cd24730 100644 --- a/design/src/main/java/com/semicolon/design/primary/gray/GrayResource.kt +++ b/design/src/main/java/com/semicolon/design/color/primary/gray/GrayResource.kt @@ -1,4 +1,4 @@ -package com.semicolon.design.primary.gray +package com.semicolon.design.color.primary.gray import androidx.compose.ui.graphics.Color diff --git a/design/src/main/java/com/semicolon/design/primary/purple/PurpleColor.kt b/design/src/main/java/com/semicolon/design/color/primary/purple/PurpleColor.kt similarity index 84% rename from design/src/main/java/com/semicolon/design/primary/purple/PurpleColor.kt rename to design/src/main/java/com/semicolon/design/color/primary/purple/PurpleColor.kt index 84b8bad..432bfc9 100644 --- a/design/src/main/java/com/semicolon/design/primary/purple/PurpleColor.kt +++ b/design/src/main/java/com/semicolon/design/color/primary/purple/PurpleColor.kt @@ -1,7 +1,7 @@ -package com.semicolon.design.primary.purple +package com.semicolon.design.color.primary.purple import androidx.compose.ui.graphics.Color -import com.semicolon.design.NumberOfColor +import com.semicolon.design.color.NumberOfColor fun purple(numberOfColor: NumberOfColor): Color { diff --git a/design/src/main/java/com/semicolon/design/primary/purple/PurpleResource.kt b/design/src/main/java/com/semicolon/design/color/primary/purple/PurpleResource.kt similarity index 80% rename from design/src/main/java/com/semicolon/design/primary/purple/PurpleResource.kt rename to design/src/main/java/com/semicolon/design/color/primary/purple/PurpleResource.kt index 9a0b292..1a47b89 100644 --- a/design/src/main/java/com/semicolon/design/primary/purple/PurpleResource.kt +++ b/design/src/main/java/com/semicolon/design/color/primary/purple/PurpleResource.kt @@ -1,11 +1,11 @@ -package com.semicolon.design.primary.purple +package com.semicolon.design.color.primary.purple import androidx.compose.ui.graphics.Color val purple50 = Color(0xFFF0E6FF) val purple100 = Color(0xFFD3B3FF) val purple200 = Color(0xFFB885FF) -val purple300 = Color(0xFF9650FA) +val purple300 = Color(0xFF9F62F5) val purple400 = Color(0xFF9650FA) val purple500 = Color(0xFF8335F0) val purple600 = Color(0xFF6D1BE0) diff --git a/design/src/main/java/com/semicolon/design/primary/white/WhiteColor.kt b/design/src/main/java/com/semicolon/design/color/primary/white/WhiteColor.kt similarity index 58% rename from design/src/main/java/com/semicolon/design/primary/white/WhiteColor.kt rename to design/src/main/java/com/semicolon/design/color/primary/white/WhiteColor.kt index 5f11051..7d858f5 100644 --- a/design/src/main/java/com/semicolon/design/primary/white/WhiteColor.kt +++ b/design/src/main/java/com/semicolon/design/color/primary/white/WhiteColor.kt @@ -1,4 +1,4 @@ -package com.semicolon.design.primary.white +package com.semicolon.design.color.primary.white import androidx.compose.ui.graphics.Color diff --git a/design/src/main/java/com/semicolon/design/primary/white/WhiteResource.kt b/design/src/main/java/com/semicolon/design/color/primary/white/WhiteResource.kt similarity index 59% rename from design/src/main/java/com/semicolon/design/primary/white/WhiteResource.kt rename to design/src/main/java/com/semicolon/design/color/primary/white/WhiteResource.kt index 2d0e45b..ec61aed 100644 --- a/design/src/main/java/com/semicolon/design/primary/white/WhiteResource.kt +++ b/design/src/main/java/com/semicolon/design/color/primary/white/WhiteResource.kt @@ -1,4 +1,4 @@ -package com.semicolon.design.primary.white +package com.semicolon.design.color.primary.white import androidx.compose.ui.graphics.Color diff --git a/design/src/main/java/com/semicolon/design/secondary/indigo/IndigoColor.kt b/design/src/main/java/com/semicolon/design/color/secondary/indigo/IndigoColor.kt similarity index 83% rename from design/src/main/java/com/semicolon/design/secondary/indigo/IndigoColor.kt rename to design/src/main/java/com/semicolon/design/color/secondary/indigo/IndigoColor.kt index 0279dd1..dc965de 100644 --- a/design/src/main/java/com/semicolon/design/secondary/indigo/IndigoColor.kt +++ b/design/src/main/java/com/semicolon/design/color/secondary/indigo/IndigoColor.kt @@ -1,7 +1,7 @@ -package com.semicolon.design.secondary.indigo +package com.semicolon.design.color.secondary.indigo import androidx.compose.ui.graphics.Color -import com.semicolon.design.NumberOfColor +import com.semicolon.design.color.NumberOfColor fun indigo(number: NumberOfColor): Color { diff --git a/design/src/main/java/com/semicolon/design/secondary/indigo/IndigoResource.kt b/design/src/main/java/com/semicolon/design/color/secondary/indigo/IndigoResource.kt similarity index 88% rename from design/src/main/java/com/semicolon/design/secondary/indigo/IndigoResource.kt rename to design/src/main/java/com/semicolon/design/color/secondary/indigo/IndigoResource.kt index ceda6d6..a8b7ec8 100644 --- a/design/src/main/java/com/semicolon/design/secondary/indigo/IndigoResource.kt +++ b/design/src/main/java/com/semicolon/design/color/secondary/indigo/IndigoResource.kt @@ -1,4 +1,4 @@ -package com.semicolon.design.secondary.indigo +package com.semicolon.design.color.secondary.indigo import androidx.compose.ui.graphics.Color diff --git a/design/src/main/java/com/semicolon/design/secondary/yellow/YellowColor.kt b/design/src/main/java/com/semicolon/design/color/secondary/yellow/YellowColor.kt similarity index 83% rename from design/src/main/java/com/semicolon/design/secondary/yellow/YellowColor.kt rename to design/src/main/java/com/semicolon/design/color/secondary/yellow/YellowColor.kt index 78a6a76..3f47d52 100644 --- a/design/src/main/java/com/semicolon/design/secondary/yellow/YellowColor.kt +++ b/design/src/main/java/com/semicolon/design/color/secondary/yellow/YellowColor.kt @@ -1,7 +1,7 @@ -package com.semicolon.design.secondary.yellow +package com.semicolon.design.color.secondary.yellow import androidx.compose.ui.graphics.Color -import com.semicolon.design.NumberOfColor +import com.semicolon.design.color.NumberOfColor fun yellow(number: NumberOfColor): Color { return when (number) { diff --git a/design/src/main/java/com/semicolon/design/secondary/yellow/YellosResource.kt b/design/src/main/java/com/semicolon/design/color/secondary/yellow/YellowResource.kt similarity index 88% rename from design/src/main/java/com/semicolon/design/secondary/yellow/YellosResource.kt rename to design/src/main/java/com/semicolon/design/color/secondary/yellow/YellowResource.kt index 7dc196e..fcf7d88 100644 --- a/design/src/main/java/com/semicolon/design/secondary/yellow/YellosResource.kt +++ b/design/src/main/java/com/semicolon/design/color/secondary/yellow/YellowResource.kt @@ -1,4 +1,4 @@ -package com.semicolon.design.secondary.yellow +package com.semicolon.design.color.secondary.yellow import androidx.compose.ui.graphics.Color diff --git a/design/src/main/java/com/semicolon/design/system/blue/BlueColor.kt b/design/src/main/java/com/semicolon/design/color/system/blue/BlueColor.kt similarity index 83% rename from design/src/main/java/com/semicolon/design/system/blue/BlueColor.kt rename to design/src/main/java/com/semicolon/design/color/system/blue/BlueColor.kt index d368987..7eaf8d1 100644 --- a/design/src/main/java/com/semicolon/design/system/blue/BlueColor.kt +++ b/design/src/main/java/com/semicolon/design/color/system/blue/BlueColor.kt @@ -1,7 +1,7 @@ -package com.semicolon.design.system.blue +package com.semicolon.design.color.system.blue import androidx.compose.ui.graphics.Color -import com.semicolon.design.NumberOfColor +import com.semicolon.design.color.NumberOfColor fun blue(number: NumberOfColor): Color { return when (number) { diff --git a/design/src/main/java/com/semicolon/design/system/blue/BlueResource.kt b/design/src/main/java/com/semicolon/design/color/system/blue/BlueResource.kt similarity index 88% rename from design/src/main/java/com/semicolon/design/system/blue/BlueResource.kt rename to design/src/main/java/com/semicolon/design/color/system/blue/BlueResource.kt index 3b46d2d..dd3ed8b 100644 --- a/design/src/main/java/com/semicolon/design/system/blue/BlueResource.kt +++ b/design/src/main/java/com/semicolon/design/color/system/blue/BlueResource.kt @@ -1,4 +1,4 @@ -package com.semicolon.design.system.blue +package com.semicolon.design.color.system.blue import androidx.compose.ui.graphics.Color diff --git a/design/src/main/java/com/semicolon/design/system/green/GreenColor.kt b/design/src/main/java/com/semicolon/design/color/system/green/GreenColor.kt similarity index 84% rename from design/src/main/java/com/semicolon/design/system/green/GreenColor.kt rename to design/src/main/java/com/semicolon/design/color/system/green/GreenColor.kt index d71ed04..853cfa8 100644 --- a/design/src/main/java/com/semicolon/design/system/green/GreenColor.kt +++ b/design/src/main/java/com/semicolon/design/color/system/green/GreenColor.kt @@ -1,7 +1,7 @@ -package com.semicolon.design.system.green +package com.semicolon.design.color.system.green import androidx.compose.ui.graphics.Color -import com.semicolon.design.NumberOfColor +import com.semicolon.design.color.NumberOfColor fun green(number: NumberOfColor): Color { return when (number) { diff --git a/design/src/main/java/com/semicolon/design/system/green/GreenResource.kt b/design/src/main/java/com/semicolon/design/color/system/green/GreenResource.kt similarity index 88% rename from design/src/main/java/com/semicolon/design/system/green/GreenResource.kt rename to design/src/main/java/com/semicolon/design/color/system/green/GreenResource.kt index 07b6253..f0b7320 100644 --- a/design/src/main/java/com/semicolon/design/system/green/GreenResource.kt +++ b/design/src/main/java/com/semicolon/design/color/system/green/GreenResource.kt @@ -1,4 +1,4 @@ -package com.semicolon.design.system.green +package com.semicolon.design.color.system.green import androidx.compose.ui.graphics.Color diff --git a/design/src/main/java/com/semicolon/design/system/red/RedColor.kt b/design/src/main/java/com/semicolon/design/color/system/red/RedColor.kt similarity index 83% rename from design/src/main/java/com/semicolon/design/system/red/RedColor.kt rename to design/src/main/java/com/semicolon/design/color/system/red/RedColor.kt index 00cb224..85e4fd5 100644 --- a/design/src/main/java/com/semicolon/design/system/red/RedColor.kt +++ b/design/src/main/java/com/semicolon/design/color/system/red/RedColor.kt @@ -1,7 +1,7 @@ -package com.semicolon.design.system.red +package com.semicolon.design.color.system.red import androidx.compose.ui.graphics.Color -import com.semicolon.design.NumberOfColor +import com.semicolon.design.color.NumberOfColor fun red(number: NumberOfColor): Color { return when (number) { diff --git a/design/src/main/java/com/semicolon/design/system/red/RedResource.kt b/design/src/main/java/com/semicolon/design/color/system/red/RedResource.kt similarity index 88% rename from design/src/main/java/com/semicolon/design/system/red/RedResource.kt rename to design/src/main/java/com/semicolon/design/color/system/red/RedResource.kt index 2adbcc3..53dadce 100644 --- a/design/src/main/java/com/semicolon/design/system/red/RedResource.kt +++ b/design/src/main/java/com/semicolon/design/color/system/red/RedResource.kt @@ -1,4 +1,4 @@ -package com.semicolon.design.system.red +package com.semicolon.design.color.system.red import androidx.compose.ui.graphics.Color diff --git a/design/src/main/java/com/semicolon/design/util/CircularProgressBar.kt b/design/src/main/java/com/semicolon/design/util/CircularProgressBar.kt new file mode 100644 index 0000000..a7dade3 --- /dev/null +++ b/design/src/main/java/com/semicolon/design/util/CircularProgressBar.kt @@ -0,0 +1,30 @@ +package com.semicolon.design.util + +import androidx.compose.foundation.border +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material.CircularProgressIndicator +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.unit.dp + +@Composable +fun CircularProgressBar( + progressColor: Color, + backgroundColor: Color, + modifier: Modifier +) { + Box{ + Spacer( + modifier = modifier + .border(1.dp, backgroundColor, RoundedCornerShape(7.dp)) + ) + CircularProgressIndicator( + strokeWidth = 1.dp, + color = progressColor, + modifier = modifier + ) + } +} \ No newline at end of file