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

refactor: 업로드 뷰 디자인 변경 #381

Merged
merged 12 commits into from
Oct 4, 2023
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,6 @@ import com.now.naaga.R
import com.now.naaga.data.firebase.analytics.AnalyticsDelegate
import com.now.naaga.data.firebase.analytics.DefaultAnalyticsDelegate
import com.now.naaga.data.firebase.analytics.UPLOAD_OPEN_CAMERA
import com.now.naaga.data.firebase.analytics.UPLOAD_SET_COORDINATE
import com.now.naaga.data.throwable.DataThrowable
import com.now.naaga.databinding.ActivityUploadBinding
import com.now.naaga.presentation.beginadventure.LocationPermissionDialog
Expand Down Expand Up @@ -97,7 +96,7 @@ class UploadActivity : AppCompatActivity(), AnalyticsDelegate by DefaultAnalytic
UploadStatus.PENDING -> { changeVisibility(binding.lottieUploadLoading, View.VISIBLE) }
UploadStatus.FAIL -> {
changeVisibility(binding.lottieUploadLoading, View.GONE)
shortToast(MESSAGE_FAIL_UPLOAD)
shortToast(getString(R.string.upload_fail_submit))
}
}
}
Expand All @@ -106,14 +105,10 @@ class UploadActivity : AppCompatActivity(), AnalyticsDelegate by DefaultAnalytic
UploadViewModel.ERROR_STORE_PHOTO -> {
shortToast(getString(R.string.upload_error_store_photo_message))
}

UploadViewModel.ALREADY_EXISTS_NEARBY -> {
shortToast(getString(R.string.upload_error_already_exists_nearby_message))
}

UploadViewModel.ERROR_POST_BODY -> {
shortToast(getString(R.string.upload_error_post_message))
}
UploadViewModel.ERROR_POST_BODY -> { shortToast(getString(R.string.upload_error_post_message)) }
}
}
}
Expand All @@ -140,11 +135,7 @@ class UploadActivity : AppCompatActivity(), AnalyticsDelegate by DefaultAnalytic
val fusedLocationClient = LocationServices.getFusedLocationProviderClient(this)
fusedLocationClient.getCurrentLocation(PRIORITY_HIGH_ACCURACY, createCancellationToken())
.addOnSuccessListener { location ->
if (location != null) {
val coordinate = getCoordinate(location)
binding.tvUploadPhotoCoordinate.text = coordinate.toText()
viewModel.setCoordinate(coordinate)
}
location.let { viewModel.setCoordinate(getCoordinate(location)) }
}
.addOnFailureListener { }
}
Expand Down Expand Up @@ -178,18 +169,10 @@ class UploadActivity : AppCompatActivity(), AnalyticsDelegate by DefaultAnalytic
logClickEvent(getViewEntryName(it), UPLOAD_OPEN_CAMERA)
checkCameraPermission()
}

