Kotlin officially entered the pit, the future of the custom View no accident will use Kotlin implementation, this demo on Github yo, link to see the end of the article.

This color picker is divided into 3 parts, the outermost white – middle selected color – black, the middle red, green and blue gradient, the center shows the selected color.

The middle red green blue gradient is completed using the 6 bell color gradient:

mSweepGradient = SweepGradient((width / 2).toFloat(), (width / 2).toFloat(), intArrayOf(0xffff0000.toInt(), 0xffffff00.toInt(), 0xff00ff00.toInt(), 0xff00ffff.toInt(), 0xff0000ff.toInt(), 0xffff00ff.toInt(), 0xffff0000.toInt()), floatArrayOf(0f, 1 / 6f, 1 / 3f, 1 / 2f, 2 / 3f, 5 / 6f, 1f))
Copy the code

The difficulty of this control is how to know the color of the finger touch point, originally wanted to calculate, because the red, green and blue gradient is related to the Angle. But after thinking about it, the calculation is too much, so I changed it to the present way.

First, the red, green and blue gradients are drawn on a bitmap, and then the color of the touch points is obtained on the bitmap by touching the coordinates with your finger. The code is bufferCanvas and bitmap. It’s the legendary double cache routine.

Control default width height (width or height smaller shall prevail), and then is to describe the variable, convenient for everyone to use the time to modify.

The way to use it is simple: place it directly in the XML and get the selected color from the code:

Layout file

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <top.greendami.mykotlinapp.PPColorPicker
        android:layout_marginTop="10dp"
        android:layout_centerHorizontal="true"
        android:id="@+id/PPColorPicker21"
        android:layout_width="200dp"
        android:layout_height="200dp" />

    <Button
        android:layout_centerInParent="true"
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="I am the button."/>


</RelativeLayout>
Copy the code

To get the color

class MainActivity  : Activity(){
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        button.setOnClickListener {
            button.setBackgroundColor(PPColorPicker21.chooseColor)
            button.text = "RGB:${PPColorPicker21.rgb}"}}}Copy the code

Finally, to summarize the Kotlin pit, this is my second article using Kotlin custom View, last time using AndroidStudio2.3 plug-in way. This time it was the third version of AS3.0. There is no pit in the environment, it is very smooth. There is only one place where the View I originally inherited implements a constructor with one argument (but my PPColorPicker’s default constructor is the one that implements 2 arguments).

class PPColorPicker(context: Context? , attrs: AttributeSet? = null) : View(context) {}Copy the code

Like this. The problem is that the controls are never found in the Activity, either using FindViewById or ID directly. A null pointer exception has been reported. We can change it to two parameters.

Finally, amway Kotlin, especially with Anko, can greatly improve the development efficiency.

Making star.