Почему не отображается мой класс пользовательских кнопок?

Question

Я новичок в разработке Android. Я хотел создать пользовательскую кнопку ImageButton, которая переключает цвета при касании ее для моего проекта. Я хотел бы сделать это правильно и чтобы сама кнопка отслеживала свое собственное состояние, поэтому я расширил класс и сделал ToggleImageButton ниже.

package com.ktpackages.elements.buttons

import android.annotation.TargetApi
import android.content.Context
import android.graphics.Color
import android.util.AttributeSet
import android.view.LayoutInflater
import android.view.ViewGroup
import android.widget.ImageButton
import com.google.android.libraries.places.internal.it
import com.ktpackages.tacosolo.R

class ToggleImageButton : ImageButton {
    private var toggle_state = true

    @JvmOverloads
    constructor(context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0) :
            super(context, null, defStyleAttr)
    {
        // Add onColor and offColor to attrs.
        setAttrs(attrs)
    }

    @TargetApi(21)
    constructor(context: Context, attrs: AttributeSet, defStyleAttr: Int, defStyleRes: Int) :
            super(context, attrs, defStyleAttr, defStyleRes) {
        setAttrs(attrs)
    }

    private fun setAttrs(attrs: AttributeSet?) {
        attrs?.let {
            val a = context.obtainStyledAttributes(
                it,
                R.styleable.custom_component_attributes, 0, 0
            )
            var offColor = resources.getText(
                a.getResourceId(
                    R.styleable
                        .custom_component_attributes_toggle_color_off,
                    R.color.design_default_color_primary
                )
            )
            var onColor = resources.getText(
                a.getResourceId(
                    R.styleable
                        .custom_component_attributes_toggle_color_off,
                    R.color.design_default_color_primary_dark
                )
            )

            a.recycle()
        }
    }

    var toggled: Boolean
        get() {
            return toggle_state
        }
        set(value) {
            if (toggle_state != value as Boolean) {
                toggle()
            }
        }

    fun toggle() {
        toggle_state = !toggle_state
        if (toggle_state) {
            setBackgroundColor(R.attr.toggle_color_on)
        } else {
            setBackgroundColor(R.attr.toggle_color_off)
        }
    }

    init {
        LayoutInflater.from(context)
            .inflate(R.layout.toggle_image_button, null, true)
    }
}

Я прошел несколько уроков, чтобы продвинуться так далеко, но я немного растерялся. Из того, что я понимаю, кнопка должна быть раздута, чтобы правильно отображать в редакторе Android Studio. Поэтому я добавил этот код, используя null для ViewGroup, в init. Тем не менее, я получаю исключение NullPointerException при попытке получить доступ к кнопке и приложение падает перед загрузкой представления. Этого не произошло, когда у меня просто была кнопка ImageButton.

Значения / attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="custom_component_attributes">
        <attr name="toggle_color_on" format="color" />
        <attr name="toggle_color_off" format="color" />
    </declare-styleable>
</resources>

1008 * * макет / toggle_image_button.xml

<?xml version="1.0" encoding="utf-8"?>
<ImageButton
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        xmlns:android="http://schemas.android.com/apk/res/android"/>

Код, который вылетает:

    driveThruToggle.setOnClickListener {
        togglePins(driveThruToggle)
    }

    foodTruckToggle.setOnClickListener {
        togglePins(foodTruckToggle)
    }

    sitDownToggle.setOnClickListener {
        togglePins(sitDownToggle)
    }

layout.xml

<TableRow
            android:layout_width="match_parent"
            android:layout_height="67dp" android:layout_marginBottom="0dp"
            android:layout_alignBottom="@+id/map" android:orientation="horizontal"
            android:gravity="center|center_vertical"
            android:background="@android:color/transparent"
            android:weightSum="3">
        <com.ktpackages.elements.buttons.ToggleImageButton
                android:layout_width="115dp"
                android:layout_height="wrap_content" app:srcCompat="@drawable/ic_car_128"
                app:toggle_color_off="@color/colorLightText"
                app:toggle_color_on="@color/colorBackground"
                android:id="@+id/driveThruToggle"
                android:background="@color/colorLightText" android:scaleType="fitCenter" android:layout_weight="1"/>
        <com.ktpackages.elements.buttons.ToggleImageButton
                android:layout_width="115dp"
                android:layout_height="wrap_content" app:srcCompat="@drawable/ic_chairs_128"
                app:toggle_color_off="@color/colorLightText"
                app:toggle_color_on="@color/colorBackground"
                android:id="@+id/sitDownToggle"
                android:background="@color/colorLightText" android:scaleType="fitCenter" android:layout_weight="1"/>
        <com.ktpackages.elements.buttons.ToggleImageButton
                android:layout_width="115dp"
                android:layout_height="wrap_content"
                app:srcCompat="@drawable/ic_food_truck_128"
                app:toggle_color_off="@color/colorLightText"
                app:toggle_color_on="@color/colorBackground"
                android:id="@+id/foodTruckToggle"
                android:background="@color/colorLightText"
                android:scaleType="fitCenter"
                android:layout_weight="1"/>

    </TableRow>

Я понимаю, что кнопки переключения уже существуют, но я хотел бы узнать, как это сделать.