binding.ivUploadPhoto.setOnClickListener {
logClickEvent(getViewEntryName(it), UPLOAD_OPEN_CAMERA)
checkCameraPermission()
}
binding.ivUploadPhotoCoordinate.setOnClickListener {
logClickEvent(getViewEntryName(it), UPLOAD_SET_COORDINATE)
checkLocationPermission()
}
binding.ivUploadClose.setOnClickListener {
finish()
}
binding.btnUploadSubmit.setOnClickListener {
if (isFormValid().not()) {
shortToast(getString(R.string.upload_error_insufficient_info_message))
Expand All @@ -211,14 +194,6 @@ class UploadActivity : AppCompatActivity(), AnalyticsDelegate by DefaultAnalytic
cameraLauncher.launch(null)
}

private fun checkLocationPermission() {
if (checkSelfPermission(Manifest.permission.ACCESS_FINE_LOCATION) == PackageManager.PERMISSION_DENIED) {
LocationPermissionDialog().show(supportFragmentManager, TAG_LOCATION_DIALOG)
} else {
setCoordinate()
}
}

private fun setImage(bitmap: Bitmap) {
binding.ivUploadCameraIcon.visibility = View.GONE
binding.ivUploadPhoto.setImageBitmap(bitmap)
Expand Down Expand Up @@ -270,8 +245,6 @@ class UploadActivity : AppCompatActivity(), AnalyticsDelegate by DefaultAnalytic
Manifest.permission.CAMERA,
)

private const val MESSAGE_FAIL_UPLOAD = "장소등록에 실패했어요!"

val contentValues = ContentValues().apply {
put(MediaStore.Images.Media.DISPLAY_NAME, "ImageTitle")
put(MediaStore.Images.Media.MIME_TYPE, "image/jpeg")
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,8 +23,6 @@ class UploadViewModel @Inject constructor(

val name = MutableLiveData<String>()

val description = MutableLiveData<String>()

private val _successUpload = MutableSingleLiveData<UploadStatus>()
val successUpload: SingleLiveData<UploadStatus> = _successUpload

Expand All @@ -43,8 +41,7 @@ class UploadViewModel @Inject constructor(
}

fun isFormValid(): Boolean {
return (imageUri != URI_EMPTY) && (_coordinate.value != null) &&
(name.value != null) && (description.value != null)
return (imageUri != URI_EMPTY) && (_coordinate.value != null) && (name.value != null)
}

fun postPlace() {
Expand All @@ -54,7 +51,7 @@ class UploadViewModel @Inject constructor(
runCatching {
placeRepository.postPlace(
name = name.value.toString(),
description = description.value.toString(),
description = "",
coordinate = coordinate,
image = imageUri,
)
Expand Down
55 changes: 55 additions & 0 deletions android/app/src/main/res/drawable/bg_button.xml
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt"
android:width="320dp"
android:height="60dp"
android:viewportWidth="320"
android:viewportHeight="60">
<path
android:pathData="M12,0L308,0A12,12 0,0 1,320 12L320,48A12,12 0,0 1,308 60L12,60A12,12 0,0 1,0 48L0,12A12,12 0,0 1,12 0z"
android:fillColor="#FFFDBA"/>
<path
android:pathData="M26.02,0L308,0A12,12 0,0 1,320 12L320,48A12,12 0,0 1,308 60L26.02,60A12,12 0,0 1,14.02 48L14.02,12A12,12 0,0 1,26.02 0z"
android:fillColor="#FEFA1D"/>
<path
android:pathData="M0,14.98C0,9.9 3.2,5.37 7.98,3.67L13.43,1.74C14.71,1.28 16.07,1.04 17.44,1.04H308C314.63,1.04 320,6.42 320,13.04V48C320,54.63 314.63,60 308,60H12C5.37,60 0,54.63 0,48V14.98Z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="160"
android:startY="1.04"
android:endX="160"
android:endY="60"
android:type="linear">
<item android:offset="0" android:color="#FFFEFA1D"/>
<item android:offset="0.05" android:color="#FFFFD50C"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M0,31.06h320v28.92h-320z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="160"
android:startY="31.06"
android:endX="160"
android:endY="59.98"
android:type="linear">
<item android:offset="0" android:color="#FFFFD50C"/>
<item android:offset="0.07" android:color="#FFFFB70A"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M2.09,55.83L317.91,55.83A2.09,2.09 0,0 1,320 57.91L320,57.91A2.09,2.09 0,0 1,317.91 60L2.09,60A2.09,2.09 0,0 1,0 57.91L0,57.91A2.09,2.09 0,0 1,2.09 55.83z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="160"
android:startY="55.83"
android:endX="160"
android:endY="60"
android:type="linear">
<item android:offset="0" android:color="#FFFFB80B"/>
<item android:offset="0.52" android:color="#C6DA8002"/>
</gradient>
</aapt:attr>
</path>
</vector>
156 changes: 56 additions & 100 deletions android/app/src/main/res/layout/activity_upload.xml
Original file line number Diff line number Diff line change
Expand Up @@ -33,17 +33,40 @@
app:lottie_loop="true"
app:lottie_rawRes="@raw/simple_loading" />

<ImageView
android:id="@+id/iv_upload_back"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:paddingHorizontal="20dp"
android:paddingVertical="@dimen/space_default_medium"
android:src="@drawable/ic_arrow"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<TextView
android:id="@+id/tv_upload_activity_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/upload_title"
android:textSize="28sp"
app:layout_constraintBottom_toBottomOf="@id/iv_upload_back"
app:layout_constraintStart_toEndOf="@id/iv_upload_back"
app:layout_constraintTop_toTopOf="@id/iv_upload_back" />

<ImageView
android:id="@+id/iv_upload_photo"
android:layout_width="180dp"
android:layout_height="180dp"
android:layout_width="300dp"
android:layout_height="300dp"
android:layout_marginTop="@dimen/space_default_large"
android:background="@drawable/rect_radius_small"
android:backgroundTint="@color/white"
android:scaleType="centerCrop"
app:layout_constraintBottom_toTopOf="@id/tv_upload_title"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
app:layout_constraintTop_toBottomOf="@id/tv_upload_activity_title" />

<ImageView
android:id="@+id/iv_upload_camera_icon"
Expand All @@ -55,127 +78,60 @@
app:layout_constraintStart_toStartOf="@id/iv_upload_photo"
app:layout_constraintTop_toTopOf="@id/iv_upload_photo" />

<EditText
android:id="@+id/et_upload_photo_title"
android:layout_width="0dp"
<TextView
android:id="@+id/tv_upload_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginHorizontal="@dimen/space_default_large"
android:layout_marginTop="@dimen/space_default_medium"
android:autofillHints="no"
android:ellipsize="end"
android:hint="@string/upload_photo_title"
android:inputType="text"
android:maxLines="1"
android:text="@={viewModel.name}"
android:textAlignment="textStart"
android:layout_marginTop="@dimen/space_default_large"
android:text="@string/upload_photo_title"
android:textSize="28sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/iv_upload_photo"
tools:text="선정릉 돌담길" />

<ImageView
android:id="@+id/iv_upload_photo_coordinate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/space_default_medium"
android:src="@drawable/ic_coordinate"
app:layout_constraintEnd_toStartOf="@id/tv_upload_photo_coordinate"
app:layout_constraintStart_toStartOf="@id/et_upload_photo_title"
app:layout_constraintTop_toBottomOf="@id/et_upload_photo_title" />

<TextView
android:id="@+id/tv_upload_photo_coordinate"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/rect_radius_small"
android:backgroundTint="@color/white"
android:fontFamily="@font/pretendard_medium"
android:gravity="center"
android:textSize="28sp"
app:layout_constraintBottom_toBottomOf="@id/iv_upload_photo_coordinate"
app:layout_constraintEnd_toEndOf="@id/et_upload_photo_title"
app:layout_constraintStart_toEndOf="@id/iv_upload_photo_coordinate"
app:layout_constraintTop_toTopOf="@id/iv_upload_photo_coordinate"
tools:text="35.123, 127.345" />
app:layout_constraintTop_toBottomOf="@id/iv_upload_photo" />

<View
android:id="@+id/v_upload_divide_line_1"
android:layout_width="0dp"
android:layout_height="3dp"
android:layout_marginTop="@dimen/space_default_large"
android:background="@color/black"
app:layout_constraintEnd_toEndOf="@id/et_upload_photo_title"
app:layout_constraintStart_toStartOf="@id/et_upload_photo_title"
app:layout_constraintTop_toBottomOf="@id/tv_upload_photo_coordinate" />
android:layout_marginHorizontal="@dimen/space_default_large"
android:layout_marginTop="@dimen/space_default_medium"
android:background="@color/white"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/tv_upload_title" />

<TextView
android:id="@+id/tv_upload_description"
<EditText
Copy link
Collaborator

Choose a reason for hiding this comment

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

[P5]
android:background="@null" 를 추가해서 EditText의 밑줄을 없애는 건 어떻게 생각하시나요?!
밑줄을 없애면 아래의 그림처럼 보인답니다! 이건 단순 제 제안이니 크롱이 원하는 걸로 하시면 됩니다!
image

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

반영했어요!
다만, 유저가 글자를 입력하는 곳이 어디인지 모르지는 않을까.. 조금 걱정이긴합니다! 그래서 hint를 조금 수정했어요
사용자 유치를 열심히 해서 피드백을 반영해보도록 하죠!

android:id="@+id/et_upload_place_name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/space_default_large"
android:fontFamily="@font/pretendard_bold"
android:text="@string/upload_description"
android:textSize="28sp"
app:layout_constraintEnd_toEndOf="@id/et_upload_photo_title"
app:layout_constraintStart_toStartOf="@id/et_upload_photo_title"
app:layout_constraintTop_toBottomOf="@id/v_upload_divide_line_1" />

<EditText
android:id="@+id/et_upload_photo_description"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="@dimen/space_default_medium"
android:autofillHints="no"
android:background="@drawable/rect_radius_small"
android:backgroundTint="@color/white"
android:fontFamily="@font/pretendard_medium"
android:gravity="top"
android:hint="@string/upload_photo_description"
android:ellipsize="end"
android:hint="@string/upload_photo_title_hint"
android:textColorHint="@color/white"
android:inputType="text"
android:padding="@dimen/space_default_medium"
android:text="@={viewModel.description}"
app:layout_constraintBottom_toTopOf="@id/v_upload_divide_line_2"
app:layout_constraintEnd_toEndOf="@id/et_upload_photo_title"
app:layout_constraintStart_toStartOf="@id/et_upload_photo_title"
app:layout_constraintTop_toBottomOf="@id/tv_upload_description"
app:layout_constraintVertical_chainStyle="spread" />

<View
android:id="@+id/v_upload_divide_line_2"
android:layout_width="0dp"
android:layout_height="3dp"
android:layout_marginTop="@dimen/space_default_large"
android:background="@color/black"
app:layout_constraintBottom_toTopOf="@id/btn_upload_submit"
app:layout_constraintEnd_toEndOf="@id/et_upload_photo_title"
app:layout_constraintStart_toStartOf="@id/et_upload_photo_title"
app:layout_constraintTop_toBottomOf="@id/et_upload_photo_description" />

<Button
android:id="@+id/btn_upload_submit"
android:maxLines="1"
android:text="@={viewModel.name}"
android:textAlignment="textEnd"
android:textColor="@color/white"
android:textSize="24sp"
app:layout_constraintEnd_toEndOf="@id/v_upload_divide_line_1"
app:layout_constraintStart_toStartOf="@id/v_upload_divide_line_1"
app:layout_constraintTop_toBottomOf="@id/tv_upload_title"/>

<androidx.appcompat.widget.AppCompatButton
android:id="@+id/btn_upload_su경bmit"
Copy link
Collaborator

@hyunji1203 hyunji1203 Oct 4, 2023

Choose a reason for hiding this comment

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

친구가 저 사이에 들어가 버렸어요!

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

맥 고질병인가요...😢

android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginHorizontal="@dimen/space_default_large"
android:layout_marginTop="@dimen/space_default_large"
android:layout_marginBottom="@dimen/space_default_large"
android:fontFamily="@font/pretendard_bold"
android:background="@drawable/bg_button"
android:text="@string/upload_submit"
android:textSize="28sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/v_upload_divide_line_2" />

<ImageView
android:id="@+id/iv_upload_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginEnd="20dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/ic_close" />
app:layout_constraintStart_toStartOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
Loading
Loading