New: color select view

reader/src/main/java/com/kdanmobile/reader/screen/view/ColorOvalView.kt

@@ -0,0 +1,64 @@
+package com.kdanmobile.reader.screen.view
+
+import android.content.Context
+import android.graphics.drawable.GradientDrawable
+import android.graphics.drawable.LayerDrawable
+import android.graphics.drawable.StateListDrawable
+import android.support.constraint.ConstraintLayout
+import android.support.v4.content.ContextCompat
+import android.util.AttributeSet
+import android.view.LayoutInflater
+import com.kdanmobile.reader.R
+import kotlinx.android.synthetic.main.view_color_oval.view.*
+
+class ColorOvalView : ConstraintLayout {
+
+    var color: Int? = null
+        set(value) {
+            field = value
+
+            initColor(value)
+        }
+
+    constructor(context: Context) : super(context) {
+        initView()
+    }
+
+    constructor(context: Context, attrs: AttributeSet) : super(context, attrs) {
+        initAttr(attrs)
+        initView()
+    }
+
+    constructor(context: Context, attrs: AttributeSet, defStyle: Int) : super(context, attrs, defStyle) {
+        initAttr(attrs)
+        initView()
+    }
+
+    private fun initAttr(attributeSet: AttributeSet) {
+        val typedArray = context.theme.obtainStyledAttributes(attributeSet, R.styleable.ColorOvalView, 0, 0)
+        color = typedArray.getColor(R.styleable.ColorOvalView_color, ContextCompat.getColor(context, android.R.color.black))
+    }
+
+    private fun initView() {
+        LayoutInflater.from(context).inflate(R.layout.view_color_oval, this)
+        initColor(color)
+    }
+
+    override fun setSelected(selected: Boolean) {
+        super.setSelected(selected)
+
+        colorOval.isSelected = selected
+        initColor(color)
+    }
+
+    private fun initColor(color: Int?) {
+        colorOval?.apply {
+            val stateListDrawable = background.mutate() as StateListDrawable
+            val layerDrawable = stateListDrawable.current.mutate() as LayerDrawable
+            val gradientDrawable = layerDrawable.findDrawableByLayerId(R.id.ovalColor).mutate() as GradientDrawable
+            color?.let {
+                gradientDrawable.setColor(it)
+            }
+        }
+    }
+}

reader/src/main/java/com/kdanmobile/reader/screen/view/ColorSelectView.kt

@@ -0,0 +1,60 @@
+package com.kdanmobile.reader.screen.view
+
+import android.content.Context
+import android.support.constraint.ConstraintLayout
+import android.util.AttributeSet
+import android.view.LayoutInflater
+import android.view.View
+import com.kdanmobile.reader.R
+import kotlinx.android.synthetic.main.view_color_select.view.*
+
+class ColorSelectView : ConstraintLayout {
+
+    interface OnColorSelectedListener {
+        fun onColorSelected(color: Int?)
+    }
+
+    var onColorSelectedListener: OnColorSelectedListener? = null
+
+    constructor(context: Context) : super(context) {
+        initView()
+    }
+
+    constructor(context: Context, attrs: AttributeSet) : super(context, attrs) {
+        initView()
+    }
+
+    constructor(context: Context, attrs: AttributeSet, defStyle: Int) : super(context, attrs, defStyle) {
+        initView()
+    }
+
+    private fun initView() {
+        LayoutInflater.from(context).inflate(R.layout.view_color_select, this)
+
+        colorSelect_column1.setOnClickListener(this::setColorSelect)
+        colorSelect_column2.setOnClickListener(this::setColorSelect)
+        colorSelect_column3.setOnClickListener(this::setColorSelect)
+        colorSelect_column4.setOnClickListener(this::setColorSelect)
+        colorSelect_column5.setOnClickListener(this::setColorSelect)
+        colorSelect_column6.setOnClickListener(this::setColorSelect)
+        colorSelect_column7.setOnClickListener(this::setColorSelect)
+        colorSelect_column8.setOnClickListener(this::setColorSelect)
+
+        setColorSelect(colorSelect_column1)
+    }
+
+    private fun setColorSelect(view: View) {
+        val colorOvalView = view as ColorOvalView
+
+        colorSelect_column1.isSelected = (colorOvalView == colorSelect_column1)
+        colorSelect_column2.isSelected = (colorOvalView == colorSelect_column2)
+        colorSelect_column3.isSelected = (colorOvalView == colorSelect_column3)
+        colorSelect_column4.isSelected = (colorOvalView == colorSelect_column4)
+        colorSelect_column5.isSelected = (colorOvalView == colorSelect_column5)
+        colorSelect_column6.isSelected = (colorOvalView == colorSelect_column6)
+        colorSelect_column7.isSelected = (colorOvalView == colorSelect_column7)
+        colorSelect_column8.isSelected = (colorOvalView == colorSelect_column8)
+
+        onColorSelectedListener?.onColorSelected(colorOvalView.color)
+    }
+}

reader/src/main/res/drawable/selector_color_oval.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:drawable="@drawable/shape_color_oval_checked" android:state_selected="true" />
+    <item android:drawable="@drawable/shape_color_oval" />
+</selector>

