Showing posts with label Lập Trình Android. Show all posts
Showing posts with label Lập Trình Android. Show all posts

Monday, September 29, 2014

Bài tập 8: Các kiểu lập trình sự kiện trong Android

Bài tập này Tôi sẽ trình bày 6 kiểu lập trình sự kiện trong Android. Tôi sẽ sử dụng một số Control căn bản để Demo, đặc biệt là Button dùng để tạo sự kiện.
  1. Onclick in XML
  2. Inline anonymous listener
  3. Activity is listener
  4. Listener in variable
  5. Explicit listener class
  6. View Subclassing
- Tôi sẽ lần lượt đưa ra 6 ví dụ khác nhau cho 6 kiểu lập trình sự kiện ở trên, các bạn hãy cố gắng theo dõi, nó rất quan trọng để làm các bài tập tiếp theo.
1. Onclick in XML:
- Ví dụ 1: Đơn giản chỉ là cộng 2 số, bạn thiết kế giao diện như bên dưới:
8_event_0- Khi nhấn vào nút “Tổng 2 số”, chương trình sẽ xuất kết quả như hình bên trên : 80+33= 113
- Bạn xem Layout Outline để dễ thiết kế (chú ý là bạn có thể bỏ LinearLayout1 đi):
8_event_1
- Chú ý là ta sử dụng Onclick in XML:
8_event_2- Trong đoạn lệnh ở trên thì ta sử dụng android:conClick=”btn_tong2so”, tức là ta đã gán một sự kiện click cho Button này, sự kiện này tên là btn_tong2so. Ta cần khai báo một hàmbtn_tong2so ở trong Activity class như hình bên dưới:
8_event_3- Khi chạy ứng dụng bạn sẽ được kết quả như bên dưới:
8_event_4
2. Inline anonymous listener
- Ví dụ viết chương trình chuyển đổi năm dương lịch qua năm âm lịch như hình bên dưới:
8_event_5- Khi người sử dụng nhập vào EditText giá trị là 1 năm Dương Lịch bất kỳ nào đó rồi nhấn nút “Chuyển đổi”, chương trình sẽ chuyển năm dương lịch thành năm âm lịch. Trong ví dụ trên nếu người sử dụng nhập 2013 thì sẽ ra năm âm lịch là “Quý Tỵ”.
- Chú ý là ta tạo một anonymous listener, trước tiên bạn hãy xem Outline XML để cho dễ bề thiết kế:
8_event_6- Để chuyển từ năm dương lịch sang năm âm lịch bạn cần biết một số thông tin sau:
8_event_7
- Bây giờ ta tiến hành gán sự kiện cho nút “Chuyển đổi” (ở đây id Tôi để là button1), mở Activity class lên vào sửa lệnh như bên dưới:
8_event_8-  Bạn tự đưa lệnh vào Bước 1, Bước 2, bước 3 ở trên. Cách lấy dữ liệu nhập vào từ EditText đã hướng dẫn ở phần Onclick in XML, làm theo cái này để lấy được giá trị là năm dương lịch ra, sau đó lấy năm này xử lý theo bảng Can và Chi như hướng dẫn thì Ta sẽ ra được năm Âm lịch tương ứng.
3. Activity is listener:
- Trong cách viết sự kiện này thì Activity sẽ implements interface có kiểu sự kiện (rất nhiều loại interface). Ở đây Tôi chỉ ví dụ trường hợp cho Button các trường hợp khác các bạn tự tìm hiểu và suy luận ra.
- Tôi sẽ có một bài ví dụ nhỏ sau: Hãy xây dựng ứng dụng tính Chỉ số khối cơ thể -chữ viết tắt BMI (Body Mass Index )- được dùng để đánh giá mức độ gầy hay béo của một người. Chỉ số này có thể giúp xác định một người bị bệnh béo phì hay bị bệnh suy dinh dưỡng.
+Cách tính như sau:
Gọi W là khối lượng của một người (tính bằng kg) và H là chiều cao của người đó (tính bằng m), chỉ số khối cơ thể được tính theo công thức:
8_event_9Phân loại để đánh giá như sau:
  • BMI < 18: người gầy
  • BMI = 18 – 24,9: người bình thường
  • BMI = 25 – 29,9: người béo phì độ I
  • BMI = 30 – 34,9: người béo phì độ II
  • BMI > 35: người béo phì độ III
