先看效果图：
package com.miaozij.view_date02;
import android.annotation.SuppressLint;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.util.Log;
import android.util.TypedValue;
import android.widget.TextView;
@SuppressLint("AppCompatCustomView")
public class ColorTrackTextViewextends TextView {
private int mOriginColor = Color.RED;
private int mChangeColor = Color.BLACK;
private PaintmOriginPaint;
private PaintmChangePaint;
private float mCurrentProgress =0.0f;
private int mTextSize =15;
private DirectionmDirection = Direction.LEFT_TO_RIGHT;
//实现不同朝向
public enum Direction{
LEFT_TO_RIGHT,RIGHT_TO_LEFT;
}
public ColorTrackTextView(Context context) {
this(context,null);
}
// 在layout布局中使用 被调用
public ColorTrackTextView(Context context, AttributeSet attrs) {
this(context, attrs,0);
}
//在layout中调用，但是还配置了style属性
public ColorTrackTextView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
//获取自定义属性
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.ColorTrackTextView);
mOriginColor = typedArray.getColor(R.styleable.ColorTrackTextView_changeColor,mOriginColor);
mChangeColor = typedArray.getColor(R.styleable.ColorTrackTextView_originColor,mChangeColor);
//回收
typedArray.recycle();
mOriginPaint = getPaintByColor(mOriginColor);
mChangePaint = getPaintByColor(mChangeColor);
}
private PaintgetPaintByColor(int color){
Paint paint =new Paint();
paint.setColor(color);
paint.setAntiAlias(true);
//防止抖动
paint.setDither(true);
Log.d("字体大小：",mTextSize+"");
paint.setTextSize(sp2px(mTextSize));
return paint;
}
private int sp2px(int mTextSize) {
return (int)TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP,mTextSize,getResources().getDisplayMetrics());
}
@Override
protected void onDraw(Canvas canvas) {
//根据进度把中间值算出来
int middle = (int)(mCurrentProgress * getWidth());
//从左变到右 左边是红色右边是黑色
if(mDirection == Direction.LEFT_TO_RIGHT) {
drawText(canvas, 0, middle, mOriginPaint);
//绘制变色
drawText(canvas, middle, getWidth(), mChangePaint);
}else {//从右向左 右边是红色 左边是黑色
drawText(canvas,0,getWidth(), mOriginPaint);
//绘制变色
drawText(canvas,getWidth()- middle, getWidth(), mChangePaint);
}
// super.onDraw(canvas);
}
private void drawText(Canvas canvas,int left,int right,Paint paint){
canvas.save();
String text = getText().toString();
//获取字体的宽度
Rect changeBounds =new Rect();
paint.getTextBounds(text,0,text.length(),changeBounds);
int dx = getWidth() /2 - changeBounds.width() /2;
Paint.FontMetricsInt fontMetricsInt = paint.getFontMetricsInt();
int dy = (fontMetricsInt.bottom - fontMetricsInt.top)/2 - fontMetricsInt.bottom;
int baseLine = getHeight()/2 + dy;
//绘制变色
//clipRect 栽剪 左边 一个画笔 右边一个画笔
// Log.d("lll",left+",,,"+right);
Rect changeRect =new Rect(left,0,right,getHeight());
canvas.clipRect(changeRect);
canvas.drawText(text,dx,baseLine,paint);
canvas.restore();
}
public void setDirection(Direction direction){
this.mDirection = direction;
}
public void setProgress(float progress){
this.mCurrentProgress = progress;
invalidate();
}
public void setChangeColor(int color){
this.mChangeColor = color;
}
public void setOriginColor(int color){
this.mOriginColor = color;
}
public void setTextSize(int textSize){
this.mTextSize = sp2px(textSize);
mChangePaint.setTextSize(this.mTextSize);
mOriginPaint.setTextSize(this.mTextSize);
invalidate();
}
public void setTextColor(int color){
}
}
package com.miaozij.view_date02;
import android.animation.ObjectAnimator;
import android.animation.ValueAnimator;
import android.graphics.Color;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
import android.widget.TextView;
import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.viewpager.widget.ViewPager;
import java.util.ArrayList;
import java.util.List;
public class ViewPageActivityextends AppCompatActivity {
private ViewPagermViewPager;
private ListfragmentArrayList;
private ListitemList;
private ViewPageContentAdaptermViewPageContentAdapter;
private LinearLayoutmIndicatorContentView;
private ListmIndicatorItemViewList;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_view_page);
mViewPager = findViewById(R.id.view_page);
mIndicatorContentView = findViewById(R.id.ll_top);
initFragmentList();
initIndicator();
}
/**
* 初始化指示器
*/
private void initIndicator() {
mIndicatorItemViewList =new ArrayList<>();
for(int i=0;i
LinearLayout.LayoutParams layoutParams =new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.MATCH_PARENT);
layoutParams.weight =1;
ColorTrackTextView colorTrackTextView =new ColorTrackTextView(this);
colorTrackTextView.setText(itemList.get(i));
colorTrackTextView.setTextSize(20);
if(i==0) {
colorTrackTextView.setOriginColor(Color.RED);
}
colorTrackTextView.setChangeColor(Color.RED);
colorTrackTextView.setLayoutParams(layoutParams);
mIndicatorContentView.addView(colorTrackTextView);
mIndicatorItemViewList.add(colorTrackTextView);
}
}
private void initFragmentList() {
itemList =new ArrayList<>();
fragmentArrayList =new ArrayList<>();
itemList.add("直播");
itemList.add("推荐");
itemList.add("新闻");
itemList.add("热门");
for(int i=0;i
fragmentArrayList.add(ItemFragment.getInstance(itemList.get(i)));
}
mViewPageContentAdapter =new ViewPageContentAdapter(getSupportFragmentManager(), fragmentArrayList);
mViewPager.setAdapter(mViewPageContentAdapter);
mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
Log.d("TAG","position=> "+position+" positionOffset=> "+ positionOffset+" positionOffsetPixels=> "+positionOffsetPixels);
if(position ==mIndicatorItemViewList.size()-1)return;
ColorTrackTextView left =mIndicatorItemViewList.get(position);
left.setDirection(ColorTrackTextView.Direction.LEFT_TO_RIGHT);
left.setProgress(1-positionOffset);
ColorTrackTextView right =mIndicatorItemViewList.get(position +1);
right.setDirection(ColorTrackTextView.Direction.LEFT_TO_RIGHT);
right.setProgress(positionOffset);
}
@Override
public void onPageSelected(int position) {
Log.d("TAG","position=> "+position);
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
}
}
