Android Custom View Component

attrs.xml

<?xml version="1.0" encoding="utf-8"?>

<resources xmlns:tools="http://schemas.android.com/tools">
    <declare-styleable name="DogchowBenefitView">
        <attr name="benefitImage" format="reference" />
        <attr name="benefitTitle" format="string" />
        <attr name="benefitContent" format="string" />
    </declare-styleable>
  
</resources>

DogchowBenefitView.kt

package com.octopepper.yummypets.component.dogchow

import android.content.Context
import android.util.AttributeSet
import android.view.View
import android.widget.LinearLayout
import com.octopepper.yummypets.R
import kotlinx.android.synthetic.main.dogchow_benefit.view.*

class DogchowBenefitView(context: Context, attrs: AttributeSet) : LinearLayout(context, attrs) {

    init {
        View.inflate(context, R.layout.dogchow_benefit, this)
        val typedArray = context.obtainStyledAttributes(attrs, R.styleable.DogchowBenefitView, 0, 0)
        typedArray.getDrawable(R.styleable.DogchowBenefitView_benefitImage)?.let { image.background = it }
        title.text = typedArray.getString(R.styleable.DogchowBenefitView_benefitTitle)
        content.text  = typedArray.getString(R.styleable.DogchowBenefitView_benefitContent)
        typedArray.recycle()
    }
}

DogchowBenefitView.xml

<LinearLayout 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="wrap_content"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="32dp"
    android:orientation="horizontal">

    <ImageView
        android:id="@+id/image"
        android:layout_width="87dp"
        android:layout_height="87dp"
        android:layout_marginLeft="3dp"
        android:layout_marginStart="3dp" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="18dp"
        android:layout_marginStart="18dp"
        android:orientation="vertical">

        <com.octopepper.yummypets.common.ui.component.CustomTextView
            android:id="@+id/title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textColor="@color/dogchow_benefits_blue"
            android:textSize="18.5sp"
            app:customFont="Roboto-Bold" />

        <com.octopepper.yummypets.common.ui.component.CustomTextView
            android:id="@+id/content"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:textSize="15sp"
            app:customFont="Roboto-Regular" />

    </LinearLayout>

</LinearLayout>

usage.xml

<com.octopepper.yummypets.component.dogchow.DogchowBenefitView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:benefitContent="@string/purina_dogchow_benefit_7_desc"
    app:benefitImage="@drawable/purina_bene_7"
    app:benefitTitle="@string/purina_dogchow_benefit_7_title" />