Tôi sẽ thiết kế giao diện như hình bên dưới và cung cấp Outline, các bạn hãy thiết kế lại để nâng cao kinh nghiệm:
8_event_10-Bạn thấy đó: Thông số bên trên chính là của chính Tôi, Tên Tôi là Thanh, chiều cao 1.68 mét, cân nặng 58 kg. Khi Tôi chọn “Tính BMI” thì chương trình sẽ tính ra được BMI của Tôi là 20.5 và chẩn đoán là “Bình thường”, tức là Tôi có sức khỏe tốt, dáng người chuẩn (có thể là niềm ước ao của một số các bạn trong lớp).
- Để các bạn đỡ căng thẳng thì Tôi xin nói lý do vì sao Tôi lại viết phần mềm này làm ví dụ minh họa. Bởi vì bạn gái của Tôi luôn luôn chê Tôi gầy (hay gọi là Xí Quách gì đó). Tôi đã chứng mình là Tôi có dáng người chuẩn không cần chỉnh bằng cách viết phần mềm này (công thức theo chuẩn Quốc Tế nên nó là một bằng chứng không thể chối cãi). Tôi nghĩ các bạn cũng có thể dùng nó để chứng minh rằng mình không bị Béo Phì Cấp độ 3.
- Quay trở lại ví dụ ,Bạn xem Outline của giao diện này dưới đây (Tôi cố tình không cung cấp source XML nhằm mục đích kích thích các bạn tự tìm tòi):
8_event_11
- Đây là nội dung Coding trong Activity:
import java.text.DecimalFormat;
import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.EditText;
public class MainActivity extends Activity
implements OnClickListener{
Button btnChandoan;
EditText editTen,editChieucao,
editCannang,editBMI,editChandoan;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
btnChandoan=(Button) findViewById(R.id.btntinhBMI);
btnChandoan.setOnClickListener(this);
editTen=(EditText) findViewById(R.id.editten);
editChieucao=(EditText) findViewById(R.id.editchieucao);
editCannang=(EditText) findViewById(R.id.editcannang);
editBMI=(EditText) findViewById(R.id.editBMI);
editChandoan=(EditText) findViewById(R.id.editChanDoan);
}
@Override
public void onClick(View arg0) {
double H=Double.parseDouble(editChieucao.getText()+””);
double W=Double.parseDouble(editCannang.getText()+””);
double BMI=W/Math.pow(H, 2);
String chandoan=””;
if(BMI<18)
{
chandoan=”Bạn gầy”;
}
else if(BMI<=24.9)
{
chandoan=”Bạn bình thường”;
}
else if(BMI<=29.9)
{
chandoan=”Bạn béo phì độ 1″;
}
else if(BMI<=34.9)
{
chandoan=”Bạn béo phì độ 2″;
}
else
{
chandoan=”Bạn béo phì độ 3″;
}
DecimalFormat dcf=new DecimalFormat(“#.0″);
editBMI.setText(dcf.format(BMI));
editChandoan.setText(chandoan);
}
}
- a) Bạn quan sát Activity này sẽ implements interface OnClickListener
- b) Bản thân interface OnClickListener có mộ Abstract Method là onClick(View arg0) nên ta phải Override nó.
- c) Để Button có thể hiểu được sự kiện thì Ta phải gọi dòng lệnh: btnChandoan.setOnClickListener(this); bản thân Activity là một sự kiện nên ta dùng thisđể truyền vào hàm.
- d) Bạn quan sát thêm Tôi có sử dụng : DecimalFormat dcf=new DecimalFormat(“#.0“); Mục đích là Tôi định dạng 1 số lẻ thập phân, bạn muốn 2 số lẻ thập phần thì ghi “#.00″ hay muốn 3 thì “#.000″ …vân vân.
Bạn có thể load đầy đủ coding mẫu ở đây: http://www.mediafire.com/?71khpisxa3wmvq5
4) Listener in variable:
- Tương tự như Activity Is listener, nhưng  khác ở chỗ thay vì implement interface cho Activity thì nó lại được lưu trữ vào một biến có kiểu Listener trong activity. Làm cách này thì ta có thể chia sẻ chung một biến sự kiện cho các control khác nhau.
- Ví dụ bạn xem hình bên dưới:
8_event_12- Bạn thấy đó, ở trên khai báo 1 biến có kiểu listener là interface OnClickListener.
- Và biến này sẽ được chia sẻ cho 2 Button Login và Cancel.
- Bây giờ Tôi sẽ cung cấp ví dụ Chuyển đổi độ F qua C và ngược lại. Bạn xem giao diện bên dưới:
8_event_13- Giao diện bên trên sẽ có 3 button. Ta sẽ tạo một biến sự kiện và chia sẻ cho 3 Button ở trên.
- Bạn xem Outline để thiết kế:
8_event_14- Đây là công thức chuyển đổi:
8_event_15-Bạn xem coding Activity:
import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.EditText;
public class MainActivity extends Activity {
private Button btnFar,btnCel,btnClear;
private EditText txtFar,txtCel;
private OnClickListener myVarListener=new OnClickListener() {
@Override
public void onClick(View arg0) {
//Lấy F  C từ control ở đây
if(arg0==btnFar)
{
//Bạn xử  chuyển đổi F–>C theo công thức
}
else if(arg0==btnCel)
{
//Bạn xử  chuyển đổi C–>F theo công thức
}
else if(arg0==btnClear)
{
txtFar.setText(“”);
txtCel.setText(“”);
txtFar.requestFocus();
}
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
btnFar = (Button)findViewById(R.id.btnFar);
btnCel = (Button)findViewById(R.id.btnCel);
btnClear = (Button)findViewById(R.id.btnClear);
txtFar = (EditText)findViewById(R.id.txtFar);
txtCel = (EditText)findViewById(R.id.txtCel);
btnFar.setOnClickListener(myVarListener);
btnCel.setOnClickListener(myVarListener);
btnClear.setOnClickListener(myVarListener);
}
}
Bạn tự viết lệnh cho 2 nút chuyển đổi : cách lấy dữ liệu đã hướng dẫn ở những kiểu lập trình sự kiện trước, bắt buộc bạn phải lấy được. Sau khi lấy được thì chỉ cần ráp vào công thức là xong.
5) Explicit listener class:
- Trường hợp này ta tách riêng một class đóng vai trò là class sự kiện riêng.
- Khi nào lượng coding trong ứng dụng khổng lồ và phức tạp thì ta nên tách class sự kiện riêng để dễ quản lý.
Tôi ví dụ giải phương trình bậc 2, bạn xem giao diện bên dưới:
8_event_16- Khi chọn “Tiếp tục”, chương trình sẽ xóa trắng toàn bộ dữ liệu trên màn hình đồng thời focus tới ô Nhập a.
- Khi chọn “Giải PT”, chương trình sẽ tiến hành lấy thông số a,b,c và tiến hành giải phương trình bậc 2 và cho ra kết quả như hình trên.
- Khi chọn “Thoát”, chương trình sẽ được đóng lại.
- Bạn xem Outline dưới đây:
8_event_17- Tiến hành coding, bạn mở Activity class và coding như bên dưới:
import java.text.DecimalFormat;
import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;
public class MainActivity extends Activity {
Button btnTieptuc,btnGiai,btnThoat;
EditText edita,editb,editc;
TextView txtkq;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
btnTieptuc=(Button) findViewById(R.id.btntieptuc);
btnGiai=(Button) findViewById(R.id.btngiaipt);
btnThoat=(Button) findViewById(R.id.btnthoat);
btnTieptuc.setOnClickListener(new MyEvent());
btnGiai.setOnClickListener(new MyEvent());
btnThoat.setOnClickListener(new MyEvent());
edita=(EditText) findViewById(R.id.edita);
editb=(EditText) findViewById(R.id.editb);
editc=(EditText) findViewById(R.id.editc);
txtkq=(TextView) findViewById(R.id.txtkq);
}
public void giaiPtb2()
{
String sa=edita.getText()+””;
String sb=editb.getText()+””;
String sc=editc.getText()+””;
int a=Integer.parseInt(sa);
int b=Integer.parseInt(sb);
int c=Integer.parseInt(sc);
String kq=””;
DecimalFormat dcf=new DecimalFormat(“#.00″);
if(a==0)
{
if(b==0)
{
if(c==0)
kq=”PT vô số nghiệm”;
else
kq=”PT vô nghiệm”;
}
else
{
kq=”Pt có 1 No, x=”+dcf.format(-c/b);
}
}
else
{
double delta=b*b-4*a*c;
if(delta<0)
{
kq=”PT vô nghiệm”;
}
else if(delta==0)
{
kq=”Pt có No kép x1=x2=”+dcf.format(-b/(2*a));
}
else
{
kq=”Pt có 2 No: x1=”+dcf.format((-b-Math.sqrt(delta))/(2*a))+
“; x2=”+dcf.format((-b-Math.sqrt(delta))/(2*a));
}
}
txtkq.setText(kq);
}
private class MyEvent implements OnClickListener
{
@Override
public void onClick(View arg0) {
if(arg0==btnTieptuc)
{
edita.setText(“”);
editb.setText(“”);
editc.setText(“”);
edita.requestFocus();
}
else if(arg0.getId()==R.id.btngiaipt)
{
giaiPtb2();
}
else if(arg0.getId()==R.id.btnthoat)
{
finish();
}
}
}
}
- Bạn quan sát coding ở bên trên. Tôi tạo một lớp sự kiện tên là MyEvent, control nào muốn được gán sự kiện chỉ cần gọi lệnh giống như Tôi gán cho Button Giải phương trình:
btnGiai.setOnClickListener(new MyEvent());
- Trong hàm public void onClick(View arg0) . Bạn để ý là lúc thì Tôi so sánh theo Object, lúc thì Tôi lại lấy Id ra để so sánh. Đây là cố ý của Tôi, Tôi muốn nói rằng các bạn có thể kiểm tra xem Button nào sẽ được chọn trên giao diện bằng cách so sánh đối tượng hoặc lấy Id ra để so sánh (tùy ý đồ lập trình của mỗi người)
- Ở đây Tôi có 1 lời khuyên cho các bạn là khi phải xử lý quá nhiều dòng lệnh (lệnh phức tạp) thì bạn nên viết thành từng hàm riêng, và trong hàm xử lý sự kiện  bạn chỉ cần gọi tên hàm mà thôi. Cụ thể là đối với Button “Giải PT” thì Tôi lại viết và gọi riêng hàm giaiPtb2(), còn đối với Button Tiếp tục và Thoát thì Tôi lại không cần thiết viết hàm vì xử lý quá đơn giản.
6. View Subclassing
- Kỹ thuật này không được phổ biến cho lắm. Bạn chỉ sài khi thêm Control động (lúc runtime) vào màn hình. Ta có thể dùng bất kỳ kỹ thuật nào (6 cách Tôi vừa nêu) để thêm sự kiện động cho một Button động.
-Ở cách cuối cùng này thì bạn phải override phương trình performClick của chính Button control:
8_event_18- Như vậy các bạn đã được thực hành về các kiểu lập trình sự kiện trong Android, biết được cách lấy dữ liệu từ EditText, biết xử lý định dạng dữ liệu, củng cổ thêm được Layout.
- Trong các bài tập sắp tới các bạn sẽ được thực hành về Toast & Alert Dialog, và rất nhiều  các control cơ bản cũng như nâng cao trong Android .
- Bạn phải hiểu rõ các kỹ thuật lập trình này để tùy vào từng trường hợp cụ thể mà bạn nên quyết định kỹ thuật nào cho phù hợp.
Chúc các bạn thành công.

