android动态指示箭头,android – 自定义选项卡指示器(箭头像指示器)

我可以找到唯一的解决方案是获取原始TabLayout的源代码,并根据您的需要进行自定义.

事实上,你需要做的只是为了覆盖SlidingTabStrip的void draw(Canvas canvas)方法.不幸的是,SlidingTabStrip是TabLayout中的私有内部类.

幸运的是,所有的支持库代码是开放的,所以我们可以创建我们自己的TabLayoutWithArrow类.我用这个代替了标准的void draw(Canvas canvas)来绘制箭头：

@Override

public void draw(Canvas canvas) {

super.draw(canvas);

// i used 3dp

int arrowSize = getResources().getDimensionPixelSize(R.dimen.pointing_arrow_size);

if (mIndicatorLeft >= 0 && mIndicatorRight > mIndicatorLeft) {

canvas.drawRect(mIndicatorLeft, getHeight() - mSelectedIndicatorHeight - arrowSize,

mIndicatorRight, getHeight() - arrowSize, mSelectedIndicatorPaint);

canvas.drawPath(getTrianglePath(arrowSize), mSelectedIndicatorPaint);

}

}

private Path getTrianglePath(int arrowSize) {

mSelectedIndicatorPaint.setStyle(Paint.Style.FILL_AND_STROKE);

mSelectedIndicatorPaint.setAntiAlias(true);

int leftPointX = mIndicatorLeft + (mIndicatorRight - mIndicatorLeft) / 2 - arrowSize*2;

int rightPointX = leftPointX + arrowSize*2;

int bottomPointX = leftPointX + arrowSize;

int leftPointY = getHeight() - arrowSize;

int bottomPointY = getHeight();

Point left = new Point(leftPointX, leftPointY);

Point right = new Point(rightPointX, leftPointY);

Point bottom = new Point(bottomPointX, bottomPointY);

Path path = new Path();

path.setFillType(Path.FillType.EVEN_ODD);

path.setLastPoint(left.x, left.y);

path.lineTo(right.x, right.y);

path.lineTo(bottom.x, bottom.y);

path.lineTo(left.x, left.y);

path.close();

return path;

}

当然,背景,指标的特殊设计可以根据您的需要进行改进/调整.

为了使我的自定义TabLayoutWithArrow,我不得不将这些文件复制到我的项目中：

> AnimationUtils

> TabLayout

> ThemeUtils

> ValueAnimatorCompat

> ValueAnimatorCompatImplEclairMr1

> ValueAnimatorCompatImplHoneycombMr1

> ViewUtils

> ViewUtilsLollipop

要在箭头后面有透明度,您只需要将此Shape-drawable设置为TabLayoutWithArrow的背景：

android:gravity="bottom">

实际使用情况是：

android:id="@+id/tabLayout"

android:background="@drawable/tab_layout_background"

android:layout_width="match_parent"

android:layout_height="wrap_content"/>

我已将整个项目(TabLayoutWithArrow一页应用程序正在使用它)上传到我的保管箱 – feel free to check it out.

我希望它有帮助