Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
 into ui/#14-on-boarding
  • Loading branch information
leeeyubin committed Jul 11, 2024
2 parents cb3b7a0 + 5163ce3 commit 0b584c1
Show file tree
Hide file tree
Showing 7 changed files with 184 additions and 6 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
package com.terning.core.designsystem.component.bottomsheet

import androidx.annotation.StringRes
import com.terning.core.R

enum class SortBy(@StringRes val type: Int) {
EARLIEST(R.string.sort_by_earliest),
SHORTEST(R.string.sort_by_shortest),
LONGEST(R.string.sort_by_longest),
SCRAP(R.string.sort_by_scrap),
VIEW_COUNT(R.string.sort_by_view_count),
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,94 @@
package com.terning.core.designsystem.component.bottomsheet

import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.HorizontalDivider
import androidx.compose.material3.Text
import androidx.compose.material3.rememberModalBottomSheetState
import androidx.compose.runtime.Composable
import androidx.compose.runtime.MutableState
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import com.terning.core.R
import com.terning.core.designsystem.theme.Black
import com.terning.core.designsystem.theme.Grey200
import com.terning.core.designsystem.theme.Grey400
import com.terning.core.designsystem.theme.TerningMain
import com.terning.core.designsystem.theme.TerningTheme
import com.terning.core.extension.noRippleClickable
import kotlinx.coroutines.launch

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun SortingBottomSheet(
onDismiss: () -> Unit,
currentSortBy: Int,
modifier: Modifier = Modifier,
newSortBy: MutableState<Int> = mutableStateOf(currentSortBy),
) {
val scope = rememberCoroutineScope()
val sheetState = rememberModalBottomSheetState()
var currentSortBy by remember { mutableStateOf(currentSortBy) }

TerningBasicBottomSheet(
content = {
Text(
text = stringResource(id = R.string.sort_bottom_sheet_title),
style = TerningTheme.typography.title2,
color = Black,
modifier = modifier
.padding(start = 27.dp, bottom = 16.dp)
)

HorizontalDivider(
thickness = 1.dp,
color = Grey200,
modifier = modifier.padding(horizontal = 24.dp)
)

LazyColumn(
modifier = modifier
.padding(top = 12.dp, bottom = 19.dp)
.padding(horizontal = 24.dp),
verticalArrangement = Arrangement.spacedBy(8.dp)
) {
items(sortByCount) { sortIndex ->
Text(
text = stringResource(id = SortBy.entries[sortIndex].type),
style = TerningTheme.typography.button3,
color = if (currentSortBy == sortIndex) TerningMain else Grey400,
textAlign = TextAlign.Start,
modifier = modifier
.fillMaxWidth()
.padding(start = 3.dp)
.padding(vertical = 12.dp)
.noRippleClickable {
newSortBy.value = sortIndex
scope
.launch { sheetState.hide() }
.invokeOnCompletion {
if (!sheetState.isVisible) {
onDismiss()
}
}
}
)
}
}
},
onDismissRequest = { onDismiss() },
sheetState = sheetState
)
}

private const val sortByCount = 5
Original file line number Diff line number Diff line change
@@ -1,27 +1,26 @@
package com.terning.core.designsystem.component.bottomsheet

import androidx.compose.foundation.layout.navigationBarsPadding
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.ModalBottomSheet
import androidx.compose.material3.SheetState
import androidx.compose.material3.rememberModalBottomSheetState
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import com.terning.core.designsystem.theme.White

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun TerningBasicBottomSheet(
modifier: Modifier = Modifier,
content: @Composable () -> Unit,
onDismissRequest: () -> Unit
onDismissRequest: () -> Unit,
sheetState: SheetState = rememberModalBottomSheetState()
) {
val sheetState = rememberModalBottomSheetState()

ModalBottomSheet(
onDismissRequest = {
onDismissRequest()
},
sheetState = sheetState,
modifier = modifier.navigationBarsPadding()
containerColor = White,
) {
content()
}
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
package com.terning.core.designsystem.component.button

import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import com.terning.core.R
import com.terning.core.designsystem.component.bottomsheet.SortBy
import com.terning.core.designsystem.theme.Black
import com.terning.core.designsystem.theme.TerningTheme
import com.terning.core.extension.noRippleClickable

@Composable
fun SortingButton(
sortBy: Int = 0,
modifier: Modifier = Modifier,
onCLick: () -> Unit,
) {
Row(
modifier = modifier
.noRippleClickable { onCLick() }
) {
Text(
text = stringResource(
id = SortBy.entries[sortBy].type
),
style = TerningTheme.typography.button3,
color = Black,
modifier = modifier
.padding(
top = 6.dp,
bottom = 5.dp,
start = 12.dp,
)
)
Image(
painter = painterResource(id = R.drawable.ic_down),
contentDescription = stringResource(id = R.string.sort_button_description),
modifier = modifier
.padding(vertical = 5.dp)
.padding(end = 2.dp)
)
}
}
13 changes: 13 additions & 0 deletions core/src/main/res/drawable/ic_down.xml
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="18dp"
android:height="18dp"
android:viewportWidth="18"
android:viewportHeight="18">
<path
android:pathData="M5,7L9,11L13,7"
android:strokeLineJoin="round"
android:strokeWidth="1.5"
android:fillColor="#00000000"
android:strokeColor="#000000"
android:strokeLineCap="round"/>
</vector>
9 changes: 9 additions & 0 deletions core/src/main/res/values/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -11,4 +11,13 @@
<!-- button-->
<string name="button_preview">button</string>

<!-- 정렬 버튼 + 바텀시트 -->
<string name="sort_by_earliest">채용 마감 이른순</string>
<string name="sort_by_shortest">짧은 근무 기간순</string>
<string name="sort_by_longest">긴 근무 기간순</string>
<string name="sort_by_scrap">스크랩 많은순</string>
<string name="sort_by_view_count">조회수 많은순</string>
<string name="sort_button_description">정렬 기준</string>
<string name="sort_bottom_sheet_title">공고 정렬 순서</string>

</resources>
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
import androidx.compose.foundation.lazy.grid.items
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
Expand All @@ -25,6 +26,7 @@ import com.terning.core.designsystem.theme.TerningTheme
import com.terning.core.extension.noRippleClickable
import com.terning.feature.R

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun SignUpBottomSheet(
modifier: Modifier = Modifier,
Expand Down

0 comments on commit 0b584c1

Please sign in to comment.