Bài tập 7: Làm quen với các Layout trong Android

Bài tập 7: Làm quen với các Layout trong Android

1) Cách tạo Layout và kết nối Layout vào Activity
2) Cách sử dụng HierarchyViewer 
3) Các Layout cơ bản:
  • FrameLayout
  • LinearLayout
  • TableLayout
  • RelativeLayout
  • AbsoluteLayout
*** Đồng thời bạn phải biết kết hợp các Layout này lại với nhau để cho ra được giao diện phức tạp như ý muốn.
- Tôi chỉ nêu ra một số đặc điểm, không thể nói hết ở đây. Các bạn sẽ từ từ cập nhập sau khi đã quen với Layout.
- Trước tiên bạn cần biết cách tạo một Layout mới và cách kết nối nó vào Activity như thế nào:
1) Cách tạo Layout và kết nối Layout vào Activity:
a) Layout mặc định đầu tiên khi bạn tạo một Android Project:
- Khi bạn tạo một Android Project thì mặc nhiên sẽ có một Activity được chỉ định chạy đầu tiên khi bạn thực thi ứng dụng:
7_Layout_0
- Bạn quan sát hình trên: Khi bạn tạo một ứng dụng Android thì mặc nhiên sẽ tạo luôn một Activity để thực thi đầu tiên khi bạn chạy ứng dụng. Ứng với một Activity thì nó sẽ có 1 Layout đi kèm. Trong hình trên thì MainActivity.java (số 1) sẽ có layout đi kèm là activity_main.xml(số 2 – và bạn nhớ luôn là activity_main này sẽ được tự động tạo ra trong thư mục gen của Android, dựa vào đây để ta kết nối Layout vào Activity).
- Như đã nói ở những bài tập trước: Mọi Activity muốn được triệu gọi thành công trong ứng dụng thì bắt buộc nó phải được khai báo trong AndroidManifest.xml (số 3). Bạn double click vào Manifest và nhìn vào vùng số 4, MainActivity được khai báo trong này đồng thời đăng ký là Activity sẽ khởi động lúc ứng dụng được thực thi (xem vùng Tôi bôi màu xanh phần intent-filter).
- Tiếp theo bạn Double – click vào tập tin MainActivity.java:
7_Layout_1
- Nhìn vào hàm onCreate, bạn thấy dòng lệnh : setContentView(R.layout.activity_main); chính là dòng lệnh dùng để kết nối Layout vào Activity. Bạn nhớ là activity_main phải được tự động tạo ra trong gen như hình bên dưới:
7_Layout_2
b) Đổi Layout mặc định bằng một Layout khác bất kỳ:
- Để tạo một Layout mới, bạn click chuột phải vào Project/ chọn New/ chọn Android XMLFile:
7_Layout_3
- Khi bạn chọn Android XML File thì màn hình bên dưới xuất hiện: Đặt tên cho Layout, chọn kiểu Layout rồi nhấn nút Finish:
7_Layout_4
- Ở trên Tôi đặt tên là : my_new_layout, sau khi nhấn nút Finish bạn quan sát Package Explorer:
7_Layout_5
- Bạn thấy Tôi double – click vào layout : my_new_layout và kéo thả một số control vào giao diện như hình bên trên (bạn nhớ là my_new_layout phải được tự động xuất hiện trong gen –bạn tự kiểm tra).
- Bây giờ bạn vào lại MainActivity.java. Sửa lại dòng lệnh setContentView thành:
7_Layout_6
- Khởi động chương trình và bạn thấy ứng dụng sẽ chạy cái Layout mới này chứ không phải Layout cũ nữa:
7_Layout_7
2) Cách sử dụng HierarchyViewer:
- Như bạn đã biết, một Layout phải được kết nối vào Activity nào đó thông qua hàmsetContentView, Android sẽ có cơ chế dịch XML thành Java code:
7_Layout_8
- Ta có thể dùng HierarchyViewer để hiển thị cấu trúc UI của màn hình hiện tại trên emulator hoặc thiết bị thật:
Bạn vào thư mục SDK của bạn / vào thư mục Tools/ rồi chạy tập tin monitor.bat :
7_Layout_9
3) Các Layout cơ bản:
a) FrameLayout:
- Là loại Layout cơ bản nhất, đặc điểm của nó là khi gắn các control lên giao diện thì các control này sẽ luôn được “Neo” ở góc trái trên cùng màn hình, nó không cho phép chúng ta thay đổi vị trí của các control theo một Location nào đó.
- Các control đưa vào sau nó sẽ đè lên trên và che khuất control trước đó (trừ khi ta thiết lập transparent cho control sau):
- Bạn xem đoạn cấu trúc XML dưới này:
<?xml version=”1.0″ encoding=”utf-8″?>
<FrameLayout android:id=”@+id/mainlayout” android:layout_height=”fill_parent” android:layout_width=”fill_parent” android:orientation=”vertical” xmlns:android=”http://schemas.android.com/apk/res/android”&gt;
<ImageView android:layout_height=”wrap_content” android:layout_width=”wrap_content” android:padding=”5px” android:src=”@drawable/blue“/>
<ImageView android:layout_height=”wrap_content” android:layout_width=”wrap_content” android:padding=”5px” android:src=”@drawable/red“/>
</FrameLayout>
7_Layout_10- Bạn thấy đó, hình màu đỏ và màu xanh luôn được “neo” ở góc trái màn hình. Hình màu đỏ đưa vào sau sẽ đè lên trên hình màu xanh.
Chú ý 2 dòng lệnh bên dưới:
- android:src=”@drawable/blue
- android:src=”@drawable/red
Là do ta kéo 2 cái hình tên là blue và red vào thư mục drawable của ứng dụng
b) LinearLayout
- Layout này cho phép sắp xếp các control theo 2 hướng trên giao diện: Hướng từ trái qua phải và hướng từ trên xuống dưới.
7_Layout_11
- Bạn có thể dùng margin, gravity, weight để hỗ trợ cho việc thiết kế. Ở đây Tôi không có thời gian nhiều nên chỉ nói đặc điểm chính của LinearLayout, các bạn tự tìm hiểu thêm.
- Ta có thể dùng Properties hỗ trợ sẵn trong Eclipse để thiết lập các thuộc tính cho control:
- Ví dụ như để căn lề các control trên giao diện ta dùng layout_gravity:
7_Layout_12
- hay để căn lề nội dung bên trong của control dùng gravity:
7_Layout_13
- Bạn cũng phải biết so sánh sự khác biệt giữa Padding và Margin:
7_Layout_14
- Ví dụ thay đổi Padding (internal spacing – khoảng cách giữa nội dung bên trong so với đường viền của control):
7_Layout_15
- Ví dụ về đổi Margin (external spacing – khoảng cách giữa control này với control khác):
7_Layout_16
c) TableLayout
-Cho phép sắp các control theo dạng lưới (dòng và cột)
- TableLayout sẽ xem dòng nào có số lượng control nhiều nhất để xác định rằng nó có bao nhiêu cột (lấy dòng có số lượng control nhiều nhất làm số cột chuẩn).
7_Layout_17
- Như vậy theo hình trên thì bạn phải nói là TableLayout này có 4 cột, 3 dòng.
- Dùng layout_span để trộn các cột:
7_Layout_19
- Dùng layout_column để di chuyển vị trí của control đến một cột nào đó trên 1 dòng:
7_Layout_20- Dùng stretchColumns để dãn đều các control, các cell (ta thường dùng dấu “*”):
7_Layout_21d) RelativeLayout:
- RelativeLayout cho phép sắp xếp các control theo vị trí tương đối giữa các control khác trên giao diện (kể cả control chứa nó). Thường nó dựa vào Id của các control khác để sắp xếp theo vị trí tương đối. Do đó khi làm RelativeLayout bạn phải chú ý là đặt Id control cho chuẩn xác, nếu sau khi Layout xong mà bạn lại đổi Id của các control thì giao diện sẽ bị xáo trộn (do đó nếu đổi ID thì phải đổi luôn các tham chiếu khác sao cho khớp với Id bạn mới đổi).
- Dưới đây là ví dụ về cách sử dụng RelativeLayout (bạn để ý những dòng tô đậm):
7_Layout_22- Ta có thể sử dụng công cụ trong Eclipse để thiết kế :
7_Layout_23e) AbsoluteLayout:
- Cho phép thiết lập các control giao diện theo vị trí tùy thích:
7_Layout_24
- Như vậy các Tôi đã giới thiệu sơ qua cách tạo Layout và cách sử dụng một số Layout cụ thể, tùy từng trường hợp mà các bạn ứng dụng vào. Thông thường ứng với mỗi một ứng dụng cụ thể thì bạn phải kết hợp nhiều loại Layout lại với nhau.
- Bạn cần hiểu rõ các loại Layout để giúp ích cho quá trình thiết kế giao diện
- Bài tập sau Tôi sẽ hướng dẫn các bạn cách sử dụng một số control cơ bản và cách viết sự kiến cho Button như thế nào.
Chúc các bạn thành công.