reader/src/main/res/drawable/shape_color_oval.xml

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:id="@+id/ovalBorder">
+        <shape android:shape="oval">
+            <stroke
+                android:width="2dp"
+                android:color="#ffffff" />
+            <padding
+                android:bottom="4dp"
+                android:left="4dp"
+                android:right="4dp"
+                android:top="4dp" />
+            <corners android:radius="16dp" />
+        </shape>
+    </item>
+
+    <item android:id="@+id/ovalColor">
+        <shape android:shape="oval">
+            <solid android:color="#000000" />
+            <corners android:radius="16dp" />
+        </shape>
+    </item>
+</layer-list>

reader/src/main/res/drawable/shape_color_oval_checked.xml

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:id="@+id/ovalBorder">
+        <shape android:shape="oval">
+            <stroke
+                android:width="2dp"
+                android:color="#0077fd" />
+            <padding
+                android:bottom="4dp"
+                android:left="4dp"
+                android:right="4dp"
+                android:top="4dp" />
+            <corners android:radius="16dp" />
+        </shape>
+    </item>
+
+    <item android:id="@+id/ovalColor">
+        <shape android:shape="oval">
+            <solid android:color="#000000" />
+            <corners android:radius="16dp" />
+        </shape>
+    </item>
+</layer-list>

reader/src/main/res/layout/view_color_oval.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<View xmlns:android="http://schemas.android.com/apk/res/android"
+    android:id="@+id/colorOval"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    android:background="@drawable/selector_color_oval" />

reader/src/main/res/layout/view_color_select.xml

@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="utf-8"?>
+<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    android:background="@android:color/white">
+
+    <com.kdanmobile.reader.screen.view.ColorOvalView
+        android:id="@+id/colorSelect_column1"
+        android:layout_width="24dp"
+        android:layout_height="24dp"
+        app:color="#d0021b" />
+
+    <com.kdanmobile.reader.screen.view.ColorOvalView
+        android:id="@+id/colorSelect_column2"
+        android:layout_width="24dp"
+        android:layout_height="24dp"
+        android:layout_marginLeft="12dp"
+        android:layout_marginStart="12dp"
+        app:color="#f5a623"
+        app:layout_constraintLeft_toRightOf="@id/colorSelect_column1" />
+
+    <com.kdanmobile.reader.screen.view.ColorOvalView
+        android:id="@+id/colorSelect_column3"
+        android:layout_width="24dp"
+        android:layout_height="24dp"
+        android:layout_marginLeft="12dp"
+        android:layout_marginStart="12dp"
+        app:color="#f8e71c"
+        app:layout_constraintLeft_toRightOf="@id/colorSelect_column2" />
+
+    <com.kdanmobile.reader.screen.view.ColorOvalView
+        android:id="@+id/colorSelect_column4"
+        android:layout_width="24dp"
+        android:layout_height="24dp"
+        android:layout_marginLeft="12dp"
+        android:layout_marginStart="12dp"
+        app:color="#8b572a"
+        app:layout_constraintLeft_toRightOf="@id/colorSelect_column3" />
+
+    <com.kdanmobile.reader.screen.view.ColorOvalView
+        android:id="@+id/colorSelect_column5"
+        android:layout_width="24dp"
+        android:layout_height="24dp"
+        android:layout_marginLeft="12dp"
+        android:layout_marginStart="12dp"
+        app:color="#7ed321"
+        app:layout_constraintLeft_toRightOf="@id/colorSelect_column4" />
+
+    <com.kdanmobile.reader.screen.view.ColorOvalView
+        android:id="@+id/colorSelect_column6"
+        android:layout_width="24dp"
+        android:layout_height="24dp"
+        android:layout_marginLeft="12dp"
+        android:layout_marginStart="12dp"
+        app:color="#417505"
+        app:layout_constraintLeft_toRightOf="@id/colorSelect_column5" />
+
+    <com.kdanmobile.reader.screen.view.ColorOvalView
+        android:id="@+id/colorSelect_column7"
+        android:layout_width="24dp"
+        android:layout_height="24dp"
+        android:layout_marginLeft="12dp"
+        android:layout_marginStart="12dp"
+        app:color="#4a90e2"
+        app:layout_constraintLeft_toRightOf="@id/colorSelect_column6" />
+
+    <com.kdanmobile.reader.screen.view.ColorOvalView
+        android:id="@+id/colorSelect_column8"
+        android:layout_width="24dp"
+        android:layout_height="24dp"
+        android:layout_marginLeft="12dp"
+        android:layout_marginStart="12dp"
+        app:layout_constraintLeft_toRightOf="@id/colorSelect_column7" />
+</android.support.constraint.ConstraintLayout>

reader/src/main/res/values/attrs.xml

@@ -6,4 +6,8 @@
         <attr name="isChecked" format="boolean" />
     </declare-styleable>
 
+    <declare-styleable name="ColorOvalView">
+        <attr name="color" format="color" />
+    </declare-styleable>
+
 </resources>