如何制作SeekBar段,每个段显示不同的颜色?

时间:2016-08-27 07:47:08

标签: java android seekbar android-seekbar

我有一个项目,其中搜索栏分为三个部分(并不总是相等)。根据滑块的进度,每个段将显示不同的颜色。

例如,假设搜索栏的最大值为100,那么......

  • 首次以红色显示时进度为0-10。
  • 当第一段以红色显示时,
  • 10-80的进度,第二段显示为红色 分段显示绿色。
  • 首次以红色显示80-100的进度,第二次显示 段显示绿色,第三段显示为黄色。

有没有办法实现这个目标?

效果图如下:

enter image description here

3 个答案:

答案 0 :(得分:0)

做这样的事

public void setProgressBarColor(ProgressBar progressBar, int newColor){ 
    LayerDrawable ld = (LayerDrawable) progressBar.getProgressDrawable();
    ClipDrawable d1 = (ClipDrawable) ld.findDrawableByLayerId(R.id.progressshape);
    d1.setColorFilter(newColor, PorterDuff.Mode.SRC_IN);

}

希望它适合你

答案 1 :(得分:0)

使用此链接...

https://azzits.wordpress.com/2013/11/17/customseekbar/

完整示例代码 https://github.com/azzits/CustomSeekbar

int progressBarWidth = getWidth();
int progressBarHeight = getHeight();
int thumboffset = getThumbOffset();
int lastProgressX = 0;
int progressItemWidth, progressItemRight;
for (int i = 0; i < mProgressItemsList.size(); i++) {
    ProgressItem progressItem = mProgressItemsList.get(i);
    Paint progressPaint = new Paint();
    progressPaint.setColor(getResources().getColor(progressItem.color));

    progressItemWidth = (int) (progressItem.progressItemPercentage
            * progressBarWidth / 100);

    progressItemRight = lastProgressX + progressItemWidth;

    // for last item give right of the progress item to width of the
    // progress bar
    if (i == mProgressItemsList.size() - 1
            && progressItemRight != progressBarWidth) {
        progressItemRight = progressBarWidth;
    }




    Rect progressRect = new Rect();
    progressRect.set(lastProgressX, thumboffset / 2, progressItemRight,
            progressBarHeight - thumboffset / 2);
    canvas.drawRect(progressRect, progressPaint);
    lastProgressX = progressItemRight;
}
super.onDraw(canvas);
 }

MainActivity.java

public class MainActivity extends Activity implements OnClickListener {

private Button btnSeekTo;
private CustomSeekBar seekbar;
private EditText txtSeekProgress;
private ToggleButton btnToogleSeek;

private float totalSpan = 1500;
private float redSpan = 200;
private float blueSpan = 300;
private float greenSpan = 400;
private float yellowSpan = 150;
private float darkGreySpan;

private ArrayList<ProgressItem> progressItemList;
private ProgressItem mProgressItem;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    seekbar = ((CustomSeekBar) findViewById(R.id.seekBar0));
    btnSeekTo = ((Button) findViewById(R.id.btnSeekTo));
    btnToogleSeek = (ToggleButton) findViewById(R.id.btnToogleSeek);
    txtSeekProgress = (EditText) findViewById(R.id.txtSeekProgress);
    initDataToSeekbar();
    btnSeekTo.setOnClickListener(this);
    btnToogleSeek.setOnClickListener(this);
}

private void initDataToSeekbar() {
    progressItemList = new ArrayList<ProgressItem>();
    // red span
    mProgressItem = new ProgressItem();
    mProgressItem.progressItemPercentage = ((redSpan / totalSpan) * 100);
    Log.i("Mainactivity", mProgressItem.progressItemPercentage + "");
    mProgressItem.color = R.color.red;
    progressItemList.add(mProgressItem);
    // blue span
    mProgressItem = new ProgressItem();
    mProgressItem.progressItemPercentage = (blueSpan / totalSpan) * 100;
    mProgressItem.color = R.color.blue;
    progressItemList.add(mProgressItem);
    // green span
    mProgressItem = new ProgressItem();
    mProgressItem.progressItemPercentage = (greenSpan / totalSpan) * 100;
    mProgressItem.color = R.color.green;
    progressItemList.add(mProgressItem);
    // yellow span
    mProgressItem = new ProgressItem();
    mProgressItem.progressItemPercentage = (yellowSpan / totalSpan) * 100;
    mProgressItem.color = R.color.yellow;
    progressItemList.add(mProgressItem);
    // greyspan
    mProgressItem = new ProgressItem();
    mProgressItem.progressItemPercentage = (darkGreySpan / totalSpan) * 100;
    mProgressItem.color = R.color.grey;
    progressItemList.add(mProgressItem);

    seekbar.initData(progressItemList);
    seekbar.invalidate();
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.main, menu);
    return true;
}

@Override
public void onClick(View v) {
    // TODO Auto-generated method stub
    if (v.getId() == R.id.btnSeekTo) {
        String seekProgress = txtSeekProgress.getText().toString().trim();
        if (seekProgress.length() > 0) {
            seekbar.setProgress(Integer.valueOf(seekProgress));
        }
    } else {
        seekbar.setEnabled(btnToogleSeek.isChecked());
    }
 }

XML

<yourpackagename.CustomSeekBar
    android:id="@+id/customSeekBar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:max="100"
    android:progress="0"
    android:progressDrawable="@android:color/transparent"
    android:thumb="@drawable/seek_thumb_normal"
    android:thumbOffset="12dp" />

enter image description here

答案 2 :(得分:0)

seekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
    @Override
    public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
        setProgressBarColor(seekBar,Your color Code );
    }

    @Override
    public void onStartTrackingTouch(SeekBar seekBar) {

    }

    @Override
    public void onStopTrackingTouch(SeekBar seekBar) {

    }
});