Saturday, September 20, 2014

Bài 1: Thiết lập môi trường lập trình và tạo ứng dụng đầu tiên

Bài 1: Thiết lập môi trường lập trình và tạo ứng dụng đầu tiên

Trong bài này tôi sẽ hướng dẫn các bạn tải và cài đặt các công cụ cần thiết cho việc lập trình di động trên môi trường Android. Hai thành phần cơ bản nhất mà chúng ta cần phải có chính là bộ Android SDK (Software Development Kit) chứa các phiên bản Android, các hàm API cần thiết cũng như các công cụ hỗ trợ lập trình khác và JDK (Java Development Kit) dùng để tạo ra môi trường thực thi máy ảo cho hệ điều hành mà chúng ta đang sử dụng.
Các bạn có thể tải bộ Android SDK tại địa chỉ http://developer.android.com/sdk/index.html. Khi tải về bộ Android SDK sẽ có định dạng *.exe trên môi trường Windows và ZIP đối với Linux và Mac OS. Việc cài đặt chúng ta có thể chỉ định nơi lưu trữ trên ổ cứng thiết bị, lưu ý không nên chọn phân vùng đã cài hệ điều hành bởi vì bộ SDK sẽ tăng dung lượng rất nhiều khi chúng ta tải về các phiên bản khác.
Đối với JDK các bạn truy cập vào trang http://www.oracle.com/index.html để tải và cài đặt phiên bản mới nhất để tăng tính ổn định và hỗ trợ tốt nhất.

