1、在res/values目录下创建attrs.xml,如下:

  • declare-styleable 的 name 属性值表示新视图的名字
  • attr 这个节点表示新增的属性
  • attr 的 name 表示新属性的名称
  • attr 的 format 表示新属性的格式(数据类型)
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="CustomPagerTab">
        <attr name="textColor" format="color" />
        <attr name="textSize" format="dimension" />
        <attr name="customBackground" format="reference" />
        <attr name="customOrientation">
            <enum name="horizontal" value="0" />
            <enum name="vertical" value="1" />
        </attr>
        <attr name="customGravity">
            <enum name="center" value="0" />
            <enum name="left" value="1" />
            <enum name="top" value="2" />
            <enum name="right" value="3" />
            <enum name="bottom" value="4" />
        </attr>
    </declare-styleable>
</resources>

2、再代码的widget 目录中创建CustomPagerTab.java文件,如下:

  • 注意这里的新增属性,获取到值后,必须在 onDraw 方法中设置,否则不生效
package com.example.custom.widget;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.util.AttributeSet;
import android.util.Log;
import android.util.TypedValue;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.viewpager.widget.PagerTabStrip;

import com.example.custom.R;
import com.example.custom.util.Utils;

/**
 * 自定义PagerTabStrip
 * createTime: 2023.3.14
 */
public class CustomPagerTab extends PagerTabStrip {
    private static final String TAG = "CustomPagerTab";
    private int textColor = Color.BLACK;
    private int textSize = 15;
    private int customBackground;
    private int customGravity;

    public CustomPagerTab(@NonNull Context context) {
        super(context);
    }

    public CustomPagerTab(@NonNull Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        if (attrs != null) {
            TypedArray attrArr = getContext().obtainStyledAttributes(attrs, R.styleable.CustomPagerTab);
            textColor = attrArr.getColor(R.styleable.CustomPagerTab_textColor, textColor);
            textSize = Utils.px2sp(context, attrArr.getDimension(R.styleable.CustomPagerTab_textSize, textSize));
            customBackground = attrArr.getResourceId(R.styleable.CustomPagerTab_customBackground, 0);
            int customOrientation = attrArr.getInt(R.styleable.CustomPagerTab_customOrientation, 0);
            customGravity = attrArr.getInt(R.styleable.CustomPagerTab_customGravity, 0);
            Log.d(TAG, "textColor=" + textColor + " textSize=" + textSize);
            Log.d(TAG, "customBackground=" + customBackground + " customOrientation=" + customOrientation + " customGravity=" +customGravity);
            attrArr.recycle(); // 回收属性数组描述
        }
    }

    @Override
    protected void onDraw(Canvas canvas) { // 绘制函数
        setTextColor(textColor);
        setTextSize(TypedValue.COMPLEX_UNIT_SP, textSize);
        setBackgroundResource(customBackground);
        setGravity(customGravity);
        super.onDraw(canvas);
    }
}

3、新建一个activity,命名为:CustomPropertyActivity,如下:

public class CustomPropertyActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener {
    private ArrayList<GoodsInfo> goodsList;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_custom_property);
        goodsList = GoodsInfo.getDefaultList();
        ImagePagerAdapter adapter = new ImagePagerAdapter(this, goodsList);
        ViewPager vp_content = findViewById(R.id.vp_content);
        vp_content.setAdapter(adapter);
        vp_content.setCurrentItem(0);
        vp_content.addOnPageChangeListener(this);
    }

    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

    }

    @Override
    public void onPageSelected(int position) {
        ToastUtil.showToast(this, "您翻到的手机品牌是:" + goodsList.get(position).name);
    }

    @Override
    public void onPageScrollStateChanged(int state) {

    }
}

4、再CustomPropertyActivity的布局文件activity_custom_property中,添加自定义的CustomPagerTab节点,如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:padding="10dp"
    android:orientation="vertical">

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/vp_content"
        android:layout_width="match_parent"
        android:layout_height="400dp">

        <com.example.custom.widget.CustomPagerTab
            android:id="@+id/pts_tab"
            android:layout_width="wrap_content"
            android:layout_height="40dp"
            app:customBackground="@color/red"
            app:customOrientation="vertical"
            app:customGravity="top"
            app:textSize="20sp"
            app:textColor="@color/black" />
    </androidx.viewpager.widget.ViewPager>

</LinearLayout>

5、用到的模型为GoodsInfo,如下:

GoodsInfo模型