Best way to create a segmented progress indicator?

I am creating an Android application and I want to create a progress bar very similar to what is seen at the bottom of MIUI File Explorer

MIUI File Explorer App

As far as I can tell, there is no absolutely obvious solution. So far i can think of

  • Stacking multiple progress bars with a transparent background on top of each other
  • Extend the Progress class to accept multiple values ​​and rewrite the onDraw method

I think the first option will be too slow and inefficient, but the second option may be too complicated, but certainly the best solution.

Is there a better way around this?

+7
source share
4 answers

You must create a custom view for it. Example:

final Paint blue = new Paint(); blue.setColor(Color.BLUE); View progressBar = new View(getActivity()){ protected void onDraw(android.graphics.Canvas canvas) { canvas.drawRect(0,0,getWidth()*progressPecentFirst,getHeight(),blue); blue.setColor(Color.RED); canvas.drawRect(0,0,getWidth()*progressPecentSecond,getHeight(),blue); //Repeat this }; }; parentLayout.addView(progressBar); 
+6
source

One option is not to make it a traditional progress bar. In one of my personal applications, I need a display that looks like a circular progress bar that has segments of different colors.

Maybe I'll start by drawing a filled rectangle from 0 to 14.9 GB in color for music from 939 MB to 14.9 GB in color for video, from 3.52 GB to 14.9 GB in color for images, etc. ..

Then you can simply draw rounded ends in the background color as a mask.

That would be pretty fast, since you only draw graphic primitives and you can expand it as much as you want.

The only weak drawback will be that you have to implement most of the logic yourself, but this is a small price to pay, in my opinion.

+1
source

Here is a segmented progress bar based on @Zelleriation's answer. Progress bar.

  SegmentedProgressBar progressBar = (SegmentedProgressBar) findViewById(R.id.segmentedProgressBar); progressBar.setProgressColor(Color.BLACK); progressBar.publishProgress(0.5f); <com.muneikh.SegmentedProgressBar android:id="@+id/segmentedProgressBar" android:layout_width="match_parent" /> 

https://github.com/muneikh/SegmentedProgressBar

enter image description here

0
source

Dear Please, look at the example demo API SKD 2.2 API assembly in the demo api to view β†’ the progress bar β†’ incremental, after which you will see the solution to the problem.

-one
source

All Articles