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.

Sign up for GitHub

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

Jump to bottom

[refactor] 에러 뷰, 로딩 뷰 추가 된 디자인 적용 #187

Merged
merged 15 commits into from
Aug 23, 2024
Merged

[refactor] 에러 뷰, 로딩 뷰 추가 된 디자인 적용 #187

Show file tree
Hide file tree
Changes from 8 commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
f86c315
[feat] #186 에러 뷰 에셋 추가 및 뷰 구현
t1nm1ksun Aug 16, 2024
845745f
[chore] ktlint Format
t1nm1ksun Aug 16, 2024
1f79c24
[chore] #186 에러 뷰 고정 값 제거
t1nm1ksun Aug 16, 2024
c4e1eb0
[feat] #186 로딩 뷰 에셋 추가 및 뷰 구현
t1nm1ksun Aug 16, 2024
2d31b74
[chore] #186 contentScale 제거
t1nm1ksun Aug 17, 2024
a01829e
[chore] #186 string value 오타 수정
t1nm1ksun Aug 17, 2024
c38ea7c
[chore] #186 리소스 파일 네이밍 수정
t1nm1ksun Aug 17, 2024
880bfec
[chore] #186 ktlint Format
t1nm1ksun Aug 17, 2024
ea785fd
[chore] #186 불필요한 Spacer 제거
t1nm1ksun Aug 19, 2024
42bab5d
[chore] #186 멘트 변경사항 적용
t1nm1ksun Aug 23, 2024
09ca94c
[chore] #186 에러 뷰 뒤로 가기 버튼 추가
t1nm1ksun Aug 23, 2024
424c376
[chore] #186 ktlint Format
t1nm1ksun Aug 23, 2024
62a4173
[chore] #186 로딩 뷰 이미지 변경, 에러 뷰 패딩값 수정
t1nm1ksun Aug 23, 2024
2952fd2
Merge remote-tracking branch 'refs/remotes/origin/develop' into refac…
t1nm1ksun Aug 23, 2024
c8d4c88
[chore] #186 인자명 변경
t1nm1ksun Aug 23, 2024
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
34 changes: 21 additions & 13 deletions app/src/main/java/org/sopt/dateroad/presentation/ui/component/view/DateRoadErrorView.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ package org.sopt.dateroad.presentation.ui.component.view

import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
Expand All @@ -13,10 +12,10 @@ import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import org.sopt.dateroad.R
import org.sopt.dateroad.ui.theme.DateRoadTheme
Expand All @@ -26,26 +25,35 @@ fun DateRoadErrorView(
modifier: Modifier = Modifier
) {
Column(
modifier = modifier.fillMaxSize()
modifier = modifier
.fillMaxSize()
.background(color = DateRoadTheme.colors.white),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
horizontalAlignment = Alignment.CenterHorizontally
) {
Spacer(modifier = Modifier.weight(193f))
Image(
modifier = Modifier.fillMaxWidth(),
painter = painterResource(id = R.drawable.ic_empty_default),
contentDescription = null,
contentScale = ContentScale.FillWidth
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 64.dp),
Copy link
Contributor

Choose a reason for hiding this comment

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

고정값 패딩을 주지 않고 기본 사이즈로 넣어주셔도 될 것 같아요! 요렇게 하려면 ContentScale.FillWidth 지워줘야함 ~

Copy link
Contributor

Choose a reason for hiding this comment

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

지워주세요 ㅠ

Copy link
Contributor

Choose a reason for hiding this comment

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

얘도 지워주세요!!! 패딩값!!

Copy link
Contributor Author

Choose a reason for hiding this comment

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

얼아라?? ContentScale.FillWidth 이거 지워주면 되는거 아니엇서요?

Copy link
Contributor

Choose a reason for hiding this comment

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

ContentScale.FillWidth 이거 지워주면 이미지가 화면을 꽉 채우지 않고 현재 이미지 사이즈만큼의 크기를 가지게 되잖아요?? 그래서 패딩 따로 안 줘두 됨!!

painter = painterResource(id = R.drawable.ic_error_server),
contentDescription = null

)
Spacer(modifier = Modifier.height(16.dp))
Spacer(modifier = Modifier.height(30.dp))
t1nm1ksun marked this conversation as resolved.
Show resolved Hide resolved
Text(
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 20.dp),
text = stringResource(id = R.string.erro_view_server),
.fillMaxWidth(),
text = stringResource(id = R.string.error_view_server),
color = DateRoadTheme.colors.gray500,
style = DateRoadTheme.typography.titleBold18,
textAlign = TextAlign.Center
)
Spacer(modifier = Modifier.weight(186f))
}
}

@Preview
@Composable
fun ErrorPreview() {
DateRoadErrorView()
}
53 changes: 45 additions & 8 deletions app/src/main/java/org/sopt/dateroad/presentation/ui/component/view/DateRoadLoadingView.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,19 +1,56 @@
package org.sopt.dateroad.presentation.ui.component.view

import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import org.sopt.dateroad.R
import org.sopt.dateroad.ui.theme.DateRoadTheme

@Composable
fun DateRoadLoadingView(
modifier: Modifier = Modifier
) {
Box(
modifier = modifier
fun DateRoadLoadingView() {
Column(
modifier = Modifier
.fillMaxSize()
.background(color = DateRoadTheme.colors.white)
)
.background(color = DateRoadTheme.colors.white),
horizontalAlignment = Alignment.CenterHorizontally
) {
Spacer(modifier = Modifier.weight(125f))
Image(
modifier = Modifier
.fillMaxWidth(),
painter = painterResource(id = R.drawable.ic_loading_server),
contentDescription = null,
contentScale = ContentScale.FillWidth
)
Spacer(modifier = Modifier.height(30.dp))
Copy link
Contributor

Choose a reason for hiding this comment

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

간격 없지롱 ㅋㅋ

Copy link
Contributor Author

Choose a reason for hiding this comment

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

뭐야 여긴 없네 !!! 미아냉

Copy link
Contributor

Choose a reason for hiding this comment

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

왜 안 지우냐능 ㅠㅠ

Text(
modifier = Modifier
.fillMaxWidth(),
text = stringResource(id = R.string.loading_view_server),
color = DateRoadTheme.colors.gray500,
style = DateRoadTheme.typography.titleBold18,
textAlign = TextAlign.Center
)
Spacer(modifier = Modifier.weight(155f))
}
}

@Preview
@Composable
fun DateLoadLoadingViewPreview() {
DateRoadLoadingView()
}
Loading
Loading