[Android studio] 나만의 커스텀뷰 만들기 코틀린 Create CustomView Kotlin

[Android studio] 나만의 커스텀뷰 만들기 코틀린 Create CustomView Kotlin

 

1. res -> values -> atts.xml 생성 후 속성 데이터 작성

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="CustomViewData">
        <attr name="itemTitleText" format="reference|string" />
        <attr name="itemContentText" format="reference|string" />
        <attr name="itemTitleTextColor" format="reference|color" />
        <attr name="itemContentTextColor" format="reference|color" />
    </declare-styleable>
</resources>

 

2. res -> layout -> layout_customview.xml 커스텀뷰 레이아웃 작성

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/title"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/space"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Space
        android:id="@+id/space"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/content"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:gravity="right|center"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/space"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

 

3. CustomView 클래스 작성

open class CustomView(context: Context, attrs: AttributeSet) : ConstraintLayout(context, attrs){

    private var textTitle: TextView
    private var textContent: TextView


    init {
        val v = View.inflate(context, R.layout.layout_customview, this)
        textTitle = v.findViewById(R.id.title)
        textContent = v.findViewById(R.id.content)
        context.theme.obtainStyledAttributes(
            attrs,
            R.styleable.settingItemViewData,
            0, 0).apply {
            try {
                setTitleText(getString(R.styleable.customViewData_itemTitleText))
                setContentText(getString(R.styleable.customViewData_itemContentText))

                val typeArray = context.obtainStyledAttributes(attrs, R.styleable.settingItemViewData)
                setTitleTextColor(typeArray.getColor(R.styleable.customViewData_itemTitleTextColor, 0))
                setContentTextColor(typeArray.getColor(R.styleable.customViewData_itemContentTextColor, 0))
            } finally {
                recycle()
            }
        }
    }


    fun setTitleText(text: String?){
        mLayout_Setingitemview_Textview_Title.text = text
        onRefresh()
    }

    fun setContentText(text: String?){
        mLayout_Setingitemview_Textview_Content.text = text
        onRefresh()
    }

    fun setTitleTextColor(color: Int){
        mLayout_Setingitemview_Textview_Title.setTextColor(color)
        onRefresh()
    }

    fun setContentTextColor(color: Int){
        mLayout_Setingitemview_Textview_Content.setTextColor(color)
        onRefresh()
    }

    private fun onRefresh(){
        invalidate()
        requestLayout()
    }



}

 

4. CustomView 사용하기

<com.example.myapp.CustomView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:itemTitleText="title"
    app:itemContentText="content"
    app:itemTitleTextColor="#00ff00"
    app:itemContentTextColor="#0000ff"/>