[둘리] 뷰 챌린지 미션 1단계 제출합니다.

app/build.gradle.kts

@@ -22,7 +22,7 @@ android {
  isMinifyEnabled = false
  proguardFiles(
  getDefaultProguardFile("proguard-android-optimize.txt"),
- "proguard-rules.pro"
+ "proguard-rules.pro",
  )
  }
  }
@@ -33,6 +33,10 @@ android {
  kotlinOptions {
  jvmTarget = "11"
  }
+
+ buildFeatures {
+ dataBinding = true
+ }
 }
 
 dependencies {
@@ -43,4 +47,5 @@ dependencies {
  testImplementation("junit:junit:4.13.2")
  androidTestImplementation("androidx.test.ext:junit:1.1.5")
  androidTestImplementation("androidx.test.espresso:espresso-core:3.5.1")
+ implementation("androidx.activity:activity-ktx:1.1.0")
 }

app/src/main/java/woowacourse/paint/ColorViewHolder.kt

@@ -0,0 +1,26 @@
+package woowacourse.paint
+
+import android.view.LayoutInflater
+import android.view.ViewGroup
+import androidx.recyclerview.widget.RecyclerView
+import woowacourse.paint.databinding.ItemColorPaletteBinding
+import woowacourse.paint.model.ColorUiModel
+
+class ColorViewHolder(private val binding: ItemColorPaletteBinding, onItemClick: (ColorUiModel) -> Unit) :
+ RecyclerView.ViewHolder(binding.root) {
+ init {
+ binding.onItemClick = onItemClick
+ }
+
+ fun bind(item: ColorUiModel) {
+ binding.colorModel = item
+ }
+
+ companion object {
+ fun create(parent: ViewGroup, onItemClick: (ColorUiModel) -> Unit): ColorViewHolder {
+ val layoutInflater = LayoutInflater.from(parent.context)
+ val binding = ItemColorPaletteBinding.inflate(layoutInflater, parent, false)
+ return ColorViewHolder(binding, onItemClick)
+ }
+ }
+}

app/src/main/java/woowacourse/paint/ColorsAdapter.kt

@@ -0,0 +1,33 @@
+package woowacourse.paint
+
+import android.view.ViewGroup
+import androidx.recyclerview.widget.DiffUtil
+import androidx.recyclerview.widget.ListAdapter
+import woowacourse.paint.model.ColorUiModel
+
+class ColorsAdapter(private val onItemClick: (ColorUiModel) -> Unit) :
+ ListAdapter<ColorUiModel, ColorViewHolder>(
+ diffUtil,
+ ) {
+ override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ColorViewHolder {
+ return ColorViewHolder.create(parent, onItemClick)
+ }
+
+ override fun getItemCount(): Int = currentList.size
+
+ override fun onBindViewHolder(holder: ColorViewHolder, position: Int) {
+ holder.bind(currentList[position])
+ }
+
+ companion object {
+ private val diffUtil = object : DiffUtil.ItemCallback<ColorUiModel>() {
+ override fun areItemsTheSame(oldItem: ColorUiModel, newItem: ColorUiModel): Boolean {
+ return oldItem.color == newItem.color
+ }
+
+ override fun areContentsTheSame(oldItem: ColorUiModel, newItem: ColorUiModel): Boolean {
+ return oldItem == newItem
+ }
+ }
+ }
+}

app/src/main/java/woowacourse/paint/MainActivity.kt

@@ -1,14 +1,83 @@
 package woowacourse.paint
 
 import android.os.Bundle
+import androidx.activity.viewModels
 import androidx.appcompat.app.AppCompatActivity
-
+import com.google.android.material.slider.RangeSlider
+import woowacourse.paint.databinding.ActivityMainBinding
 
 class MainActivity : AppCompatActivity() {
+ private lateinit var binding: ActivityMainBinding
+ private val viewModel by viewModels<MainViewModel>()
+ private val canvasView by lazy { binding.cvCanvas }
+ private val adapter = ColorsAdapter { model ->
+ viewModel.pickColor(model)
+ }
 
  override fun onCreate(savedInstanceState: Bundle?) {
  super.onCreate(savedInstanceState)
- setContentView(R.layout.activity_main)
+ setupBinding()
+ setupViewModel()
+ setupCanvas()
+ setupColors()
+ setupWidthSlider()
+ }
+
+ private fun setupBinding() {
+ binding = ActivityMainBinding.inflate(layoutInflater)
+ binding.lifecycleOwner = this
+ setContentView(binding.root)
+ }
+
+ private fun setupViewModel() {
+ binding.viewModel = viewModel
+ viewModel.width.observe(this) { width ->
+ canvasView.setupWidth(width)
+ }
+ viewModel.selectedColor.observe(this) { color ->
+ canvasView.setupColor(color)
+ viewModel.colors.value?.let { colors ->
+ adapter.submitList(colors)
+ }
+ }
+ }
+
+ private fun setupCanvas() {
+ binding.cvCanvas.initPaint(
+ viewModel.width.value ?: MainViewModel.DEFAULT_WIDTH,
+ viewModel.selectedColor.value ?: MainViewModel.DEFAULT_SELECTED_COLOR,
+ )
+ }
+
+ private fun setupColors() {
+ binding.rvColors.adapter = adapter
+ binding.rvColors.setHasFixedSize(true)
+ binding.rvColors.addItemDecoration(SpaceItemDecoration(getSpace()))
+ }
+
+ private fun getSpace(): Int {
+ val colorWidth = resources.getDimensionPixelSize(R.dimen.color_item_size)
+ val display = this.applicationContext?.resources?.displayMetrics
+ val deviceWidth = display?.widthPixels
+
+ deviceWidth?.let {
+ return (deviceWidth - (colorWidth * 5)) / 4
+ }
+ return 10
+ }
+
+ private fun setupWidthSlider() {
+ binding.rsThicknessChanger.valueFrom = minWidth
+ binding.rsThicknessChanger.valueTo = maxWidth
+ binding.rsThicknessChanger.addOnChangeListener(
+ RangeSlider.OnChangeListener { _, value, _ ->
+ viewModel.pickWidth(value)
+ },
+ )
+ }
 
+ companion object {
+ private const val minWidth = 0f
+ private const val maxWidth = 100f
  }
 }

app/src/main/java/woowacourse/paint/MainViewModel.kt

@@ -0,0 +1,59 @@
+package woowacourse.paint
+
+import androidx.lifecycle.LiveData
+import androidx.lifecycle.MutableLiveData
+import androidx.lifecycle.Transformations
+import androidx.lifecycle.ViewModel
+import woowacourse.paint.canvas.PaletteColor
+import woowacourse.paint.model.ColorUiModel
+
+class MainViewModel : ViewModel() {
+ private val _paintChangingState =
+ MutableLiveData<PaintChangingState>(PaintChangingState.Nothing)
+ val paintChangingState: LiveData<PaintChangingState>
+ get() = _paintChangingState
+
+ private val _colors =
+ MutableLiveData(PaletteColor.getAllColors().map { ColorUiModel(it, it.ordinal == 0) })
+ val colors: LiveData<List<ColorUiModel>>
+ get() = _colors
+
+ val selectedColor: LiveData<PaletteColor>
+ get() = Transformations.map(_colors) { colors ->
+ colors.firstOrNull { it.isPicked }?.color ?: DEFAULT_SELECTED_COLOR
+ }
+
+ private val _width = MutableLiveData(DEFAULT_WIDTH)
+ val width: LiveData<Float>
+ get() = _width
+
+ fun setColorSettingState() {
+ if (_paintChangingState.value == PaintChangingState.ColorChanging) {
+ _paintChangingState.value = PaintChangingState.Nothing
+ return
+ }
+ _paintChangingState.value = PaintChangingState.ColorChanging
+ }
+
+ fun setWidthSettingState() {
+ if (_paintChangingState.value == PaintChangingState.WidthChanging) {
+ _paintChangingState.value = PaintChangingState.Nothing
+ return
+ }
+ _paintChangingState.value = PaintChangingState.WidthChanging
+ }
+
+ fun pickColor(model: ColorUiModel) {
+ val colors = _colors.value ?: return
+ _colors.value = colors.map { it.copy(isPicked = it.color == model.color) }
+ }
+
+ fun pickWidth(selectedWidth: Float) {
+ _width.value = selectedWidth
+ }
+
+ companion object {
+ const val DEFAULT_WIDTH = 0F
+ val DEFAULT_SELECTED_COLOR = PaletteColor.RED
+ }
+}

app/src/main/java/woowacourse/paint/PaintChangingState.kt

@@ -0,0 +1,7 @@
+package woowacourse.paint
+
+sealed class PaintChangingState {
+ object Nothing : PaintChangingState()
+ object ColorChanging : PaintChangingState()
+ object WidthChanging : PaintChangingState()
+}

app/src/main/java/woowacourse/paint/SpaceItemDecoration.kt

@@ -0,0 +1,19 @@
+package woowacourse.paint
+
+import android.graphics.Rect
+import android.view.View
+import androidx.recyclerview.widget.RecyclerView
+
+class SpaceItemDecoration(private val space: Int) : RecyclerView.ItemDecoration() {
+ override fun getItemOffsets(
+ outRect: Rect,
+ view: View,
+ parent: RecyclerView,
+ state: RecyclerView.State,
+ ) {
+ val position = parent.getChildAdapterPosition(view)
+ if (position != 0) {
+ outRect.left = space
+ }
+ }
+}

app/src/main/java/woowacourse/paint/canvas/CanvasView.kt

@@ -0,0 +1,85 @@
+package woowacourse.paint.canvas
+
+import android.content.Context
+import android.graphics.Canvas
+import android.graphics.Paint
+import android.graphics.Path
+import android.util.AttributeSet
+import android.view.MotionEvent
+import android.view.View
+import androidx.annotation.ColorInt
+
+class CanvasView(context: Context, attr: AttributeSet) : View(
+ context,
+ attr,
+) {
+ private var path = Path()
+ private var paint = Paint()
+ private var startPoint: Point = Point(0f, 0f)
+ private val lines = mutableListOf<Line>()
+
+ fun initPaint(width: Float, color: PaletteColor) {
+ paint = getPaint(width, color.colorCode)
+ }
+
+ override fun onDraw(canvas: Canvas) {
+ super.onDraw(canvas)
+ lines.forEach { line ->
+ canvas.drawPath(line.path, line.paint)
+ }
+ canvas.drawPath(path, paint)
+ }
+
+ override fun onTouchEvent(event: MotionEvent): Boolean {
+ val x = event.x
+ val y = event.y
+
+ when (event.action) {
+ MotionEvent.ACTION_DOWN -> drawDot(x, y)
+ MotionEvent.ACTION_MOVE -> drawLine(x, y)
+ else -> super.onTouchEvent(event)
+ }
+ return true
+ }
+
+ private fun drawDot(x: Float, y: Float) {
+ startPoint = Point(x, y)
+ path.moveTo(startPoint.x, startPoint.y)
+ path.lineTo(x, y)
+ invalidate()
+ }
+
+ private fun drawLine(x: Float, y: Float) {
+ path.moveTo(startPoint.x, startPoint.y)
+ path.lineTo(x, y)
+ startPoint = Point(x, y)
+ invalidate()
+ }
+
+ fun setupWidth(width: Float) {
+ addLine()
+ paint = getPaint(width, paint.color)
+ }
+
+ fun setupColor(color: PaletteColor) {
+ addLine()
+ paint = getPaint(paint.strokeWidth, color.colorCode)
+ }
+
+ private fun addLine() {
+ if (path.isEmpty) return
+ lines.add(Line(path, paint))
+ path = Path()
+ }
+
+ private fun getPaint(width: Float, @ColorInt selectedColor: Int): Paint {
+ return Paint().apply {
+ isAntiAlias = true
+ style = Paint.Style.STROKE
+ strokeJoin = Paint.Join.ROUND
+ color = selectedColor
+ strokeWidth = width
+ strokeCap = Paint.Cap.ROUND
+ }
+ }
+}

app/src/main/java/woowacourse/paint/canvas/Line.kt

@@ -0,0 +1,6 @@
+package woowacourse.paint.canvas
+
+import android.graphics.Paint
+import android.graphics.Path
+
+class Line(val path: Path, val paint: Paint)

app/src/main/java/woowacourse/paint/canvas/PaletteColor.kt

@@ -0,0 +1,11 @@
+package woowacourse.paint.canvas
+
+import android.graphics.Color
+
+enum class PaletteColor(val colorCode: Int) {
+ RED(Color.RED), ORANGE(Color.parseColor("#FF9802")), YELLOW(Color.YELLOW), GREEN(Color.GREEN), BLUE(Color.BLUE);
+
+ companion object {
+ fun getAllColors(): List<PaletteColor> = PaletteColor.values().toList()
+ }
+}

app/src/main/java/woowacourse/paint/canvas/Point.kt

@@ -0,0 +1,3 @@
+package woowacourse.paint.canvas
+
+data class Point(val x: Float, val y: Float)

app/src/main/java/woowacourse/paint/model/ColorUiModel.kt

@@ -0,0 +1,5 @@
+package woowacourse.paint.model
+
+import woowacourse.paint.canvas.PaletteColor
+
+data class ColorUiModel(val color: PaletteColor, val isPicked: Boolean = false)

app/src/main/res/drawable/ic_check_24.xml

@@ -0,0 +1,5 @@
+<vector android:height="24dp" android:tint="#C67101"
+ android:viewportHeight="24" android:viewportWidth="24"
+ android:width="24dp" xmlns:android="http:https://schemas.android.com/apk/res/android">
+ <path android:fillColor="@android:color/white" android:pathData="M9,16.17L4.83,12l-1.42,1.41L9,19 21,7l-1.41,-1.41z"/>
+</vector>