Và tất nhiên nếu bạn không muốn phải lập trình trên phần mềm soạn thảo văn bản thì một công cụ lập trình IDE (Integrated development environment) sẽ rất hữu ích và tiện lợi. Eclipse được xem là một công cụ hỗ trợ rất tốt trong việc lập trình ứng dụng Android. Truy cập vào trang http://eclipse.org/downloads/ để tiến hành tải và chạy trực tiếp Eclipse. Trong tài liệu này Eclipse được sử dụng là phiên bản 4.2.1 (Juno – Eclipse Classic).

Để có thể tạo cầu nối cho Eclipse với bộ Android SDK  làm việc với nhau, ta cần phải sử dụng thêm plugin ADT (Android Development Tool) cho Eclipse. Nó cho phép chúng ta tạo Project Android, quản lí các máy ảo, đóng gói ứng dụng và nhiều thứ khác nữa.Việc cài đặt ADT đơn giản chỉ cần theo các bước sau:
1. Chọn Help trên thanh tác vụ của Eclipse và chọn Install New Software v�  bấm vào nút Add.
2. Trong hộp thoại mới xuất hiện, điền địa chỉ truy cập để tải về ADT trong ô Locationhttps://dl-ssl.google.com/android/eclipse/.
3. Nhấn OK để Eclipse bắt đầu tìm kiếm, sau khi hoàn thành sẽ hiện ra các plug-in. Đánh dấu vào nút gốc Developer Tools và nhấn Next. Eclipse sẽ tự động tải về, ta tiếp tục nhấn Next để qua bước cài đặt.
4. Đọc và chấp nhận các điều khoản bản quyền, nhấn Next và Finsh.
5. Sau khi cài xong cần thực hiện khởi động lại Eclipse và tham chiếu đến đến bộ Android SDK đã cài đặt. Chọn mục Preferences trong phần Windows trên thanh tác vụ của Eclipse.
6. Chọn mục Android trong cây thư mục ở bảng phía bên trái.
7. Nhấn Browse, trỏ đến thư mục đã cài đặt bộ Android SDK và nhấn Apply. Danh sách các phiên bản SDK sẽ được liệt kê như hình. Nhấn OK để hoàn thành cài đặt. 
Vậy là các bạn đã thiết lập xong môi trường lập trình. Chúng ta sẽ tìm hiểu tiếp cách tạo ứng dụng và chạy thực thi trên máy ảo.

