ProgressBar trong Android
ProgressBar là một thanh tiến trình thể hiện trạng thái của một hoạt động, tác vụ đang diễn ra đến đâu, bao lâu thì kết thúc. ProgressBar thường có dạng thanh bar nằm ngang, và có thể được custom theo nhiều dạng khác nhau, mình sẽ giới thiệu tới các bạn kỹ hơn ở phần sau.
ProgressBar là lớp con của View, Do đó nó kế thừa tất cả các thuộc tính của View
ProgressBar code:
<ProgressBar android:id="@+id/simpleProgressBar" android:layout_width="wrap_content" android:layout_height="wrap_content" /> Tạo ProgressBar nằm ngang
<ProgressBar android:id="@+id/progressBar1" style="?android:attr/progressBarStyleHorizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_alignParentTop="true"/>
Các phương thức quan trong của ProgressBar
1. getMax() - Trả về giá trị lớn nhất của ProgressBar
Chúng ta có thể lấy giá trị lớn nhất của ProgressBar, phương thức này trả về một số nguyên. Ví dụ lấy giá trị lớn nhất của ProgressBar
ProgressBar simpleProgressBar=(ProgressBar) findViewById(R.id.simpleProgressBar); // initiate the progress bar int maxValue=simpleProgressBar.getMax(); // get maximum value of the progress bar 2. getProgress() – Trả về giá trị tiến trình hiện tại
Chúng ta có thể lấy giá trị tiến trình của ProgressBar, phương thức này trả về một số nguyên. Ví dụ lấy giá trị tiến trình hiện tại của ProgressBar
rogressBar simpleProgressBar=(ProgressBar)findViewById(R.id.simpleProgressBar); // initiate the progress bar int progressValue=simpleProgressBar.getProgress(); // get progress value from the progress bar
Thuộc tính thường dùng của ProgressBar
Bây giờ chúng xem một số thuộc tính hay sử dụng trong ProgressBar trong tập tin XML
1. android:id: Là thuộc tính duy nhất của ProgressBar.
<ProgressBar android:id="@+id/simpleProgressBar" style="?android:attr/progressBarStyleHorizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" /> Dựa vào Id ta sẽ lấy được control theo đúng Id này, xem code bên dưới để biết cách lấy control theo Id:
ProgressBar simpleProgressBar = (ProgressBar) findViewById(R.id.simpleProgressBar); 2. android:max: Thuộc tính dùng để định nghĩa giá trị tối đa mà tiến trình có thể đạt được. Giá trị là số nguyên: 100, 200. Ví dụ thiết lập cho ProgressBar có gia trị tối đa là 100
<ProgressBar android:id="@+id/simpleProgressBar" style="?android:attr/progressBarStyleHorizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" android:max="100" /><!-- Thiết lập giá trị tối đa cho ProgressBar --> Thiết lập thuộc tính android:max trong java class
ProgressBar simpleProgressBar=(ProgressBar) findViewById(R.id.simpleProgressBar); // initiate the progress bar simpleProgressBar.setMax(100); // 100 maximum value for the progress bar 3. android:progress: Thuộc tính này dùng để định nghĩa giá trị mặc định cho tiến trình. Giá trị này trong khoảng từ 0 đến max và phải là số nguyên. Ví dụ sau thiết lập max=100 và progress=50
<ProgressBar android:id="@+id/simpleProgressBar" style="?android:attr/progressBarStyleHorizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" android:max="100" android:progress="50"/><!--// 50 default progress value--> Thiết lập thuộc tính progress trong java class
rogressBar simpleProgressBar=(ProgressBar)findViewById(R.id.simpleProgressBar); // initiate the progress bar simpleProgressBar.setMax(100); // 100 maximum value for the progress value simpleProgressBar.setProgress(50); // 50 default progress value for the progress bar 4. android:progressDrawable: Thuộc tính này thường được sử dụng để tùy chính lại ProgressBar. Trong ví dụ sau chúng ta sẽ tùy chỉnh lại một ProgressBar:
Bước 1: Thêm code vào main_activity.xml hoặc main.xml
<ProgressBar android:id="@+id/simpleProgressBar" style="?android:attr/progressBarStyleHorizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" android:max="100" android:progress="50" android:progressDrawable="@drawable/custom_progress"/><!--custom progress drawable for progress mode--> Bước 2 : Tạo tập tin custom_progress.xml trong thư mục drawable:
<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android" > <item> <shape> <gradient android:endColor="#fff" android:startColor="#1f1" android:useLevel="true" /> </shape> </item> </layer-list> 
5. android:background: Thuộc tính này xác định màu nền cho ProgressBar.
<ProgressBar android:id="@+id/simpleProgressBar" style="?android:attr/progressBarStyleHorizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" android:max="100" android:progress="50" android:background="#f00"/><!--Thiết lập màu nền --> 
6. android:padding: Thuộc tính này xác định khoảng cách từ đường viền của ProgressBar với nội dung nó chứa: left, right, top or bottom. Cũng ví dụ trên bây giờ chúng ta xác định padding=30dp từ mọi phía của ProgressBar.
<ProgressBar android:id="@+id/simpleProgressBar" style="?android:attr/progressBarStyleHorizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" android:max="100" android:progress="50" android:background="#f00" android:padding="30sp"/><!--Thiết lập padding --> 
7. android:indeterminate: Nếu bạn biết giá trị công việc của bạn phải làm thì bạn chỉ cần sử dụng ProgressBar để thể hiện giá trị hiện tại. Còn nếu không biết giá trị chính xác thì bạn có thể sử dụng android:indeterminate=”true” trong XML hoặc progressBar.setIndeterminate(true) trong code. Lúc này ProgressBar sẽ ở chế độ Indeterminate và nó sẽ không hiển thị quá trình làm việc.
<ProgressBar android:id="@+id/simpleProgressBar" style="?android:attr/progressBarStyleHorizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" android:max="100" android:progress="50" android:background="#f00" android:indeterminate="true"/><!--true value for indeterminate--> Thiết lập thuộc tính indeterminate trong java class
ProgressBar simpleProgressBar=(ProgressBar)findViewById(R.id.simpleProgressBar); simpleProgressBar.setIndeterminate(true); 
Như bạn thấy ở đây mình có 2 thuộc tính cần lưu ý là style và android:indeterminate. Như vậy ProgressBar của mình sẽ là thanh nằm ngang và hiển thị quá trình làm việc như hình sau:
Còn nếu bạn thiết lập android:indeterminate=”true” thì ProgressBar sẽ không hiển thị quá trình làm việc, hình như sau:
Còn nếu bạn bỏ thuộc tính style thì sẽ ra hình sau:
Ví dụ: Trong ví dụ này chúng ta sẽ làm ứng dụng gồm có 1 ProgressBar và 1 Button. Mặc định dấu thanh ProgressBar, khi người dùng click vào Button sẽ xuất hiện thanh ProgressBar. Tiến hành tạo project, vào thư mục res /layout -> activity_main.xml thiết kế giao diện sau:
Bước 1: Tạo một project tên là ProgressBar: File->New->Android Application Project điền các thông tin ->Next ->Finish
Bước 2: Mở res -> layout -> xml (hoặc) activity_main.xml và thêm code, chúng ta sẽ tạo các đối tượng ProgressBar và Button trong Relative Layout.
<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="hiepsiit.com.progressbar.MainActivity" > <ProgressBar android:id="@+id/simpleProgressBar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:visibility="invisible" android:layout_centerHorizontal="true"/> <Button android:id="@+id/btnStart" android:layout_width="200dp" android:layout_height="wrap_content" android:text="Start" android:textSize="20sp" android:textStyle="bold" android:layout_centerHorizontal="true" android:layout_marginTop="100dp" android:padding="10dp" android:background="#0f0" android:textColor="#fff"/> </RelativeLayout> Bước 3: Mở app -> src ->MainActivity.java và thêm code.
package hiepsiit.com.progressbar; import android.app.Activity; import android.os.Bundle; import android.view.Menu; import android.view.MenuItem; import android.view.View; import android.widget.Button; import android.widget.ProgressBar; public class MainActivity extends Activity { ProgressBar simpleProgressBar; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); simpleProgressBar =(ProgressBar)findViewById(R.id.simpleProgressBar); Button btnStart = (Button) findViewById(R.id.btnStart); // perform click event on button btnStart.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // visible the progress bar simpleProgressBar.setVisibility(View.VISIBLE); } }); } }
Ứng dụng này được phát triển bởi adt bundle, android 4.2 sử dụng minimum sdk 11 and target sdk 21.
Kết quả khi chạy ứng dụng:
Sau đó click vào button "Start"
Ví dụ sử dụng thanh ngang ProgressBar
Ví dụ: Trong ví dụ này chúng ta sẽ làm ứng dụng 1 Button. Khi người dùng click vào Button sẽ xuất hiện hộp thoại download bằng cách sử dụng ProgressBarDialog. Tiến hành tạo project, vào thư mục res /layout -> activity_main.xml thiết kế giao diện sau:
Cách tính tiến trình download tập tin:
Với ProgressBar các bạn sẽ tiện theo dõi xem quá trình xử lý dữ liệu đã hoàn thành được bao nhiêu phần trăm hay còn bao lâu nữa quá trình xử lý sẽ xong.
Để làm việc với ProgressBar thuật tiện và dễ dàng thì các thử xem qua ví dụ sau nhé:
Giả sử ta có một công việc X với thời gian xử lý của nó là 30s, trong quá trình công việc xử lý ta cần phải tính được xem công việc đã hoàn tất bao nhiêu phần trăm, sau mỗi lần tính ta sẽ lấy giá trị và hiện giá trị đó lên ProgressBar. Để tính giá trị này ta tính theo công thức:
% hoàn thành = (số công việc đã hoàn thành) * 100 / tổng số công việc
Bước 1: Tạo một project tên là ProgressBarDemo: File->New->Android Application Project điền các thông tin ->Next ->Finish
Bước 2: Mở res -> layout -> xml (hoặc) activity_main.xml và thêm code, chúng ta sẽ tạo các đối tượng Button trong Relative Layout.
<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="hiepsiit.com.progressbardemo.MainActivity" > <Button android:id="@+id/btnStart" android:layout_width="200dp" android:layout_height="wrap_content" android:text="Start" android:textSize="20sp" android:textStyle="bold" android:layout_centerHorizontal="true" android:layout_marginTop="100dp" android:padding="10dp" android:background="#0f0" android:textColor="#fff"/> </RelativeLayout> Bước 3: Mở app -> src ->MainActivity.java và thêm code.
package hiepsiit.com.progressbardemo; import android.app.Activity; import android.app.ProgressDialog; import android.os.Bundle; import android.view.Menu; import android.view.MenuItem; import android.view.View; import android.view.View.OnClickListener; import android.widget.Button; public class MainActivity extends Activity { private Button btnStart; ProgressDialog progressBar; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); btnStart = (Button) findViewById(R.id.btnStart); btnStart.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { // TODO Auto-generated method stub // Khởi tạo progressBar với đối là Context progressBar = new ProgressDialog(MainActivity.this); // Cho phép hủy progressBar nếu ấn nút Back progressBar.setCancelable(true); // Đặt tiêu đề cho ProgressBar progressBar.setMessage("Đang xử lý, vui lòng đợi..."); // Đặt giao diện cho ProgressBar progressBar.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL); // Đặt giá trị đầu tiên, đây là giá trị thể hiện mức độ hoàn thành công // việc có thang từ 0 - > 100 // do hiện tại công việc chưa hoàn thành được chút nào nên ta đặt là 0 progressBar.setProgress(0); // Đặt cho giá trị lớn nhất thể hiện mức độ hoàn thành công việc là 100 progressBar.setMax(100); // Hiện ProgressBar progressBar.show(); // Tạo một luồng xử lý công việc. new MyThread().start(); } }); } class MyThread extends Thread{ @Override public void run(){ // xử lý công việc cần hoàn thành for(int i =0; i< 30; i++){ // Tạm dừng 1s, thực tế thì chỗ này là xử lý công việc try { Thread.sleep(1000); } catch (InterruptedException e) { // TODO Auto-generated catch block e.printStackTrace(); } // tính xem công việc đã hoàn thành bao nhiêu phần trăm và đưa lên progressbar progressBar.setProgress((i * 100) / 30); } // đóng brogressbar. progressBar.dismiss(); } } } Code dưới đây là khởi tạo ProgressDialog
// Khởi tạo progressBar với đối là Context progressBar = new ProgressDialog(MainActivity.this); // Cho phép hủy progressBar nếu ấn nút Back progressBar.setCancelable(true); // Đặt tiêu đề cho ProgressBar progressBar.setMessage("Đang xử lý, vui lòng đợi..."); // Đặt giao diện cho ProgressBar progressBar.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL); // Đặt giá trị đầu tiên, đây là giá trị thể hiện mức độ hoàn thành công // việc có thang từ 0 - > 100 // do hiện tại công việc chưa hoàn thành được chút nào nên ta đặt là 0 progressBar.setProgress(0); // Đặt cho giá trị lớn nhất thể hiện mức độ hoàn thành công việc là 100 progressBar.setMax(100); // Hiện ProgressBar progressBar.show(); Code tính tiến trình theo công thức: % hoàn thành = (số công việc đã hoàn thành) * 100 / tổng số công việc
public void run(){ // xử lý công việc cần hoàn thành for(int i =0; i< 30; i++){ // Tạm dừng 1s, thực tế thì chỗ này là xử lý công việc try { Thread.sleep(1000); } catch (InterruptedException e) { // TODO Auto-generated catch block e.printStackTrace(); } // tính xem công việc đã hoàn thành bao nhiêu phần trăm và đưa lên progressbar progressBar.setProgress((i * 100) / 30); } // đóng brogressbar. progressBar.dismiss(); }
Ứng dụng này được phát triển bởi adt bundle, android 4.2 sử dụng minimum sdk 11 and target sdk 21.
Kết quả khi chạy ứng dụng:
Sau đó click vào button "Start"
Cập nhật công nghệ từ Youtube tại link: https://www.youtube.com/channel/UCOxeYcvZPGf-mGLYSl_1LuA/videos
Để tham gia khóa học công nghệ truy cập link: http://thuvien.hocviendaotao.com
Mọi hỗ trợ về công nghệ email: dinhanhtuan68@gmail.com
