Thursday, 22 June 2017

Custom ProgressBar with SecondaryProgress

The former post show how to implement "Custom ProgressBar with progressDrawable" and "ProgressBar with SecondaryProgress". This example show how to Custom ProgressBar with SecondaryProgress.


Create a custom drawable xml res/drawable/myprogressbar.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background">
<shape>
<corners android:radius="5dip" />
<gradient
android:angle="180"
android:centerY="1.0"
android:startColor="#E8E8E8"
android:centerColor="#F0F0F0"
android:endColor="#F8F8F8" />
</shape>
</item>
<item android:id="@android:id/secondaryProgress">
<clip>
<shape>
<corners android:radius="5dip" />
<gradient
android:angle="270"
android:centerY="1.0"
android:startColor="#6000F000"
android:centerColor="#60008080"
android:endColor="#600000F0" />
</shape>
</clip>
</item>
<item android:id="@android:id/progress">
<clip>
<shape>
<corners android:radius="5dip" />
<gradient
android:angle="270"
android:centerY="1.0"
android:startColor="#E000F000"
android:centerColor="#E0008080"
android:endColor="#E00000F0" />
</shape>
</clip>
</item>
</layer-list>

Edit the layout to add android:progressDrawable
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="20dp"
android:orientation="vertical"
tools:context="com.blogspot.android_er.androidprogressbar.MainActivity">

<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:autoLink="web"
android:text="http://android-er.blogspot.com/"
android:textStyle="bold"/>

<Button
android:id="@+id/startprogress"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Start ProgressBar"/>

<ProgressBar
android:id="@+id/progressbar"
style="@android:style/Widget.ProgressBar.Horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:max="10"
android:progress="0"
android:secondaryProgress="0"
android:visibility="gone"/>
<ProgressBar
android:id="@+id/myprogressbar"
style="@android:style/Widget.ProgressBar.Horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:max="10"
android:progress="0"
android:secondaryProgress="0"
android:visibility="gone"
android:progressDrawable="@drawable/myprogressbar"/>

</LinearLayout>



MainActivity.java
package com.blogspot.android_er.androidprogressbar;

import android.os.AsyncTask;
import android.os.Bundle;
import android.os.SystemClock;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.ProgressBar;

public class MainActivity extends AppCompatActivity {

Button btnStartProgress;
ProgressBar progressBar, myProgressBar;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

btnStartProgress = (Button)findViewById(R.id.startprogress);
progressBar = (ProgressBar)findViewById(R.id.progressbar);
myProgressBar = (ProgressBar)findViewById(R.id.myprogressbar);

btnStartProgress.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
btnStartProgress.setEnabled(false);
MyAsyncTask myAsyncTask = new MyAsyncTask();
myAsyncTask.execute();
}
});
}

public class MyAsyncTask extends AsyncTask<Void, Integer, Void> {

@Override
protected void onPreExecute() {
progressBar.setVisibility(View.VISIBLE);
myProgressBar.setVisibility(View.VISIBLE);
progressBar.setProgress(0);
progressBar.setSecondaryProgress(0);
myProgressBar.setProgress(0);
myProgressBar.setSecondaryProgress(0);
}

@Override
protected Void doInBackground(Void... voids) {
for(int i=0; i<10; i++){
for(int j=0; j<10; j++){
publishProgress(i, j);
SystemClock.sleep(100);
}
}
return null;
}

@Override
protected void onProgressUpdate(Integer... values) {
progressBar.setProgress(values[0]);
progressBar.setSecondaryProgress(values[1]);
myProgressBar.setProgress(values[0]);
myProgressBar.setSecondaryProgress(values[1]);
}

@Override
protected void onPostExecute(Void aVoid) {
progressBar.setVisibility(View.GONE);
myProgressBar.setVisibility(View.GONE);
btnStartProgress.setEnabled(true);
}
}
}


~ More examples of ProgressBar

No comments:

Post a Comment