Sau khi cài Plugin ADT, ta sẽ thấy xuất hiện 2 biểu tượng trên thanh công cụ của Eclipse.   
 
Biểu tượng đầu tiên là Android SDK Manager, quản lí các phiên bản Android. Ứng với từng phiên bản là các tài liệu hướng dẫn, các ví dụ minh họa và các hàm API...Nhấn vào biểu tượng để khởi động Android SDK Manager và ADT sẽ tượng động cập nhật các gói mới, bạn có thể lựa chọn phiên bản Android hoặc các công cụ cần thiết và ấn Install Pakages .

Biểu tượng thứ 2 là Android Virtual Device Manager (AVD), cho phép lập trình viên tạo và quản lí các thiết bị ảo. Để tạo thiết bị ảo ta khởi động AVD, ấn New, một hộp thoại mới hiện ra và điền vào các thông tin sau:
1. Name: tên thiết ảo cần tạo (thường đặt tên theo phiên bản).
2. Target: phiên bản Android muốn thực thi trên thiết bị ảo này.
3. CPU/ABI: giả lập chip xử lý cho thiết bị ảo, mặc định là ARM (armeabi-v7a) hoặc Intel Atom đối với từng phiên bản khác nhau.
4. SD Card: cấp phát bộ lưu trữ ngoài cho thiết bị hoặc trỏ đến tập tin ảnh có sẵn.
5. Snapshot: bật tắt chế độ chụp màn hình.
6. Skin: định nghĩa độ phân giải cũng như kích thước  màn hình cho thiết bị ảo.
7. Hardware: bổ sung các thuộc tính phụ về phần cứng cho thiết bị. Ở đây ta cần bổ sung thêm thuộc tính Keyboard Support để có thể nhập liệu vào thiết bị ảo từ bàn phím máy tính cá nhân.
lap-trinh-android

