Kotlin 自定义 View

最新推荐文章于 2025-03-27 17:43:06 发布

原创最新推荐文章于 2025-03-27 17:43:06 发布 · 2k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#kotlin

本文介绍如何通过XML声明自定义属性来实现ViewPagerTab的样式定制，包括文本颜色和大小的设置，并展示了如何在布局文件中应用这些自定义属性。

自定义属性

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="CustomPagerTab">
        <attr name="textColor" format="color"/>
        <attr name="textSize" format="dimension"/>
    </declare-styleable>
</resources>

创建自定义View，并解析属性

自定义视图要在类名后面增加 @JvmOverloads constructor 因为布局文件中的自定义视图必须兼容Java

class CustomPagerTab 
    @JvmOverloads constructor(context: Context, attributeSet: AttributeSet? = null,defStyleAttr: Int = 0) :
    PagerTabStrip(context,attributeSet) {

        private var textColor = Color.Black
        private var textSize = 15
        init {
           
            if (attributeSet!=null){
                // 解析自定义属性
                val typedArray:TypedArray = context.obtainStyledAttributes(attributeSet, R.styleable.CustomPagerTab)
                textColor =  typedArray.getColor(R.styleable.CustomPagerTab_textColor,textColor)
                textSize = typedArray.getDimensionPixelSize(R.styleable.CustomPagerTab_textSize,textSize)
                typedArray.recycle()
            }

            // 设置属性
            setTextColor(textColor)
            setTextSize(TypedValue.COMPLEX_UNIT_SP,textSize)
        }
}

布局中应用自定义属性

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <androidx.viewpager2.widget.ViewPager2
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <com.cniao5.common.widget.CustomPagerTab
            app:textColor="@color/colorPrimary"
            app:textSize="16sp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>
    </androidx.viewpager2.widget.ViewPager2>
</LinearLayout>