Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

워키TopBar 구현 #39

Merged
merged 3 commits into from
Sep 14, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
package com.whyranoid.presentation.component.bar

import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp

@Composable
fun WalkieTopBar(
leftContent: @Composable (() -> Unit)? = null,
middleContent: @Composable (() -> Unit)? = null,
rightContent: @Composable (() -> Unit)? = null,
) {
Row(
modifier = Modifier
.fillMaxWidth()
.height(54.dp)
.padding(20.dp, 13.dp),
Comment on lines +14 to +23
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

매게변수에 modifier를 추가적으로 받게하는건 어떻게 생각하시나요??


verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.SpaceBetween,
) {
leftContent?.let {
it()
}
middleContent?.let {
it()
}
rightContent?.let {
it()
}

}
}
Original file line number Diff line number Diff line change
@@ -1,30 +1,97 @@
package com.whyranoid.presentation.screens

import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.LazyRow
import androidx.compose.material.Icon
import androidx.compose.material.Scaffold
import androidx.compose.material.Text
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Add
import androidx.compose.material.icons.filled.KeyboardArrowDown
import androidx.compose.material.icons.filled.Search
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp
import androidx.navigation.NavController
import com.whyranoid.presentation.component.bar.WalkieTopBar
import com.whyranoid.presentation.component.community.PostItem
import com.whyranoid.presentation.component.community.RunningFollowerItem
import com.whyranoid.presentation.theme.WalkieTypography

@Composable
fun CommunityScreen(
navController: NavController
) {

LazyColumn {
Scaffold(
topBar = {
WalkieTopBar(
leftContent = {
Row {
Text(
text = "커뮤니티",
style = WalkieTypography.Title.copy(fontWeight = FontWeight(600)),
)

item {
LazyRow {
repeat(10) {
item { RunningFollowerItem() }
Spacer(modifier = Modifier.width(7.dp))

Icon(
modifier = Modifier
.clickable {

},
imageVector = Icons.Filled.KeyboardArrowDown, contentDescription = "Down Arrow"
)
}
},
rightContent = {
Row {
Icon(
modifier = Modifier
.clickable {

},
imageVector = Icons.Filled.Add, contentDescription = "추가 버튼"
)

Spacer(modifier = Modifier.width(16.dp))

Icon(
modifier = Modifier
.clickable {

},
imageVector = Icons.Filled.Search, contentDescription = "검색 버튼"
)
}

},
)
},
) {

LazyColumn(
modifier = Modifier.padding(it)
) {

item {
LazyRow {
repeat(10) {
item { RunningFollowerItem() }
}
}
}
}

repeat(10) {
item {
PostItem()
repeat(10) {
item {
PostItem()
}
}
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,8 @@ import androidx.compose.material.IconButton
import androidx.compose.material.Scaffold
import androidx.compose.material.Text
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Menu
import androidx.compose.material.icons.filled.Search
import androidx.compose.material.icons.rounded.ExpandMore
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
Expand All @@ -34,6 +36,7 @@ import com.whyranoid.domain.model.challenge.ChallengePreview
import com.whyranoid.domain.model.challenge.ChallengeType
import com.whyranoid.presentation.component.ChallengeItem
import com.whyranoid.presentation.component.ChallengingItem
import com.whyranoid.presentation.component.bar.WalkieTopBar
import com.whyranoid.presentation.reusable.WalkieCircularProgressIndicator
import com.whyranoid.presentation.theme.ChallengeColor.getColor
import com.whyranoid.presentation.theme.WalkieTypography
Expand Down Expand Up @@ -75,12 +78,46 @@ fun ChallengeMainContent(
) {

Scaffold(
Modifier.padding(horizontal = 20.dp)
) { paddingValues ->
topBar = {
WalkieTopBar(
leftContent = {
Text(
text = "챌린지",
style = WalkieTypography.Title.copy(fontWeight = FontWeight(600)),
)
},
rightContent = {
Row {
Icon(
modifier = Modifier
.clickable {

},
imageVector = Icons.Filled.Search, contentDescription = "검색 버튼"
)

Spacer(modifier = Modifier.width(16.dp))

Icon(
modifier = Modifier
.clickable {

},
imageVector = Icons.Filled.Menu, contentDescription = "메뉴 버튼"
)
}

},
)
},
) { paddingValues ->
val pagerState = rememberPagerState()

LazyColumn(modifier = Modifier.padding(paddingValues)) {
LazyColumn(
modifier = Modifier
.padding(paddingValues)
.padding(horizontal = 20.dp)
) {

item {
Spacer(modifier = Modifier.height(10.dp))
Expand Down