Nhấn Create AVD để kết thúc quá trình tạo thiết bị ảo. Danh sách các thiết bị ảo được liệt kê trên bảng bên tay phải, ta có nhấn chọn để khởi động (Start) hoặc các tuỳ chỉnh (Edit), xoá (Delete) và xem lại thông số thiết bị (Details).

Việc tiếp theo ta sẽ thực hiện tạo một Project và chạy thử trên thiết bị ảo mà ta đã tạo. Để tạo mới Projectta sẽ dùng công cụ Android New Project Wizard theo các bước sau:
1. Từ thanh tác vụ của Eclipse chọn File à New à Android Application Project.
2. Trong hộp thoại mới xuất hiện điền các thông tin sau:
a. Project Name: là tên của đề án.
b. Application Name: là tên ứng dụng mà chúng ta sẽ tạo.
c. Package Name: là tên định danh của gói phần mềm được hệ thống lưu trữ trên thiết bị khi cài đặt ứng dụng. Thường sẽ được được theo tên của một tổ chức hoặc cá nhân tạo ra ứng dụng. Bắt buộc phải có 2 trường dữ liệu trở lên và ngăn nhau bởi dấu chấm. Ví dụ “htsi.test.demoapplication”.
d. Build SDK: chính là phiên bản mà lập trình viên sẽ phát triển ứng dụng, mặc nhiên các hàm hỗ trợ sẽ được tích hợp nhằm tối ưu hoá ứng dụng trên phiên bản này.
e. Minimum Required SDK: phiên bản thấp nhất được chỉ định để chạy ứng dụng. Một số các hàm API sẽ được gọi bổ sung trong phần thư viện hỗ trợ.
f. Create custom launcher icon: đánh dấu vào phần này để thiết lập biểu tượng cho ứng dụng.
g. Mark this project as a library: đánh dấu cho biết chúng ta đang cần tạo ra một Project mới dạng thư viện để sử dụng.
h. Location: nơi dùng để lưu Project. Có thể để mặc định hoặc tạo ra nơi lưu trữ mới bằng cách đánh dấu hoặc huỷ đánh dấu phần Create Project in Workspace.
3. Nhấn Next qua hộp thoại tiếp theo sẽ là nơi để chúng ta tạo ra biểu tượng cho ứng dụng nếu như hộp thoại trước chúng ta có đánh dấu vào phần Create custom launcher icon.
4. Tiếp tục nhấn Next ta sẽ qua hộp thoại tạo Activity (có thể tạm hiểu là màn hình ứng dụng đầu tiên). Có hai lựa chọn là BlankActivity cho màn hình tất cả các phiên bản Android và MasterDetailFlow cho các phiên bản từ 3.0 (API 11) trở lên.
5. Trong hộp thoại cuối cùng, ta sẽ thiết lập thêm một số các thông số cho Activity như tên (Activity Name), giao diện sẽ dùng (Layout Name), các điều hướng trên màn hình (Navigation - chỉ hỗ trợ từ phiên bản Android 4.0). Nhấn Finish để hoàn thành việc tạo đề án.
Để chạy thử Prject này ta thực hiện chuột phải lên tên Project, chọn Run As à Android Application. Và đây sẽ màn hình ứng dụng đầu tiên của bạn. 
lap-trinh-android