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

[feat] 메인 지도 뷰 참여모달 구현 #30

Merged
merged 9 commits into from
Jan 5, 2024
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
package org.sopt.pingle.presentation.ui.main.home.map

import android.os.Bundle
import android.view.View
import org.sopt.pingle.R
import org.sopt.pingle.databinding.DialogMapModalBinding
import org.sopt.pingle.presentation.type.CategoryType
import org.sopt.pingle.util.base.BindingDialogFragment
import org.sopt.pingle.util.fragment.colorOf

class MapModalDialogFragment(
private val category: CategoryType,
private val name: String,
private val ownerName: String,
private val clickBtn: () -> Unit
) : BindingDialogFragment<DialogMapModalBinding>(R.layout.dialog_map_modal) {

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)

initLayout()
addListeners()
}

private fun initLayout() {
with(binding) {
badgeMapModalPingleInfoCategory.setBadgeCategoryType(category)
tvMapModalPingleInfoName.text = name
tvMapModalPingleInfoName.setTextColor(colorOf(category.textColor))
tvMapModalPingleInfoOwnerName.text = ownerName
}
}

private fun addListeners() {
binding.btnMapModal.setOnClickListener {
clickBtn()
dismiss()
}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import androidx.annotation.LayoutRes
import androidx.databinding.DataBindingUtil
import androidx.databinding.ViewDataBinding
import androidx.fragment.app.DialogFragment
import org.sopt.pingle.R

abstract class BindingDialogFragment<T : ViewDataBinding>(@LayoutRes private val layoutResId: Int) :
DialogFragment() {
Expand All @@ -31,7 +32,7 @@ abstract class BindingDialogFragment<T : ViewDataBinding>(@LayoutRes private val
WindowManager.LayoutParams.MATCH_PARENT,
WindowManager.LayoutParams.WRAP_CONTENT
)
dialog?.window?.setBackgroundDrawableResource(android.R.color.transparent)
dialog?.window?.setBackgroundDrawableResource(R.color.backdrop)
dialog?.setCancelable(false)
dialog?.setCanceledOnTouchOutside(true)
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,8 @@ import android.view.LayoutInflater
import androidx.constraintlayout.widget.ConstraintLayout
import org.sopt.pingle.databinding.BadgePingleBinding
import org.sopt.pingle.presentation.type.CategoryType
import org.sopt.pingle.util.view.colorOf
import org.sopt.pingle.util.view.stringOf

@SuppressLint("CustomViewStyleable")
class PingleBadge @JvmOverloads constructor(
Expand All @@ -23,10 +25,10 @@ class PingleBadge @JvmOverloads constructor(

fun setBadgeCategoryType(categoryType: CategoryType) {
with(binding.tvBadgePingleText) {
text = context.getText(categoryType.categoryNameRes)
setTextColor(context.getColor(categoryType.textColor))
text = stringOf(categoryType.categoryNameRes)
setTextColor(colorOf(categoryType.textColor))
backgroundTintList =
ColorStateList.valueOf(context.getColor(categoryType.backgroundBadgeColor))
ColorStateList.valueOf(colorOf(categoryType.backgroundBadgeColor))
}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,11 @@ import android.annotation.SuppressLint
import android.content.Context
import android.content.res.ColorStateList
import android.util.AttributeSet
import androidx.core.content.ContextCompat
import com.google.android.material.chip.Chip
import org.sopt.pingle.R
import org.sopt.pingle.presentation.type.CategoryType
import org.sopt.pingle.util.view.colorOf
import org.sopt.pingle.util.view.stringOf

@SuppressLint("CustomViewStyleable")
class PingleChip @JvmOverloads constructor(
Expand All @@ -29,8 +30,8 @@ class PingleChip @JvmOverloads constructor(
intArrayOf(-android.R.attr.state_checked)
),
intArrayOf(
ContextCompat.getColor(context, activatedColorRes),
ContextCompat.getColor(context, inactivatedColorRes)
colorOf(activatedColorRes),
colorOf(inactivatedColorRes)
)
)

Expand All @@ -41,7 +42,7 @@ class PingleChip @JvmOverloads constructor(
val inactivatedTextColor = R.color.g_03
val inactivatedChipColor = R.color.g_11

text = context.getText(categoryType.categoryNameRes)
text = stringOf(categoryType.categoryNameRes)
chipStrokeColor = setColorStateList(
context = context,
activatedColorRes = categoryType.activatedOutLinedColor,
Expand Down
11 changes: 11 additions & 0 deletions app/src/main/java/org/sopt/pingle/util/view/ViewExt.kt
Original file line number Diff line number Diff line change
@@ -1,6 +1,11 @@
package org.sopt.pingle.util.view

import android.view.View
import androidx.annotation.ColorRes
import androidx.annotation.DrawableRes
import androidx.annotation.StringRes
import androidx.core.content.ContextCompat
import androidx.core.content.ContextCompat.getString
import androidx.recyclerview.widget.DiffUtil
import com.google.android.material.snackbar.Snackbar

Expand All @@ -25,6 +30,12 @@ fun View.showSnackBar(message: String, isShort: Boolean = true) {
Snackbar.make(this, message, duration).show()
}

fun View.stringOf(@StringRes resId: Int) = getString(context, resId)

fun View.colorOf(@ColorRes resId: Int) = ContextCompat.getColor(context, resId)

fun View.drawableOf(@DrawableRes resId: Int) = ContextCompat.getDrawable(context, resId)

class ItemDiffCallback<T : Any>(
val onItemsTheSame: (T, T) -> Boolean,
val onContentsTheSame: (T, T) -> Boolean
Expand Down
135 changes: 135 additions & 0 deletions app/src/main/res/layout/dialog_map_modal.xml
Original file line number Diff line number Diff line change
@@ -0,0 +1,135 @@
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools">

<data>

</data>

<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">

<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginHorizontal="@dimen/dialog_horizontal_margin"
android:background="@drawable/shape_border_radius_15"
android:backgroundTint="@color/g_10"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">

<androidx.constraintlayout.widget.Guideline
android:id="@+id/gl_start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_begin="@dimen/dialog_map_modal_horizontal_margin" />

<androidx.constraintlayout.widget.Guideline
android:id="@+id/gl_end"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_end="@dimen/dialog_map_modal_horizontal_margin" />

<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/layout_map_modal_pingle_info"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="25dp"
android:background="@drawable/shape_border_radius_15"
android:backgroundTint="@color/g_09"
app:layout_constraintEnd_toEndOf="@id/gl_end"
app:layout_constraintStart_toStartOf="@id/gl_start"
app:layout_constraintTop_toTopOf="parent">

<androidx.constraintlayout.widget.Guideline
android:id="@+id/gl_map_modal_pingle_info_start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_begin="16dp" />

<androidx.constraintlayout.widget.Guideline
android:id="@+id/gl_map_modal_pingle_info_end"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_end="16dp" />

<org.sopt.pingle.util.component.PingleBadge
android:id="@+id/badge_map_modal_pingle_info_category"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/spacing25"
app:layout_constraintEnd_toEndOf="@id/gl_map_modal_pingle_info_end"
app:layout_constraintStart_toStartOf="@id/gl_map_modal_pingle_info_start"
app:layout_constraintTop_toTopOf="parent"
tools:text="STUDY" />

<TextView
android:id="@+id/tv_map_modal_pingle_info_name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:gravity="center"
android:textAppearance="@style/TextAppearance.Pingle.Sub.Semi.18"
app:layout_constraintEnd_toEndOf="@id/gl_map_modal_pingle_info_end"
app:layout_constraintStart_toStartOf="@id/gl_map_modal_pingle_info_start"
app:layout_constraintTop_toBottomOf="@id/badge_map_modal_pingle_info_category"
tools:text="강남 모각작팟"
tools:textColor="@color/pingle_orange" />

<TextView
android:id="@+id/tv_map_modal_pingle_info_owner_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:layout_marginBottom="25dp"
android:textAppearance="@style/TextAppearance.Pingle.Body.Med.14"
android:textColor="@color/g_03"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="@id/gl_map_modal_pingle_info_end"
app:layout_constraintStart_toStartOf="@id/gl_map_modal_pingle_info_start"
app:layout_constraintTop_toBottomOf="@id/tv_map_modal_pingle_info_name"
tools:text="박소현" />

</androidx.constraintlayout.widget.ConstraintLayout>

<TextView
android:id="@+id/tv_map_modal_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="@string/map_modal_description"
android:textAppearance="@style/TextAppearance.Pingle.Body.Med.14"
android:textColor="@color/white"
app:layout_constraintEnd_toStartOf="@id/gl_end"
app:layout_constraintStart_toStartOf="@id/gl_start"
app:layout_constraintTop_toBottomOf="@id/layout_map_modal_pingle_info" />

<com.google.android.material.button.MaterialButton
android:id="@+id/btn_map_modal"
style="@style/Theme.Pingle.Button.M"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginHorizontal="45dp"
android:layout_marginTop="20dp"
android:layout_marginBottom="21dp"
android:backgroundTint="@color/g_01"
android:text="@string/map_participate"
android:textColor="@color/g_10"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@id/gl_end"
app:layout_constraintStart_toStartOf="@id/gl_start"
app:layout_constraintTop_toBottomOf="@id/tv_map_modal_description" />

</androidx.constraintlayout.widget.ConstraintLayout>


</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
10 changes: 7 additions & 3 deletions app/src/main/res/values/dimens.xml
Original file line number Diff line number Diff line change
Expand Up @@ -33,16 +33,20 @@

<!-- bottom navi -->
<dimen name="bottom_navi_height">60dp</dimen>

<!-- button -->
<dimen name="button_l_height">56dp</dimen>
<dimen name="button_m_height">42dp</dimen>
<dimen name="button_s_height">42dp</dimen>
<dimen name="button_corner_radius">10dp</dimen>

<!-- fab -->
<dimen name="fab_size">50dp</dimen>

<!-- chip -->
<dimen name="chip_spacing">4dp</dimen>

<!-- dialog -->
<dimen name="dialog_horizontal_margin">24dp</dimen>
Copy link
Member

Choose a reason for hiding this comment

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

이렇게 나누는게 재사용성이 더 좋을 것 같아요!!!
굳굳굳

<dimen name="dialog_map_modal_horizontal_margin">24dp</dimen>
</resources>
16 changes: 11 additions & 5 deletions app/src/main/res/values/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -19,15 +19,21 @@
<string name="on_boarding_original_group">기존 단체\n입장하기</string>
<string name="on_boarding_new_group">신규 단체\n개설하기</string>

<!-- join group success -->
<string name="join_group_success_btn">입장하기</string>
<string name="join_gorup_success_title">단체 입장\n완료!</string>
<string name="join_group_success_description_group_name">%s에서</string>
<string name="join_group_success_description">핑글 여정을 함께해보세요!</string>

<!-- plan -->
<string name="plan_later_des">나중에 만드시겠어요?</string>
<string name="plan_close"><u>나가기</u></string>
<string name="plan_next">다음으로</string>
<string name="plan_pingle">핑글 개최하기</string>

<!-- join group success -->
<string name="join_group_success_btn">입장하기</string>
<string name="join_gorup_success_title">단체 입장\n완료!</string>
<string name="join_group_success_description_group_name">%s에서</string>
<string name="join_group_success_description">핑글 여정을 함께해보세요!</string>
<!-- map -->
<string name="map_participate">참여하기</string>

<!-- map modal -->
<string name="map_modal_description">이 핑글에 참여할까요?</string>
</resources>
Loading