ViewGroup thông thường chúng ta hay gặp là LinearLayout, Relative Layout. Xây dựng custom ViewGroup cho phép chúng ta tạo 1 tập các widget được sắp xếp theo ý muốn rồi đưa vào sử dụng.

Yêu cầu: Xây dựng ứng dụng dạng To Do List: Cho phép nhập vào nội dung công việc và thời gian thực hiện công việc rồi đưa vào list công việc. Cho phép xóa các công việc khỏi list.

B1: Khởi tạo project: File -> New -> Android Project
Project name: Example 3
Build Target: Chọn Android 1.5
Application name: Example 3
Package name: at.exam
Create Activity: Example
=> Kích nút Finish.

B2: Xây dựng custom view group trong XML. Đi tới res\layout tạo 1 file XML mới là list.xml. Gõ nội dung sau vào:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:orientation="horizontal">
    <CheckBox
          android:id="@+id/check_work"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text=""
          android:paddingTop="45px"
          android:paddingRight="10px"         
      />
      <LinearLayout
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:orientation="vertical"         
      >
          <TextView
              android:id="@+id/work_content"
              android:textSize="24px"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:lines="1"
              android:textColor="@color/work_color"
          />
          <TextView
              android:id="@+id/time_content"
              android:textSize="16px"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:lines="1"
              android:textColor="@color/time_color"
          />
      </LinearLayout>
</LinearLayout>

Custom ViewGroup của chúng ta ở đây khá đơn giản, đó là 1 LinearLayout chứa 2 thành phần: 1 CheckBox và 1 LinearLayout khác gồm 2 TextView để hiển thị nội dung công việc và thời gian.

B3: Đã xong giao diện cho custom ViewGroup, chúng ta sẽ thiết kế giao diện cho chương trình trong main.xml. Ở đây mình dùng lại giao diện của Example 2 trong bài 2.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <EditText
        android:id="@+id/work_enter"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="@string/work_hint"
        android:lines="1"
        android:textSize="24px"
    />
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        >
        <TextView
            android:layout_width="50px"
            android:layout_height="wrap_content"
            android:text="@string/hour_edit"
            android:typeface="normal"
            android:textSize="15px"
            android:textStyle="bold"
            android:padding="5px"
        />
        <EditText
            android:id="@+id/hour_edit"
            android:layout_width="45px"
            android:layout_height="wrap_content"
            android:hint="12"
            android:textColorHint="@color/hint_color"
            android:textSize="20px"
            android:gravity="center"
            android:padding="5px"
            android:numeric="integer"
            android:maxLength="2"
        />
        <TextView
            android:layout_width="65px"
            android:layout_height="wrap_content"
            android:text="@string/minute_edit"
            android:typeface="normal"
            android:textSize="15px"
            android:textStyle="bold"
            android:padding="5px"
        />
        <EditText
            android:id="@+id/minute_edit"
            android:layout_width="45px"
            android:layout_height="wrap_content"
            android:hint="00"
            android:textColorHint="@color/hint_color"
            android:textSize="20px"
            android:gravity="center"
            android:padding="5px"
            android:numeric="integer"
            android:maxLength="2"
        />       
    </LinearLayout>
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="@string/button_content"
        />
    <ListView
        android:id="@+id/list"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
    />
</LinearLayout>

B4: Tạo file colors.xml trong res\value:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="work_color">#ffffff</color>
    <color name="time_color">#cccccc</color>   
    <color name="hint_color">#cccccc</color>
</resources>

work_color là màu của nội dung công việc trong list. time_color màu của thời gian công việc. hint_color màu của text hint (dòng hướng dẫn) các EditText.

B5: Chỉnh sửa file strings.xml trong res\value:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="app_name">Example 3</string>
    <string name="work_hint">Enter the work here</string>
    <string name="hour_edit">Hour</string>
    <string name="minute_edit">Minute</string>
    <string name="button_content">Add work</string>
</resources>

B6: Time to coding. Đi tới src\at.exam tạo một class mới là CustomViewGroup với nội dung sau:

package at.exam;

import android.content.Context;
import android.view.LayoutInflater;
import android.widget.CheckBox;
import android.widget.LinearLayout;
import android.widget.TextView;

public class CustomViewGroup extends LinearLayout {
    public CheckBox cb;
    public TextView workContent;
    public TextView timeContent;
    public CustomViewGroup(Context context) {
        super(context);

        //Sử dụng LayoutInflater để gán giao diện trong list.xml cho class này
        LayoutInflater li = (LayoutInflater) this.getContext()
                                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        li.inflate(R.layout.list, this, true);

        //Lấy về các View qua Id
        cb = (CheckBox) findViewById(R.id.check_work);
        workContent = (TextView) findViewById(R.id.work_content);
        timeContent = (TextView) findViewById(R.id.time_content);
    }
}

Đoạn code trên giúp ta định nghĩa giao diện của custom ViewGroup mới dựa trên file list.xml. Mọi người cũng có thể tạo giao diện bằng code, ko cần sử dụng XML nhưng sẽ phức tạp hơn và mình cũng ko giới thiệu ở đây.

B7: Tạo 1 class Work cũng trong at.exam để thể hiện công việc:

package at.exam;

public class Work {
    private String workContent;
    private String timeContent;
    private boolean isChecked;

    public Work(String workContent, String timeContent) {
        this.workContent = workContent;
        this.timeContent = timeContent;
        isChecked = false;
    }

    public String getContent() {
        return workContent;
    }

    public String getTime() {
        return timeContent;
    }

    public void setChecked(boolean isChecked) {
        this.isChecked = isChecked;
    }

    public boolean isChecked() {
        return isChecked;
    }
}

Code rất đơn giản nên mình sẽ không chú thích nữa.

B8: Chúng ta đã tạo xong custem ViewGroup, bây giờ chính là lúc sử dụng. Tạo 1 class mới tên là ListWorkApdapter trong at.exam:

package at.exam;

import java.util.ArrayList;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.CheckBox;
import android.widget.CompoundButton;
import android.widget.TextView;
import android.widget.CompoundButton.OnCheckedChangeListener;

public class ListWorkAdapter extends ArrayAdapter<Work>{
    ArrayList<Work> array;
    int resource;
    Context context;

    public ListWorkAdapter(Context context, int textViewResourceId,
            ArrayList<Work> objects) {
        super(context, textViewResourceId, objects);
        this.context = context;
        resource = textViewResourceId;
        array = objects;       
    }    

    //Phương thức xác định View mà Adapter hiển thị, ở đây chính là CustomViewGroup
    //Bắt buộc phải Override khi kế thừa từ ArrayAdapter
    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View workView = convertView;

        if (workView == null) {
            workView = new CustomViewGroup(getContext());
        }

        //Lấy về đối tượng Work hiện tại
        final Work work = array.get(position);

        if (work != null) {
            TextView workContent = ((CustomViewGroup) workView).workContent;
            TextView timeContent = ((CustomViewGroup) workView).timeContent;
            CheckBox checkWork = ((CustomViewGroup) workView).cb;

            //Set sự kiện khi đánh dấu vào checkbox trên list
            checkWork.setOnCheckedChangeListener(new OnCheckedChangeListener() {

                @Override
                public void onCheckedChanged(CompoundButton buttonView,
                        boolean isChecked) {
                    work.setChecked(isChecked);                   
                }               
            });

            //Lấy về nội dung cho TextView và CheckBox dựa vào đối tượng Work hiện tại
            workContent.setText(work.getContent());
            timeContent.setText(work.getTime());
            checkWork.setChecked(work.isChecked());
        }       
        return workView;
    }   
}

ListWorkAdapter sẽ được sử dụng thay thế cho ArrayAdapter được bind với ListView. Thông thường ArrayAdapter chỉ cho hiển thị String bằng TextView, nhưng với việc kế thừa và override phương thức getView, ta có thể định nghĩa lại hiển thị cho các thành phần của ListView.

B9: Việc cuối cùng cần làm là viết lại Activity. Tới Example.java và chỉnh sửa theo nội dung sau:

package at.exam;

import java.util.ArrayList;

import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ListView;

public class Example extends Activity {   
    //Các hằng dùng cho tạo Option Menu
    private static final int DELETE_WORK = Menu.FIRST;
    private static final int ABOUT = Menu.FIRST + 2;

    ArrayList<Work> array;
    ListWorkAdapter arrayAdapter;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        array = new ArrayList<Work>();
        arrayAdapter = new ListWorkAdapter(this,
                R.layout.list, array);

        final EditText workEnter = (EditText) findViewById(R.id.work_enter);
        final EditText hourEdit = (EditText) findViewById(R.id.hour_edit);
        final EditText minuteEdit = (EditText) findViewById(R.id.minute_edit);

        final Button button = (Button) findViewById(R.id.button);

        //Tạo list view cho danh sách công việc
        final ListView list = (ListView) findViewById(R.id.list);
        list.setAdapter(arrayAdapter);

        OnClickListener add = new OnClickListener() {
            @Override
            public void onClick(View v) {
                if (workEnter.getText().toString().equals("") ||
                        hourEdit.getText().toString().equals("") ||
                        minuteEdit.getText().toString().equals("")) {
                    AlertDialog.Builder builder = new AlertDialog.Builder(Example.this);
                    builder.setTitle("Info missing");
                    builder.setMessage("Please enter all information of the work");
                    builder.setPositiveButton("Continue", new DialogInterface.OnClickListener() {
                        public void onClick(DialogInterface dialog, int which) {
                            // TODO Auto-generated method stub                           
                        }                       
                    });
                    builder.show();
                }
                else {
                    String workContent = workEnter.getText().toString();
                    String timeContent = hourEdit.getText().toString() + ":"
                                    + minuteEdit.getText().toString();
                    Work work = new Work(workContent, timeContent);
                    array.add(0, work);
                    arrayAdapter.notifyDataSetChanged();
                    workEnter.setText("");
                    hourEdit.setText("");
                    minuteEdit.setText("");
                }
            }

        };

        button.setOnClickListener(add);       
    }

    //Tạo Option Menu
    public boolean onCreateOptionsMenu(Menu menu) {
        super.onCreateOptionsMenu(menu);       
        menu.add(0, DELETE_WORK, 0,"Delete" ).setIcon(android.R.drawable.ic_delete);       
        menu.add(0, ABOUT, 0,"About" ).setIcon(android.R.drawable.ic_menu_info_details);
        return true;
    }

    //Xử lý sự kiện khi các option trong Option Menu được lựa chọn
    public boolean onOptionsItemSelected(MenuItem item) {
        switch (item.getItemId()) {           
            case DELETE_WORK: {
                deleteCheckedWork();
                break;
            }           
            case ABOUT: {
                AlertDialog.Builder builder = new AlertDialog.Builder(this);
                builder.setTitle("VietAndroid");
                builder.setMessage("AUTHOR:" + "\n" + "  Nguyen Anh Tuan" + "\n" + "SOURCE:" + "\n" + "  diendan.vietandroid.com");
                builder.setPositiveButton("Close", new DialogInterface.OnClickListener() {                                    
                    public void onClick(DialogInterface dialog, int which) {
                    }
                });
                builder.setIcon(android.R.drawable.ic_dialog_info);
                builder.show();
                break;
            }
        }
        return true;
       }

    private void deleteCheckedWork() {
        if (array.size() > 0) {
            for (int i = array.size() - 1; i >= 0; i--) {
                if (array.get(i).isChecked()) {
                    array.remove(i);
                    arrayAdapter.notifyDataSetChanged();
                    continue;
                }
            }
        }       
    }
}

OK. Vậy là xong. Option Menu là menu ẩn chỉ hiện ra khi bạn nhấn nút Menu của điện thoại. Option Menu rất tiện trong việc đưa ra các tùy chỉnh, giống như khi bạn nhấn phím Esc khi đang chơi game trên PC vậy.

Các bạn có thể lưu ý là thay vì sử dụng ArrayList<String> như trước mình đã thay bằng ArrayList<Work> và trong khởi tạo đối tượng arrayAdapter thì đối số thứ 2 là R.layout.list thay vì android.R.layout.simple_list_item_1, nghĩa là chúng ta đã sử dụng layout do mình tự tạo thay vì layout Android cung cấp sẵn cho hiển thị các thành phần của ListView.

Nếu chạy thử, các bạn có thể thấy khi ta đánh dấu vào checkbox của 1 thành phần trong list, rồi nhấn Menu và chọn delete thì thành phần sẽ bị gỡ bỏ khỏi danh sách.

Tham khảo: http://vietandroid.com/tin-tuc.html.

Các bài viết liên quan:

Cơ bản Android-Xây Dựng Giao Diện Cơ Bản – P3

Trong khung Package Explorer, ở phía dưới thư mục res, bạn sẽ thấy 1 file có tên là AndroidManifest.xml. Mỗi ứng dụng đều cần có AndroidManifest.xml để mô tả những thông tin quan trọng của nó cho hệ thống Android biết. Let’s look closer:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
      package="at.exam"
      android:versionCode="1"
      android:versionName="1.0">
    <application android:icon="@drawable/icon" android:label="@string/app_name">
        <activity android:name=".Example"
                  android:label="@string/app_name">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
    <uses-sdk android:minSdkVersion="3" />
</manifest>

Cụ thể những công việc mà AndroidManifest.xml thực hiện:
- Đặt tên cho Java package của ứng dụng.
- Mô tả các thành phần (component) của ứng dụng: activity, service, broadcast receiver hoặc content provider.
- Thông báo những permission mà ứng dụng cần có để truy nhập các protected API và tương tác với các ứng dụng khác.
- Thông báo những permission mà các ứng dụng khác cần có để tương tác với ứng dụng hiện thời.
- Thông báo level thấp nhất của Android API mà ứng dụng cần để chạy. (Android 1.0 là level 1, 1.1 là level 2, 1.5 level 3, 1.6 level 4 và 2.0 là level 5).
…
Hãy xem thử file AndroidManifest.xml của chương trình TooDo mình đang xây dựng:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
      package="android.at"
      android:versionCode="1"
      android:versionName="1.0">
    <application android:icon="@drawable/icon" android:label="@string/app_name">
        <activity
                android:name=".TooDo"
                android:screenOrientation="landscape"
                android:theme="@android:style/Theme.NoTitleBar.Fullscreen"
                android:label="@string/app_name">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name=".WorkEnter">
        </activity>
        <receiver android:name=".AlarmReceiver">
        </receiver>
    </application>
    <uses-sdk android:minSdkVersion="3" />
    <uses-permission android:name="android.permission.VIBRATE"/>
</manifest>

Main Activity của chương trình Too Do này là activity TooDo. Ngoài ra mình còn có 1 Activity khác có tên là WorkEnter để cho phép nhập vào thời gian và nội dung công việc. 1 Broadcast Receiver có tên là AlarmReceiver để nhận alarm gửi tới trong intent. Khi alarm được nhận sẽ có âm thanh và rung (vibration). Tất cả công việc sẽ được viết trong code, nhưng bắt buộc bạn phải khai báo các thành phần có trong ứng dụng vào AndroidManifest nếu muốn chương trình hoạt động. Tương tự, set permission để truy nhập camera, internet, đọc contact… cũng đều phải khai báo trong AM. Từ khóa screenOrientation cho phép thiết lập giao diện khi vào ứng dụng theo chiều dọc (portrait – mặc định) hay ngang (landscape), theme cho phép sử dụng style có sẵn của android là full-screen (ko có thanh status bar nữa).
Intent filter là bộ lọc dùng để giới hạn các intent được sử dụng trong activity hay receiver…

<intent-filter>
        <action android:name="android.intent.action.VIEW"/>
        <category android:name="android.intent.category.DEFAULT"/>
        <category android:name="android.intent.category.BROWSABLE"/>
        <data android:scheme="http" android:host="www.google.com" android:path="/m/products/scan"/>
      </intent-filter>

Bộ lọc trên chỉ cho phép intent mở internet với đường dẫn định nghĩa sẵn (http://www.google.com/m/products/scan). Ok, hi vọng mọi người đã nắm được chức năng cơ bản cũng như cách sử dụng Android Manifest.

II.Working with View

Trong bài 1 mình đã giới thiệu qua cách sử dụng Edit Text và Text View. Thực chất các View còn lại cũng có cách sử dụng tương tự, bạn sẽ kết hợp nhiều View khác nhau để cho ra giao diện mình mong muốn. Ở đây mình sẽ đề cập nhiều tới List View (theo ý kiến mình là View khó sử dụng nhất).

Yêu cầu: Xây dựng một chương trình cho phép nhập nội dung công việc và thời gian rồi list ra
B1: Vẫn bắt đầu bằng cách khởi tạo một Project mới: File -> New -> Android Project.
Project name: Example 2
Build Target: Chọn Android 1.5
Application name: Example 2
Package name: at.exam
Create Activity: Example
=> Kích nút Finish.

B2: Đi tới res/main.xml để xây dựng giao diện cho chương trình:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <EditText
        android:id="@+id/work_enter"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="@string/work_hint"
        android:lines="1"
        android:textSize="24px"
    />
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        >
        <TextView
            android:layout_width="50px"
            android:layout_height="wrap_content"
            android:text="@string/hour_edit"
            android:typeface="normal"
            android:textSize="15px"
            android:textStyle="bold"
            android:padding="5px"
        />
        <EditText
            android:id="@+id/hour_edit"
            android:layout_width="45px"
            android:layout_height="wrap_content"
            android:hint="12"
            android:textColorHint="@color/hint_color"
            android:textSize="20px"
            android:gravity="center"
            android:padding="5px"
            android:numeric="integer"
            android:maxLength="2"
        />
        <TextView
            android:layout_width="65px"
            android:layout_height="wrap_content"
            android:text="@string/minute_edit"
            android:typeface="normal"
            android:textSize="15px"
            android:textStyle="bold"
            android:padding="5px"
        />
        <EditText
            android:id="@+id/minute_edit"
            android:layout_width="45px"
            android:layout_height="wrap_content"
            android:hint="00"
            android:textColorHint="@color/hint_color"
            android:textSize="20px"
            android:gravity="center"
            android:padding="5px"
            android:numeric="integer"
            android:maxLength="2"
        />       
    </LinearLayout>
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="@string/button_content"
        />
    <ListView
        android:id="@+id/list"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
    />
</LinearLayout>

Giao diện ta thiết kế ở đây có 1 Linear Layout làm thành phần chính, các thành phần con của nó gồm 1 Edit Text (dùng để nhập nội dung công việc), 1 Linear Layout (lại gồm các thành phần con để nhập giờ và phút thực hiện công việc), 1 Button (để thêm nội dung công việc vào List View) và 1 List View dùng để list các công việc bạn đã nhập.
Từ khóa lines được dùng để cố định số dòng và nên sử dụng với Edit Text thay vì dùng mỗi wrap_content vì nếu sd wrap_content thì Edit Text sẽ tự giãn ra nếu dòng nhập vào vượt giới hạn đường bao (làm hỏng giao diện bạn thiết kế).
Từ khóa gravity thông báo các thành phần con sẽ được sắp xếp ntn ở thành phần cha. Ở đây mình dùng “center” nghĩa là thành phần con nằm ở trung tâm. Hãy thử thêm vào 1 Edit Text:

android:gravity="center"

Bạn sẽ thấy dòng chữ nhập vào sẽ bắt đầu từ giữa của Edit Text chứ không bắt đầu từ bên trái như trước nữa.
Từ khóa padding dùng để cách 1 khoảng cách cho thành phần. Nếu không có padding thì 2 thành phần con thuộc cùng 1 LinearLayout sẽ được xếp sát nhau, nhưng nếu 1 thành phần con sử dụng padding thì sẽ tạo được khoảng cách với thành phần còn lại theo mong muốn. Ngoài ra còn có paddingLeft, paddingRight, paddingTop, paddingBottom.
Từ khóa numeric dùng để giới hạn dạng ký tự nhập vào. Ở đây mình muốn chỉ nhập vào chữ số nên dùng “integer”
Từ khóa maxLength dùng để giới hạn số ký tự nhập vào. Do Edit Text này dùng để nhập giờ nên maxLength=”2″.

Ok, giờ đến 1 chút kiến thức về các đơn vị của dimenson:
- px (pixel): điểm chấm trên màn hình.
- in (inch)
- mm (milimet)
- pt (point) = 1/72 m
- dp (density – independent pixel): cái này hơi khó giải thích. Nói chung dp được sử dụng cho nhiều độ phân giải, và với độ phân giải 160 px/inch thì 1 dp = 1 px.
- sp: gần giống dp, nên sử dụng cho text size.
Nói chung nên sử dụng dp và sp để định nghĩa size cho các thành phần, vì nó có tỉ lệ cố định với độ phân giải của màn hình. Còn nếu bạn chủ tâm xây dựng cho 1 độ phân giải nhất định thì dùng px cho chính xác và chắc chắn.

B3: Tới values/strings.xml chỉnh sửa như sau:

B4: Tạo mới colors.xml trong values với nội dung:

OK, vậy là đã hoàn thiện phần giao diện. Các bạn có thể cho chạy thử ngay để kiểm tra xem giao diện đã như ý muốn chưa chứ không cần đợi hoàn thành cả code (Run as -> Android Application).

B5: Time to coding. Tới thư mục src/Example.java và thay đổi nội dung file như sau:

Mình đã chú thích đầy đủ và đoạn code cũng khá dễ hiểu. Tuy nhiên cần lưu ý 2 vấn đề ở đây.
- Khởi tạo đối tượng ArrayAdapter: Các bạn thấy đối số truyền vào là (this, android.R.layout.simple_list_item_1, arrayWork). This là đối số của lớp Context (ở đây chính là activity Example). Bạn sẽ gặp Context trong rất nhiều khởi tạo các lớp và nên hiểu Context có ý nghĩa gì.

• Context thuộc android.content (android.content.Context).
• Là một Interface (lớp giao tiếp) chứa hầu hết thông tin về môi trường ứng dụng của android, có nghĩa là mọi thao tác, tương tác với hệ điều hành điều phải qua lớp này.
• Nó là một lớp abstract (trừu tượng) cung cấp cho những lớp khác các phương thức để tương tác với hệ thống Android.
• Nó cho phép truy cập tới các nguồn tài nguyên (resources) đã được định nghĩa và các lớp khác. Ví dụ như nó có thể khởi tạo và chạy các activities, các broadcast và các intents,… Chúng ta coi như Contex là một lớp ở mức ứng dụng (Application level- liên quan tới hệ thống).
• Tóm lại context giúp chúng ta dễ dàng truy cập và tương tác tới các tài nguyên của hệ thống, các thông tin, các dịch vụ (services), các thông số cấu hình, database, wallpaper, danh bạ, cuộc gọi, kết nối, chế độ rung (vibrator).
• Sở dĩ hầu hết các lớp có liên quan tới UI (layout, button, textview, imageview, listview,…) đều pải super tới Context vì bản thân nó đảm nhiệm việc truy cập resource (R.id, R.layout,….). Nếu chúng ta không tham chiếu tới Context class thì đương nhiên không thể dùng tới các resources mà chúng ta đã tạo ra.

Tiếp theo là android.R.layout.simple_list_item_1, đối này định nghĩa cách thể hiện item (ở đây là String) trong List View. Các bạn hãy ghi nhớ android.R.* là các tài nguyên (resource) có sẵn của Android cho phép bạn truy cập và sử dụng. Sau này khi hướng dẫn tạo custom View cho List View mình sẽ đề cập lại vấn đề này.
Cuối cùng arrayWork chính là mảng cần được bind của adapter.

- AlertDialog là lớp cho phép đưa ra 1 hộp thoại, thường dùng để đưa ra thông tin hoặc cảnh báo đơn giản. Trong code mình tạo 1 builder, tạo tiêu đề (title) cho nó, đưa ra thông báo (message) và cuối cùng là tạo 1 positive button (nhưng không định nghĩa xử lý khi nhấn nút này, vì vậy nếu bạn nhấn nút thì dialog sẽ chỉ đơn giản thực hiện việc đóng lại).

B6: Tiến hành chạy thử chương trình. Run as -> Android Application.

Tham khảo từ: http://diendan.vietandroid.com/ca-c-ba-i-ha-c-ca-ka-m-ma-ngua-n/409-hae-ng-da-n-la-p-tra-nh-cae-ba-n-va-i-android-ba-i-2-a.html.

Các bài liên quan:
Cơ bản trên Android.

Viewgroup và custom Adapter – P4

• Để lập trình android, mình nghĩ mọi người chỉ cần kiến thức java căn bản là hoàn toàn ok. Căn bản ở đây có nghĩa là hiểu được thế nào là class, package, biết ý nghĩa của các từ khóa như public, private, protected,… thành thạo các lệnh cơ bản như if, for(), switch(), while(), … biết sử dụng các lệnh như Integer.parseInt() hay String.valueOf()… Nên có thêm kiến thức về gói java.util vì đây là gói hỗ trợ nhiều lớp rất mạnh được sử dụng trên mọi nền, ngoài ra các gói như java.io, java.net… cũng được quan tâm.
• Các kiến thức về các gói lập trình cho desktop như java.awt, java.swing hoàn toàn không cần thiết (bản thân mình cũng chưa sử dụng cái này bao giờ, nhảy vào học java là học J2ME luôn), hay các gói của J2ME cũng vậy. Lập trình Android tuy cũng là lập trình di động, nhưng các điện thoại sử dụng hệ điều hành Android có cấu hình rất mạnh (Nexus One có VXL lên tới 1Ghz), vì vậy 2 nền tảng Android và J2ME cũng rất khác nhau. Android có những gói riêng hỗ trợ lập trình cho nó và không yêu cầu khắt khe về việc tối ưu code như J2ME. Thật đáng tiếc vì J2ME mình học không ứng dụng được mấy vào lập trình Android (tuy nhiên 1 số kỹ thuật cơ bản cho lập trình game 2D như Sprite, double buffering, Tile… thì vẫn không hề phí phạm chút nào).

II.Cài Đặt Android Để Lập Trình

• Để lập trình Android thì mỗi bộ SDK của Google là không đủ, bạn còn cần tích hợp nó vào một IDE như Eclipse. Anh Giáp đã có 2 bài hướng dẫn rất chi tiết về cài đặt Android trong Eclipse cũng như Netbeans, nhưng theo mình mọi người nên sử dụng Eclipse hơn vì nó có nhiều tính năng hỗ trợ lập trình Google, còn Netbeans thì plugin cho Android vẫn chưa hoàn thiện.
• Tiện thể mình nói luôn, mình học Android theo 2 cuốn Professional Android Application Development và Unlocking Android. Cả 2 cuốn đều dành cho beginner nhưng cuốn đầu code nhiều, giải thích ít, cuốn thứ 2 giải thích rõ ràng hơn. Nếu có ai có ý định tham khảo thì nên đọc cuốn UA trước để hiểu rõ hơn Android, sử dụng cuốn PAAD trong việc tham khảo các đoạn code cho lập trình.

III.Understanding Android Application

Việc hiểu được các thành phần (component) tạo nên một ứng dụng Android là rất cần thiết cho việc lập trình. Các thành phần này được chia làm 6 loại bao gồm:

1.Activity

Hiểu một cách đơn giản thì Activity là nền của 1 ứng dụng. Khi khởi động 1 ứng dụng Android nào đó thì bao giờ cũng có 1 main Activity được gọi, hiển thị màn hình giao diện của ứng dụng cho phép người dùng tương tác.

2.Service

Thành phần chạy ẩn trong Android. Service sử dụng để update dữ liệu, đưa ra các cảnh báo (Notification) và không bao giờ hiển thị cho người dùng thấy.

3.Content Provider

Kho dữ liệu chia sẻ. Content Provider được sử dụng để quản lý và chia sẻ dữ liệu giữa các ứng dụng.

4.Intent

Nền tảng để truyền tải các thông báo. Intent được sử dụng để gửi các thông báo đi nhằm khởi tạo 1 Activity hay Service để thực hiện công việc bạn mong muốn. VD: khi mở 1 trang web, bạn gửi 1 intent đi để tạo 1 activity mới hiển thị trang web đó.

5.Broadcast Provider

Thành phần thu nhận các Intent bên ngoài gửi tới. VD: bạn viết 1 chương trình thay thế cho phần gọi điện mặc định của Android, khi đó bạn cần 1 BR để nhận biết các Intent là các cuộc gọi tới.

6.Notification

Đưa ra các cảnh báo mà không làm cho các Activity phải ngừng hoạt động.

Lưu ý Activity, Service, Broadcast Receiver và Content Provider mới là những thành phần chính cấu thành nên ứng dụng Android, bắt buộc phải khai báo trong AndroidManifest (tham khảo bài tiếp theo có giới thiệu đầy đủ về file này).

IV.Understanding Android Application Life Cycle

Android có cơ chế quản lý các process theo chế độ ưu tiên. Các process có priority thấp sẽ bị Android giải phóng mà không hề cảnh báo nhằm đảm bảo tài nguyên.

• Foreground process: là process của ứng dụng hiện thời đang được người dùng tương tác.
• Visible process: là process của ứng dụng mà activity đang hiển thị đối với người dùng (onPaused() của activity được gọi).
• Service process: là Service đang running.
• Background process: là process của ứng dụng mà các activity của nó ko hiển thị với người dùng (onStoped() của activity được gọi).
• Empty process: process không có bất cứ 1 thành phần nào active.
  Theo chế độ ưu tiên thì khi cần tài nguyên, Android sẽ tự động kill process, trước tiên là các empty process.

1.Android Activity Life Cycle

Như đã giới thiệu ở trên, Actitvity là thành phần quan trọng nhất và đóng vai trò chính trong xây dựng ứng dụng Android. Hệ điều hành Android quản lý Activity theo dạng stack: khi một Activity mới được khởi tạo, nó sẽ được xếp lên đầu của stack và trở thành running activity, các Activity trước đó sẽ bị tạm dừng và chỉ hoạt động trở lại khi Activity mới được giải phóng.Activity bao gồm 4 state:

• active (running): Activity đang hiển thị trên màn hình (foreground).
• paused: Activity vẫn hiển thị (visible) nhưng không thể tương tác (lost focus). VD: một activity mới xuất hiện hiển thị giao diện đè lên trên activity cũ, nhưng giao diện này nhỏ hơn giao diện của activity cũ, do đó ta vẫn thấy được 1 phần giao diện của activity cũ nhưng lại không thể tương tác với nó.
• · stop: Activity bị thay thế hoàn toàn bởi Activity mới sẽ tiến đến trạng thái stop.
• killed: Khi hệ thống bị thiếu bộ nhớ, nó sẽ giải phóng các tiến trình theo nguyên tắc ưu tiên. Các Activity ở trạng thái stop hoặc paused cũng có thể bị giải phóng và khi nó được hiển thị lại thì các Activity này phải khởi động lại hoàn toàn và phục hồi lại trạng thái trước đó.

2.Biểu Đồ Miêu Tả Activity State

3.Vòng đời của Activity

• · Entire lifetime: Từ phương thức onCreate() cho tới onDestroy().
• · Visible liftetime: Từ phương thức onStart() cho tới onStop().
• Foreground lifetime: Từ phương thức onResume() cho tới onPause().

Khi xây dựng Actitvity cho ứng dụng cần phải viết lại phương thức onCreate( ) để thực hiện quá trình khởi tạo. Các phương thức khác có cần viết lại hay không tùy vào yêu cầu lập trình.

4.XML trong Android

• Không giống như lập trình java thông thường, lập trình android ngoài các lớp được viết trong *.java còn sử dụng XML để thiết kế giao diện cho ứng dụng. Tất nhiên bạn hoàn toàn có thể thiết kế 1 giao diện như ý muốn mà không cần tới bất cứ 1 dòng XML nào, nhưng sử dụng XML sẽ đơn giản công việc đi rất nhiều.
• Đồng thời sd XML sẽ giúp việc chỉnh sửa ứng dụng sau này trở nên dễ dàng.
  Về nguyên tắc, khi lập trình ứng dụng ta thiết kế giao diện bằng XML và cài đặt các xử lý khi tương tác với giao diện trong code.

V.Một Số Thành Phần Cơ Bản Trong Android

1.Các Layout

Layout được dùng để quản lý các thành phần giao diện khác theo 1 trật tự nhất định.

• FrameLayout: Layout đơn giản nhất, thêm các thành phần con vào góc trên bên trái của màn hình.
• LinearLayout: thêm các thành phần con theo 1 chiều nhất định (ngang hoặc dọc). Đây là layout được sử dụng nhiều nhất.
• RelativeLayout: thêm các thành phần con dựa trên mối quan hệ với các thành phần khác hoặc với biên của layout.
• TableLayout: thêm các thành phần con dựa trên 1 lưới các ô ngang và dọc.
• AbsoluteLayout: thêm các thành phần con dựa theo tọa độ x, y.

Layout được sử dụng nhằm mục đích thiết kế giao diện cho nhiều độ phân giải. Thường khi lập trình nên kết hợp nhiều layout với nhau để tạo ra giao diện bạn mong muốn.

2.XML Unit

Để hiểu được các thành phần cơ bản của XML cũng như việc sử dụng XML kết hợp với code, ta sẽ đi xây dựng thử một chương trình đơn giản.

Yêu cầu: Xây dựng 1 ứng dụng cho phép gõ 1 nội dung vào rồi hiển thị ra nội dung đó ở bên dưới.

B1: Khởi tạo 1 project (ở đây sử dụng Eclipse để minh họa).
Vào thẻ File -> New -> Android Project. Nếu bạn mới lập trình Android lần đầu thì có lẽ dòng Android Project sẽ không hiện ra, khi đó xuống phía cuối chọn Other rồi vào Android -> Android Project.

B2: Điền thông tin cho project

• Project name: Example 1
• Build Target: Chọn Android 1.5 (mới nhất là 2.1 nhưng hiện tại bạn chưa cần quan tâm).
• Application name: Example 1
• Package name: at.exam
• Create Activity: Example
• Kích nút Finish.

B3: Bên khung Package Explore bên trái đi tới thư mục res, bạn sẽ thấy có 3 thư mục con:

• drawable: thư mục chứa các hình ảnh để làm icon hoặc tài nguyên cho giao diện…
• layout: chứa các file xml để thiết kế giao diện.
• values: chứa các giá trị sử dụng trong ứng dụng được bạn định nghĩa, như các dòng ký tự (string), các màu (color), các themes…

B4:Vào thư mục layout, chọn file main.xml và gõ đoạn code sau vào thay cho toàn bộ nội dung có sẵn (Eclipse hỗ trợ kéo thả cho xml nhưng theo mình không nên sử dụng).

Mã:

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:orientation="vertical"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    >

    <EditText

        android:id="@+id/edit_text"

        android:layout_width="fill_parent"

        android:layout_height="wrap_content"

        android:hint="@string/edit_hint"

    />

    <TextView  

        android:id="@+id/text_view"

        android:layout_width="fill_parent" 

        android:layout_height="wrap_content"

        android:textColor="@color/text_color"

        android:textSize="28px"

        android:typeface="monospace"

    />

</LinearLayout>

• Trong đoạn XML này chúng ta khai báo một Linear Layout với 2 thành phần con của nó là 1 Edit Text (dùng để gõ xâu ký tự) với 1 Text View (hiển thị xâu ký tự). Linear Layout được khai báo với từ khóa orientation nhằm chỉ ra chiều sắp xếp của 2 thành phần con là chiều dọc. Còn với layout_width, layout_height các bạn có thể cho giá trị bằng “fill_parent” hoặc “wrap_content” để thông báo thành phần này sẽ có chiều rộng (dài) phủ đầy thành phần cha hoặc chỉ vừa bao đủ nội dung.
  Trong Edit Text và Text View các bạn có thể thấy có từ khóa id, từ khóa này cho phép khai báo id của các thành phần để lấy về trong code (sẽ đề cập sau).
• Ngoài ra từ khóa hint trong Edit Text cho phép hiện ra phần nội dung mờ khi Edit Text vẫn chưa có ký tự nào. “@string/edit_hint” thông báo lấy trong file strings.xml xâu có tên là edit_hint.
• Còn textColor của Text View thì thông báo đoạn ký tự sẽ được hiển thị với màu lấy trong file colors.xml, textSize chỉ ra cỡ chữ bằng 28 pixel và typeface chỉ ra kiểu chữ là monospace.

B5:Vẫn trong thư mục res, vào values và chọn file strings.xml. Bố sung thêm dòng định nghĩa cho edit_hint như sau:

Mã:

<?xml version="1.0" encoding="utf-8"?>

<resources>

    <string name="hello">Hello World, Example!</string>

    <string name="app_name">Example 1</string>

    <string name="edit_hint">Enter the work here</string>

</resources>

vào thư mục src (source code của project) => at.exam => Example.java, gõ nội dung code sau vào:

Mã:

package at.exam;

import android.app.Activity;

import android.os.Bundle;

import android.view.KeyEvent;

import android.view.View;

import android.view.View.OnKeyListener;

import android.widget.EditText;

import android.widget.TextView;

public class Example extends Activity {

    /** Called when the activity is first created. */

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        //Thiết lập giao diện lấy từ file main.xml

        setContentView(R.layout.main);

        //Lấy về các thành phần trong main.xml thông qua id

        final EditText edit = (EditText) findViewById(R.id.edit_text);

        final TextView text = (TextView) findViewById(R.id.text_view);

        //Thiết lập xử lý cho sự kiện nhấn nút giữa của điện thoại

        edit.setOnKeyListener(new OnKeyListener() {            

            @Override

            public boolean onKey(View v, int keyCode, KeyEvent event) {

                if (event.getAction() == KeyEvent.ACTION_DOWN 

                        && keyCode == KeyEvent.KEYCODE_DPAD_CENTER) {

                    text.setText(edit.getText().toString());

                    edit.setText("");

                    return true;                    

                }

                else {

                    return false;

                }

            }

        });

    }

}

Dạo qua một chút kiến thức cơ bản: Trong Android, các lớp sử dụng để tạo giao diện (Edit Text, Text View…) đều là lớp con của lớp View. Một số lớp thường xuyên được sử dụng để tạo giao diện:

• TextView
• EditText
• ListView
• Spinner
• CheckBox
• Button
• RadioButton

Ngoài ra bạn còn có thể tạo 1 View riêng của mình bằng cách kế thừa View có sẵn.

Các Listener được sử dụng để bắt 1 sự kiện nào đó. Ở đây mình sử dụng OnKeyListener dùng để bắt sự kiện khi nhấn 1 phím của điện thoại. Ngoài ra thường sử dụng OnClickListener để bắt sự kiện chạm vào 1 View đang hiển thị trên màn hình. Mỗi View đều phải set Listener riêng để xử lý cho sự kiện tương tác với nó, và mỗi loại View cũng lại có những Listener dành riêng cho nó (VD: CheckBox có OnCheckChangedListener)
Ở đây mình sử dụng hàm dạng inner để định nghĩa xử lý cho OnKeyListener nên có thể mọi người không quen lắm, nhưng nó cũng nằm trong phần cơ bản của Java đấy nhé.

Đề nghị lưu ý thêm phần R.id.edit_text. Để lấy hoặc truy nhập các thành phần ta đã định nghĩa trong XML ta phải sử dụng R.* như R.layout.main, R.id.edit_text. Lệnh findViewById sẽ trả về 1 View có Id thiết lập trong phần XML. Do View là lớp cha của EditText với TextView nên ở đây ta phải ép kiểu.

Ngoài ra các string hay color cũng có thể lấy về bằng lệnh getResource(). Vd: getResource().getColor(R.color.text_color).

B8: Chạy chương trình. Chọn Run => Android Application và chờ cho emulator khởi động nhé. Ai có 1 Android thật có thể kết nối qua USB và thử nghiệm luôn. Tự chỉnh sửa trong code và trong XML để hiểu thêm về lập trình Android.
Mã:

edit.setOnClickListener(new OnClickListener() {            

                        @Override

            public void onClick(View v) {

                // TODO Auto-generated method stub

            }

        });

hoặc trong XML thêm vào phần Text View

Mã:

android:textSize="50px"

Tham khảo từ: VietAndroid.

Các bài viết liên quan:
Tích Hợp Android Vào Eclipse

NotePad Exercise 1

Trong bài tập này, bạn sẽ construct một notes list đơn giãn cho phép user thêm mới các notes nhưng không được edit chúng. Trong bài này, chúng ta sẽ làm hiểu các phần cơ bản sau:

• Cơ bản về ListActivity, tạo và xử lý menu options.
• Sử dụng SQLite database để lưu trữ các notes.
• Bind dữ liệu từ một database cursor vào một ListView sử dụng một SimpleCursorAdapter.
• Cơ bản về screen layout (layout một list view), thêm các item vào activity menu, và cách thức activity xử lý các selection cho menu.

Trước khi bắt đầu, bạn vào đây để download bài tập có chứa NotepadCodeLab.

I.Step 1

• B1.Trong Eclipse, click vào File->New->Android Project.
• B2.Chọn Create project from existing source.
• B3.Click Browse và navigate đến nơi có chứa thư mục NotepadCodeLab và chọn Notepadv1.
• B4.Click Finish.

II.Step 2

• Sau khi tạo project Notepadv1, bạn sẽ thấy lớp NotesDbAdapter – lớp này được cung cấp để đóng gói dữ liệu truy cập vào SQLite database mà sẽ nắm giữ các notes data và cho phép bạn cập nhật nó.
• Ở phía trên của lớp là một số định nghĩa constant sẽ được sử dụng trong ứng dụng để tìm kiếm dữ liệu từ các tên trường thích hợp trong database.
• Tên của database là “data” và tên của table là “notes” gồm có 3 field: _id, title và body.
• Constructor của NotesDbAdapter có chứa một Context, cho phép nó giao tiếp với các khía cạnh của OS Android. Lớp Activity implement lớp Context, vì vậy bạn thường sẽ sử dụng từ khóa “this” từ Activity, khi cần một Context.
• Phương thức open() gọi một thể hiện của lớp DatabaseHelper (lớp này được cài đặt cục bộ trong lớp NotesDbAdapter và kết thừa từ SQLiteOpenHelper). Nó gọi getWritableDatabase() để xử lý việc tạo và mở database cho bạn.
• Phương thức createNote() có chứa các string cho title và body của một note mới, sau đó tạo note đó trong database. Giả sử note mới được tạo ra thành công, phương thức này cũng trả về giá trị _id cho note mới được tạo ra.
• Phương thức deleteNote() có chứa một rowId cho một note cụ thể, và xóa note đó từ database.
• Phương thức fetchAllNote() thực hiện truy vấn và trả về một Cursor cho tất cả các note trong database, đó là nó gọi phương thức query(). Trong phương thức query(), tham số đầu tiên là tên của database table để truy vấn (trong ví dụ này, DATABASE_TABLE là “notes”), tham số tiếp theo là danh sách các column mà bạn muốn trả về, trong ví dụ này đó là các column: _id, title, và body, vì vậy chúng được xác định là một mảng String. Các tham số thiếp theo lần lượt là: selection, selectionArgs, groupBy, having và orderBy; giá trị của having bằng null, có nghĩa là bạn muốn tất cả data, không cần group chúng và có thứ tự mặc định. Xem thêm SQLiteDatabase.
• Lưu ý: Một Cursor được trả về chứ không phải là một collection của các row. Điều này cho phép Android sử dụng các resource một cách hiệu quả – thay vì put các dữ liệu trực tiếp vào bộ nhớ, con trỏ sẽ retrieve và release dữ liệu khi cần thiết, điều này hiệu quả hơn nhiều việc sử dụng các table có chứa nhiều row.
• Phương thức fetchNote() tương tự như fetchAllNote() nhưng chỉ nhận một note với rowId.
• Cuối cùng, phương thức updateNote() có chứa rowId, title và body, và sử dụng một thể hiện của ContentValues để cập nhật note của rowId cho trước.

III.Step 3

Mở file notepad_list.xml trong thư mục “res/layout”, dưới đây là một số điều bạn nên biết về file layout này:

• Tất cả các file layout trong Android đều bắt đầu với dòng XML header:

• Dòng tiếp theo thường là một định nghĩa layout, trong ví dụ này là LinearLayout.
• Namespace XML của Android luôn luôn được định nghĩa tại top level của component hay layout trong XML để các tags “android:” có thể được sử dụng thông qua phần còn lại của file.

IV.Step 4

Bây giờ, bạn cần tạo ra layout để nắm giữ list. Thêm đoạn mã sau vào bên trong phần tử LinearLayout như sau:

• Biểu tượng @ trong id strings của các tag ListView và TextView có nghĩa là XML parser nên parse và expand phần còn lại của id string và sử dụng một ID resource.
• ListView và TextView có thể được xem như là hai view khác nhau, chỉ một trong số đó sẽ được hiển thị tại một thời điểm. ListView sẽ được sử dụng khi có các notes được hiển thị, trong khi TextView (trong đó có một giá trị mặc ​​định là “No Notes Yet!” được định nghĩa như là một string resource trong res/values/strings.xml) sẽ được hiển thị nếu không có bất kỳ note nào để hiển thị.
  Các ID list và empty được cung cấp cho bạn bằng Android platform, vì vậy, chúng ta phải prefix id với android: (ví dụ, @android:id/list).
  View với id empty được sử dụng tự động khi ListAdapter không có dữ liệu cho ListView. Ngoài ra, bạn có thể thay view empty mặc định bằng cách sử dụng setEmptyView(View) trên ListView.
• Nói rộng ra, lớp android.R là một tập hợp các resource được định nghĩa trước cung cấp cho bạn bởi platform, trong khi lớp R của project của bạn là tập hợp các resource project của bạn đã được định nghĩa. Các resource có trong lớp resource android.R có thể được sử dụng trong các file XML bằng cách sử dụng prefix name space “android:” (như chúng ta thấy ở đây).

V.Step 5

Để tạo ra danh sách các notes trong ListView, bạn cần định nghĩa một View cho một row:

B1.Tạo một layout resource mới “notes_row.xml” trong thư mục “res/layout”.

B2.Thêm các nội dung sau đây file vừa tạo:

• Đây là View được sử dụng để hiển thị mỗi notes title row – chỉ có một text field bên trong nó.
• Trong trường hợp này, bạn tạo ra một id mới gọi là text1. Dấu “+” sau “@” trong id string cho biết rằng id nên được tạo ra tự động như là một resource nếu nó không tồn tại, vì vậy chúng ta định nghĩa nó để sử dụng.

B3.Lưu file.

Mở lớp R.java trong project của bạn, bạn sẽ thấy các định nghĩa mới cho notes_row và text1, có nghĩa là bây giờ chúng ta có thể truy cập vào chúng trong code.

VI.Step 6

• Tiếp theo, mở lớp Notepadv1. Trong bước này, bạn sẽ sửa đổi nó để trở thành một list adapter và hiển thị các notes, đồng thời cho phép thêm note mới.
• Notepadv1 kế thừa từ một lớp con của Activity, đó là ListActivity, trong đó có chức năng bổ sung cho phù hợp với loại công việc mà bạn có thể muốn làm việc trên một list, ví dụ: hiển thị các list item  trong các row lên màn hình, di chuyển qua lại giữa các list item, và cho phép lựa chọn trên chúng.
• Trong lớp này, có một biến mNoteNumber được sử dụng để tạo ra các note title được đánh số (numbered). Đồng thời, chúng có 3 phương thức sẽ được override sau đây:
  • onCreate() được gọi khi activity được start, nó được sử dụng để thiết lập (set up) các resource và state cho activity khi nó đang chạy.
  • onCreateOptionsMenu() được sử dụng để populate menu cho Activity. Menu sẽ được hiển thị khi user nhấn phím MENU trên thiết bị, nó có một danh sách các option để user có thể chọn.
  • onOptionsItemSelected() được sử dụng để xử lý các sự kiện phát sinh khi user chọn một item trong Menu.

VII.Step 7

• Thay đổi lớp Notepadv1 kế thừa ListActivity thay vì Activity.

• Lưu ý: Bạn sẽ phải import ListActivity vào Notepadv1 sử dụng Eclipse, nhấn tổ hợp phím ctrl-shift-O trên Windows hay Linux, hay cmd-shift-O trên Mac.

VIII.Step 8

Cài đặt phương thức onCreate().

Ở đây bạn sẽ cài đặt title cho Activity (hiển thị ở top của màn hình), sử dụng layout “notepad_list” mà bạn đã tạo ra trước đó, thiết lập một thể hiện của NotesDbAdapter để truy cập dữ liệu note, và populate danh sách với các note title sẵn có:

• B1.Trong phương thức onCreate(), gọi super.onCreate() với tham số saveInstanceState.
• B2.Gọi setContentView() và gán R.layout.notepad_list.
• B3.Tại top của lớp, tạo một biến lớp private mới mDbHelper của lớp NotesDbAdapter.
• B4.Trở lại phương thức onCreate(), tạo ra một đối tượng mới NotesDbAdapter và gán nó cho trường mDbHelper.
• B5.Gọi phương thức open() trên mDbHelper để mở (hay tạo mới) database.
• B6.Cuối cùng, tạo mới một phương thức fillData() để nhận dữ liệu và populate ListView sử dụng helper – chúng ta vẫn chưa định nghĩa phương thức này.

Phương thức onCreate() sẽ trông như sau:

Và đảm bảo rằng, bạn đã khai báo mDbHelper:

IX.Step 9

Cài đặt phương thức onCreateOptionsMenu().

Bây giờ, bạn sẽ tạo button “Add item” được truy cập bằng cách nhấn menu button trên thiết bị. Và chúng ta xác định rằng nó chiếm vị trí đầu tiên trong Menu.

• B1.Trong resource “strings.xml” (trong thư mục “res/values”), và thêm một string mới được đặt tên “menu_insert” với giá trị của nó là “Add Item”.

• Sau đó lưu file và trở về Notepadv1.
• B2.Tạo một hằng menu position tại top của lớp:

• B3.Trong phương thức onCreateOptionsMenu(), khai báo một biến cục bộ result kiểu boolean và gán cho super.onCreateOptionsMenu().
• B4.Sau đó, thêm menu item với phương thức add().

• Bây giờ phương thức onCreateOptionsMenu() trông như sau:

• Các đối số được gán vào trong phương thức add() cho biết: một group identifier, một unique ID, thứ tự của item và resource của string để sử dụng cho item.

X.Step 10

Cài đặt phương thức onOptionsItemSelected().

Trong phần này, chúng ta sẽ xử lý menu item “Add Note”. Khi item này trên Menu được chọn, phương thức onOptionsItemSelected() sẽ được gọi với item.getId() thiết lập cho INSERT_ID (hằng mà bạn sử dụng để identify menu item).

• B1.Gọi super.onOptionsItemSelected() vào cuối phương thức này.
• B2.Viết một biểu thức “switch” dựa vào item.getId().

Phương thức onOptionsItemSelected() trông như sau:

XI.Step 11

Cài đặt phương thức createNote().

Trong phương thức này, bạn đơn giãn chỉ tạo một note mới với title được gán dựa trên một counter (ví dụ, “Note 1”, “Note 2”…) với một body trống.

• B1.Xây dựng name với “Note” và counter được định nghĩa trong lớp này:

• B2.Gọi mDbHelper.createNote() sử dụng noteName làm title và “” làm body .
• B3.Gọi phương thức fillData() để populate danh sách các notes – phương thức này sẽ được tạo trong bước tiếp theo.

• Phương thức createNote() trông như sau:

XII.Step 12

• Định nghĩa và cài đặt phương thức fillData().
• Phương thức này sử dụng SimpleCursorAdapter và một Cursor để bind nó vào các field được cung cấp trong layout. Các field này định nghĩa các phần tử row của list (trong ví dụ này, field text1 trong layout “notes_row.xml”).
• Để làm điều này bạn phải cung cấp một mapping từ field title trong Cursor trả về đến text1, mà được thực hiện bằng cách định nghĩa hai mảng: đầu tiên là một mảng string với danh sách các column cho map (trong ví dụ này là “title”, từ constant NotesDbAdapter.KEY_TITLE) và, thứ hai là một mảng int có chứa các tham chiếu đến các view để bạn bind dữ liệu vào (R.id.text1).

Sau đây là những gì mà chúng ta đã thực hiện:

• B1.Sau khi nhận được Cursor từ mDbHelper.fetchAllNotes(), chúng ta sử dụng phương thức startManagingCursor() của Activity để cho phép Android quan tâm đến lifecycle của Cursor thay vì chúng ta lo lắng về điều đó (chúng ta sẽ thảo luận vấn đề này trong bài tập 3, nhưng bây giờ chỉ biết rằng điều này cho phép Android làm một số công việc quản lý resource cho bạn).
• B2.Sau đó chúng ta tạo ra một mảng string, trong đó khai báo các column mà chúng ta muốn (trong ví dụ này, chỉ có title), và một mảng int định nghĩa các View mà chúng ta muốn bind các column.
• B3.Bước tiếp theo là khởi tạo SimpleCursorAdapter. Giống như nhiều lớp trong Android, SimpleCursorAdapter cần một Context để thực hiện các công việc của nó, vì vậy chúng ta gán “this” cho context (các lớp con của Activity thực thi Context). Chúng ta gán View “notes_row” đã tạo ra trước đó để làm chỗ chứa (receptable) cho dữ liệu, Cursor mà chúng ta vừa tạo ra và các mảng.

Trong tương lai, hãy nhớ rằng việc mapping từ các column và các resource được thực hiện bằng cách sử dụng thứ tự của hai mảng một cách tương ứng. Nếu bạn đã có nhiều column để bind, và nhiều View để bind chúng vào, bạn sẽ xác định chúng theo thứ tự, ví dụ bạn có thể sử dụng {NotesDbAdapter.KEY_TITLE, NotesDbAdapter.KEY_BODY} và {R.id.text1, R. id.text2} để bind hai field vào row (và cũng cần phải định nghĩa text2 trong notes_row.xml, cho body text). Đây là cách mà bạn có thể bind các field vào một row đơn (và có được một custom row layout).

XIII.Step 13

• Chạy ứng dụng.

Link tham khảo: http://developer.android.com/resources/tutorials/notepad/notepad-ex1.html.

1.Download Android SDK

Android SDK thực chất là tập hợp các công cụ và thư viện để phát triển các ứng dụng trên nền tảng hệ điều hành Android.

B1: Vào trang http://developer.android.com/sdk/index.html để tải Android SDK Starter. Tùy thuộc vào hệ điều hành mà bạn chọn bản Mac, Linux hay Window. Ở đây mình chọn tải bản cho Window.

B2: Giải nén file zip bạn vừa tải về. Chạy SDK Setup.exe. Bạn có thể gặp thông báo lỗi Fetching https://dl-sl… Failed to fetch… Close thông báo này lại. Tiếp theo cửa sổ Choose Packages to Install xuất hiện. Nếu cửa sổ này trống rỗng -> Cancel.

-> Quay về cửa sổ Android SDK and AVD manager -> Chọn Setting, đánh dấu vào ô Force https://...

-> Chọn Available Packages.

B3: Đánh dấu các Packages bạn muốn tải: Documents chính là phần Javadoc mô tả hoạt động của các phương thức và các lớp (phần này chắc chắn không thể thiếu rồi), Sample là các đoạn code mẫu, SDK Platform ứng với các phiên bản hệ điều hành (2.2 – API level 8, 2.1 – API level 7,…), và Google API để phát triển các phần mềm liên quan đến dịch vụ của Google (như Google Map nếu bạn muốn lập trình liên quan đến GPS).
Các bạn có thể tải hết nếu thích, còn muốn tối ưu thì có thể đánh dấu như mình (lưu ý USB drivers chỉ dành cho người sử dụng Windows và muốn phát triển ứng dụng test bằng điện thoại thật).

->    Install Selected

->   Install

->    Cửa sổ Install hiện ra

->    Ngồi chờ (>_<)

2.Tích hợp Android SDK vào Eclipse

B1: Tải Eclipse nếu bạn chưa có. Mọi người có thể phân vân không biết tải bản nào cho phù hợp, nhưng theo ý kiến của mình thì có thể dùng 1 trong 2 bản sau: Eclipse for Java Developers, hoặc Eclipse for Java and Report Developers (mình dùng bản sau).

B2: Khởi chạy Eclipse, vào Help -> Install new softwares.
Chọn Add, gõ vào ô Name tên bạn muốn và Location gõ vào địa chỉ để tải về ADT.

HTML code:

https://dl-ssl.google.com/android/eclipse/

Hoặc:

http://dl-ssl.google.com/android/eclipse/

Nếu https không hoạt động. Ngoài ra bạn cũng có thể tải thẳng ADT về máy theo link http://dl.google.com/android/ADT-0.9.7.zip (bản mới nhất 0.9.7 ứng với Android 2.2), chọn Archive và browse tới file này (lưu ý không giải nén)
-> OK
-> Check vào phần dưới ô Name (sẽ hiện ra dòng Developer Tools).

B3: Next, next, Accept, next,…Finish (như Install mọi chương trình bình thường).

B4: Eclipse -> Windows -> Preferences -> Android
Nhấn nút Browse và chỉnh đường dẫn tới thư mục của Android SDK bạn tải lúc trước.
-> Apply
-> OK

3.Android Virtual Device(Emulator)

AVD là máy ảo cho developer phát triển ứng dụng. Để tạo 1 AVD bạn vào Windows -> Android SDK and AVD Manager -> Virtual Devices chọn New.
-> Cửa sổ Create new AVD hiện ra, bạn điền thông tin cho AVD bạn muốn:

Name: Tùy ý (nhưng chỉ được sử dụng các ký tự “a-z”, “A-Z”, “.-_”, nghĩa là cả khoảng trắng cũng ko đc).
Target: Chọn phiên bản hệ điều hành bạn muốn (thường mình tạo một Android 1.6 và một Android 2.2 để test).

SD Card: gõ vào Size SD card ảo cho AVD, hoặc chỉnh tới file đã có sẵn. Nhiều AVD có thể dùng chung 1 Sdcard (chỉ cần tạo lần đầu, các lần sau chỉnh đường dẫn tới file đó).

Skin: có thể để Default (HVGA) hoặc chọn kích cỡ màn hình bạn muốn. Chỉ cần quan tâm tới 3 option: HVGA (phân giải 320-480 như G1, G2, i5700…), QVGA (240-320 như HTC Wildfire…), WVGA854 (480-854 như Milestone, NexusOne…)
-> Create AVD.

II.Một Số Chức Năng Cần Thiết Khi Lập Trình Android Với Eclipse

Những điều mình nêu ra dưới đây đều là cơ bản, có thể các pro đã biết hết rồi, nhưng như mình đã nói, bài này là dành cho newbie với hi vọng gia tăng kiến thức cơ bản cùng giảm thời gian tìm kiếm cho các bạn.

1.Debug cho ứng dụng Android

Nhiều người chuyển từ J2SE hoặc J2ME sang Android sẽ ngạc nhiên vì câu lệnh debug kinh điển System.out.println() không còn in ra trên cửa sổ Console nữa. Google đã thay thế nó bằng Logcat, một cửa sổ ghi lại toàn bộ hoạt động của hệ điều hành. Để mở Logcat, trước tiên các bạn chọn Window -> Open Perspective -> Debug. Nếu ko thấy option Debug thì chọn Other và tìm Debug trong cửa sổ mới hiện ra. Sau đó chọn tab Debug mới xuất hiện ở góc trên bên phải của Eclipse (xem hình). Theo kinh nghiệm của mình thì tốt nhất là Maximize Logcat ra luôn cho dễ quan sát.

Cảm nhận ngày xưa khi mới sử dụng Logcat là rối và khó dùng. Nhưng càng về sau mình càng quen và thấy nó tiện hơn Console nhiều, vì Console chỉ đưa ra thông báo do chúng ta gọi, còn Logcat thì đưa cả luôn những thông báo của hệ điều hành, giúp chúng ta nắm được hệ điều hành đang làm gì, gọi đến cái gì, khởi chạy những gì…

2.File Explore Của Android

File Explorer là một chức năng hữu ích Google đưa vào giúp chúng ta quản lý file trong sd card và cả file system data (chỉ quản lý được của emulator, không thể truy nhập system data của thiết bị thật). FE giúp bạn dễ dàng đưa file vào / lấy file ra trong sdcard ảo của emulator, xóa cơ sở dữ liệu của chương trình để khởi tạo lại (only emulator)…

Mở FE bằng cách vào Window -> Show View -> Others -> Android -> File Explorer. Mình để FE trong cửa sổ Debug cho tiện quản lý.

3.Device của Android

Device cũng là một chức năng hữu ích nữa trong Android giúp bạn quản lý thiết bị ảo cũng như thật của mình. Mở Device bằng cách vào Window -> Show View -> Device hoặc vào Window -> Show View -> Others -> Android -> Device.

Chức năng mình thường sử dụng nhất của device là Screen Capture, cực kỳ tiện để lấy ảnh minh họa làm thuyết trình hoặc giới thiệu trên Google Market.

III.Một Số Thủ Thuật Trong Android Và Eclipse

1.Hiển thị tiếng Việt

Window -> Preferences -> General -> Workspace.

Trong Workspace phần Text File Encoding chọn Other -> UTF-8.

2.Tự động sổ code

Tổ hợp phím kinh điển Ctrl + Space (điều kỳ lạ là khá nhiều người không biết).

3.Comment

Ctrl + “/”: tự động thêm cụm “//” vào đầu dòng (ko tiện lắm).
Ctrl + Shift + “/”: tự động thêm “/* */” vào cụm được bôi đen.
Ctrl + Shift + “\”: tự động bỏ “/* */” vào cụm được bôi đen.

4.Override

Đôi lúc bạn muốn Override phương thức của một lớp có sẵn, ko lẽ chúng ta sẽ đi tìm tên phương thức trên mạng và gõ đúng lại như thế? Nhiều bạn đã gặp lỗi khi định viết lại phương thức này và debug mãi ko ra (vì nó ko phải là lỗi).
Mã:

@Override

        public boolean onCreateOptionsMenu(Menu menu) {

               

        }

đơn giản vì gõ thiếu chữ s.
Eclipse cung cấp phương tiện giúp ta ghi đè phương thức của lớp cha với Source -> Override/Implement Method, nhưng cực kỳ nhiều người không biết.

Tham khảo từ http://diendan.vietandroid.com/ca-c-ba-i-ha-c-ca-ka-m-ma-ngua-n/1192-hae-ng-da-n-la-p-tra-nh-cae-ba-n-va-i-android-ba-i-0-a.html.

II.       Xử Lý Tương Tác Người Dùng

Trong ví dụ trên, bạn có thể di chuyển focus giữa các Field, nhập dữ liệu cho TextField, thay đổi giá trị cho ObjectChoiceField, hay đánh dấu chọn cho CheckBox…Tuy nhiên, khi click vào các Button thì vẫn chưa có tương tác gì. Trong mục này, chúng ta sẽ xử lý tiếp các sự kiện trên Button.

1.     Xử lý các sự kiện UI

Blackberry API sử dụng observer pattern để gửi đi (dispatch) các sự kiện. Tất cả các Field có thể đăng ký một listener cho chúng, và listener này được thông báo khi có sự thay đổi sự kiện được phát sinh.

• Đối với ButtonField, một event được phát sinh khi button được click bởi trackball hay touch (màn hình touch), hay phím Enter được nhấn khi button được highlight.
• Đối với CheckboxField, một event được phát sinh khi checkbox được check hay uncheck.
• Đối với ChoiceField, một event được phát sinh khi người dùng lựa chọn một choice khác.

Để đăng khi listener cho Field, sử dụng phương thức Field.setChangeListener().

Lưu ý Blackberry cung cấp một mô hình sự kiện unicast, đó là chỉ có nhiều nhất một change listener cho một Field. Nếu sử dụng Field.setChangeListener(), tức là bạn đã thay thế cho listener đã tồn tại trước đó trong Field, ngăn cản nó nhận các sự kiện.

Một listener phải thực thi một giao diện FieldChangeListener. Trong ví dụ này, chúng ta sẽ để UiFunMainScreen thực thi giao diện net.rim.device.api.ui.FieldChangeListener, trong phương thức này có một phương thức fieldChanged() để xử lý các sự kiện phát sinh trên các Field, cụ thể như sau:

public class UiFunMainScreen extends MainScreen implements FieldChangeListener {

public void fieldChanged(Field field, int context) {

}

2.     Xử lý Clear Button

Đầu tiên, chúng ta sẽ đăng ký sự kiện cho Clear Button như sau:

clearButton.setChangeListener(this);

Sau đó, trong phương thức fieldChanged(), chúng ta xử lý xự kiện cho Clear button; trong ví dụ này mỗi lần người dùng nhấn vào Clear button, chúng ta sẽ xuất một hộp hội thoại thông báo người dùng đã nhấn vào Clear buttton:

public void fieldChanged(Field field, int context) {

if (field == clearButton) {

Dialog.inform(“Clear Button Pressed!”);

}

}

Đến lúc này, nếu bạn chạy ứng dụng và nhấn vào Clear, ứng dụng sẽ hiển thị như sau:

Nếu bạn muốn sử dụng Clear button để xóa chuỗi text trên usename và password, bạn xây dựng một phương thức clearTextField() như sau:

private void clearTextFields() {

usernameField.setText(“”);

passwordField.setText(“”);

}

Sau đó, trong phương thức fieldChanged(), gọi phương thức clearTextField() như sau:

public void fieldChanged(Field field, int context) {

if (field == clearButton) {

clearTextFields();

}

}

3.     Xử lý Login button

Trong Login button , chúng ta kiểm tra nếu usename và password trống thì sẽ hiển thị một hộp thoại cảnh báo; ngược lại nếu chúng có dữ liệu thì chúng ta sẽ kích hoạt một màn hình mới để thông báo người dùng đã đăng nhập thành công.

3.1.                        Định nghĩa một màn hình mới

Trong mục này, chúng ta tạo ra một màn hình mới có tên LoginSuccessScreen, trong lớp này sẽ có 3 LabelField, label đầu tiên thông báo đã login thành công, 2 label còn lại hiển thị usename và domain.

package blog.mobilesprogramming.uifun;

import net.rim.device.api.ui.component.LabelField;

import net.rim.device.api.ui.container.MainScreen;

public class LoginSuccessScreen extends MainScreen {

public LoginSuccessScreen(String username, String domain) {

add(new LabelField(“Logged in!”));

add(new LabelField(“Username: ” + username));

add(new LabelField(“Domain: ” + domain));

}

}

3.2.                        Xây dựng phương thức login()

Chúng ta xây dựng phương thức login() để kiểm tra xem usename và password có trống hay không, nếu trống thì hiển thị một hộp hội thoại để cảnh báo; ngược lại thì hiển thị màn hình LoginSuccessScreen.
private void login() {

if (usernameField.getTextLength() == 0 || passwordField.getTextLength() == 0) {

Dialog.alert(“You must enter a username and password”);

}

else {

String username = usernameField.getText();

String selectedDomain =

(String)domainField.getChoice(domainField.getSelectedIndex());

LoginSuccessScreen loginSuccessScreen =

new LoginSuccessScreen(username, selectedDomain);

UiApplication.getUiApplication().pushScreen(loginSuccessScreen);

}

}

Tiếp theo,trong phương thức fieldChanged() của lớp UiFunMainScreen, chúng ta gọi phương thức login():

public void fieldChanged(Field field, int context) {

if (field == clearButton) {

clearTextFields();

}

else if (field == loginButton) {

login();

}

}

Lưu ý Bạn phải đăng ký sự kiện cho Login button bằng cách gọi phương thức

loginButton.setChangeListener(this);
Bây giờ, nếu bạn chạy ứng dụng và nhấn vào Login button thì sẽ có giao diện như sau:

Code

III.       Tạo Menu

Trên các thiết bị di động, việc cung cấp menu options cho các chức năng chính sẽ giúp dễ dàng truy cập hơn là sử dụng các button trên màn hình. Màn hình chịu trách nhiệm xử lý việc hiển thị menu và các menu item để thực thi các chức năng cho ứng dụng.

1.     Menu item

• Các item trong menu là các thể hiện của lớp net.rim.device.api.ui.MenuItem. Lớp này là trừu tượng, và thực thi giao diện Runnable (nó có một phương thức run() mà bạn cần phải thực thi).
  Phương thức run() được thực thi trên event thread khi người dùng nhấp vào menu item, vì vậy bạn có thể thay đổi giao diện từ bên trong phương thức run() một cách an toàn. Điều này cũng có nghĩa là bạn không nên thực hiện các xử lý phép toán phức tạp hoặc kết nối mạng trong phương thức run(), thay vào đó bạn tạo một thread mới để thực hiện.
• Mỗi menu item đều có ba mẩu thông tin liên kết với nó: chuỗi text để hiển thị, một
  thứ tự ưu tiên thực hiện(priority), và vị trí của nó xuất hiện trong menu(ordinal). Priority xác định menu item được highlight khi menu  được xuất hiện lần đầu tiên trên màn hình; item có giá trị thấp nhất thì có quyền ưu tiên cao nhất. Ordinal xác định vị trí mà item sẽ xuất hiện trong menu. Một menu item có giá trị ordinal thấp hơn sẽ nằm gần top của menu. Hai menu item cùng giá trị ordinal sẽ xuất hiện theo thứ tự mà chúng được thêm vào menu, từ trên xuống dưới.

2.     Cài đặt menu item Clear và Login

Chúng ta sẽ cài đặt 2 menu item trong ứng dụng tương ứng với các acton Login và Clear. Chúng ta sẽ tạo mỗi lớp tương ứng với mỗi menu item và khai báo các lớp là lớp lồng của lớp UiFunMainScreen – bởi vì ta chỉ cần sử dụng chúng để truy cập vào các phương thức private login() và clearTextField().

public class UiFunMainScreen extends MainScreen implements FieldChangeListener {

class LoginMenuItem extends MenuItem {

public LoginMenuItem() {

super(“Login”, 20, 10);

}

public void run() {

login();

}

}

class ClearMenuItem extends MenuItem {

public ClearMenuItem() {

super(“Clear”, 10, 20);

}

public void run() {

clearTextFields();

}

}

}

Lưu ý ClearMenuItem có giá trị oridinal thấp hơn và giá trị priority cao hơn LoginMenuItem. Vì vậy, item Clear sẽ nằm phía trên Login trong menu, nhưng item Login sẽ được highlight theo mặc định.

Có vài nơi để chúng ta có thể thêm các menu item. Thứ nhất là trong constructor của Screen, bằng cách gọi phương thức getMenu() và thêm các item vào đối tượng Menu. Thứ hai là ta sẽ override phương thức makeMenu() trong lớp Screen. Trong ví dụ này chúng ta sẽ override phương thức makeMenu() trong lớp UiFunMainScreen như sau:

protected void makeMenu(Menu menu, int instance) {

super.makeMenu(menu, instance);

menu.add(new LoginMenuItem());

menu.add(new ClearMenuItem());

}

Tùy thuộc vào mục đích của ứng dụng mà chúng ta muốn giữ item Close mặc định mà MainScreen đã đã tự động thêm vào cho chúng ta. Nếu muốn giữ nó thì gọi phương thức super.makeMenu(); ngược lại thì không cần gọi phương thức này.

Lưu ý Như bạn thấy, ở ví dụ trên chúng ta khai báo các menu item dưới dạng các lớp kế thừa từ lớp MenuItem một cách tường minh; tuy nhiên có một cách viết khác cũng hay được sử dụng đó là khai báo các menu item như là các lớp nội bộ(inner) vô danh, sử dụng cách này thường code ngắn gọn hơn; vì vậy bạn có thể sử dụng một trong 2 cách đã được trình bày. Sau đây là kỹ thuật sử lý lớp inner vô danh:

protected void makeMenu(Menu menu, int instance) {

super.makeMenu(menu, instance);

menu.add(new MenuItem(“Login”, 20, 10) {

public void run() {

login();

}

});

menu.add(new MenuItem(“Clear”, 10, 20) {

public void run() {

clearTextFields();

}

});

}

3.     Các giá trị intance của Menu

Tham số instance trong phương thức makeMenu() được sử dụng để xác định menu mà chúng ta sẽ hiển thị. Các ứng dụng BlackBerry hiển thị một vài menu khác nhau tùy thuộc vào menu được hiển thị và context của màn hình và điều khiển. Có các loại instance như sau:

• Menu.INSTANCE_CONTEXT: menu được hiển thị bằng cách nhấp vào trackball. Thông thường, menu này là một tập hợp các item có sẵn trong menu mặc định được áp dụng đối với control đang được focus hoặc section của màn hình. Ví dụ, Close sẽ không hiển thị ở đây, thay vào đó BlackBerry sẽ tự động thêm một item Full Menu cho menu này, do tham số instance trong phương thức makeMenu() được gán giá trị INSTANCE_DEFAULT.
• Menu.INSTANCE_CONTEXT_SELECTION : intance này cũng tương tự như INSTANCE_CONTEXT, nhưng menu được hiển thị khi người dùng có lựa chọn một đoạn văn bản nào đó. Bạn có thể sử dụng instance này khi bạn có thể sao chép văn bản.
• Menu.INSTANCE_DEFAULT: Trong trường hợp này, menu được hiển thị bằng cách nhấn vào phím menu trên thiết bị. Menu này sẽ chứa tất cả các item trong context menu, item Close cũng được hiển thị ở đây.

Bạn thấy bài viết này thế nào?

Các bài liên quan:
Lập Trình Với Blackberry – Phần 1
Lập Trình Với Blackberry – Phần 2

Các API BlackBerry bao gồm một framework phong phú để xây dựng giao diện người dùng cho các ứng dụng. Trong bài này, chúng ta cùng tìm hiểu cách sử dụng các thành phần giao diện người dùng BlackBerry để xây dựng một ứng dụng với một vài màn hình và một số điều khiển để đáp ứng với input của người dùng.

I.       Các Thành Phần của Blackberry UI

Tất cả các phần tử trực quan(visible) có thể hiển thị trên màn hình của Blackberry là một trong 3 kiểu sau:

• Fields: Đây là các khối xây dựng cơ bản của các UI. Nói chung, mỗi control, như một button hoặc text field, sẽ tương ứng với một thể hiện của một Field. Lớp Field sẽ vẽ các điều khiển và xử lý input người dùng.
• Managers: Chúng được sử dụng để sắp xếp các Field trên màn hình. Mỗi Field chỉ được chứa trong một và chỉ một Manager. Mỗi Manager thực chất cũng là một Field(lớp này kế thừa từ Field), có nghĩa là mỗi manager có thể chứa các manager khác.
• Screens: Chỉ có một screen được active trên một ứng dụng tại mọi thời điểm. Screens xử lý layout của Field thông qua manager và cung cấp các chức năng bổ xung, như

Fields được dẫn xuất từ net.rim.device.api.ui.Field. Có rất nhiều Field dựng sẵn hữu ích trong gói net.rim.device.api.ui.component.

Managers được dẫn xuất từ gói net.rim.device.api.ui.Manager, nó kế thừa từ lớp net.rim.device.api.ui.Field. Một số manager hữu ích được định nghĩa trong gói net.rim.device.api.ui.container.

Sreens được dẫn xuất từ gói net.rim.device.api.ui.Screen, nó kế thừa từ lớp Manager. Có một số screen hữu ích trong gói net.rim.device.api.ui.container.

Lưu ý Mặc dù Screen kế thừa từ Field, nhưng bạn không thể thêm một Screen vào một Manager.

1.     Tạo ứng dụng

Giao diện mà chúng ta sẽ xây dựng như hình vẽ sau:

Bây giờ, ta tạo ra một project UiFun, sau đó tạo ra một package blog.mobileprogramming.uifun; tiếp theo tạo 2 lớp UiFunApplication và UiFunMainScreen.

package blog.mobileprogramming.uifun;

import net.rim.device.api.ui.UiApplication;

public class UiFunApplication extends UiApplication {

public UiFunApplication() {

UiFunMainScreen mainScreen = new UiFunMainScreen();

pushScreen(mainScreen);

}

public static void main(String[] args) {

UiFunApplication app = new UiFunApplication();

app.enterEventDispatcher();

}

}

package blog.mobileprogramming.uifun;

import net.rim.device.api.ui.container.MainScreen;

public class UiFunMainScreen extends MainScreen {

public UiFunMainScreen() {

}

}

2.     Thêm image Logo

Đầu tiên, ta thêm một thể hiện net.rim.device.api.ui.component.BitmapField thể show image lên đỉnh màn hình. Các thiết bị Blackberry có thể hiển thị các hình ảnh PNG, JPEG hay GIF, tuy nhiên hầu hết các ứng dụng sử dụng PNGs bởi chúng có kích thước nhỏ, chất lượng cao và hỗ trợ transparent.

3.     Thêm image vào Project

Nếu bạn sử dụng JDE Plugin for Eclipse, thêm image vào project Eclipse bằng cách tạo một folder “res” cùng cấp với folder “src”.

4.     Thêm image vào Screen

Tạo một thể hiện BitmapField để thêm vào Screen, trước khi tạo ra thể hiện này, tạo một đối tượng Bitmap         để load image từ resource của project.

Bitmap logoBitmap = Bitmap.getBitmapResource(“res/apress_log.png”);

Trong Constructor của lớp UiFunApplication, ta làm như sau:

package blog.mobileprogramming.uifun;

import net.rim.device.api.system.Bitmap;

import net.rim.device.api.ui.Field;

import net.rim.device.api.ui.component.BitmapField;

import net.rim.device.api.ui.container.MainScreen;

public class UiFunMainScreen extends MainScreen {

BitmapField bitmapField;

public UiFunMainScreen() {

Bitmap logoBitmap = Bitmap.getBitmapResource(“res/apress_logo.png”);

bitmapField = new BitmapField(logoBitmap, Field.FIELD_HCENTER);

add(bitmapField);

}

}

Bây giờ, nếu bạn chạy ứng dụng sẽ cho giao diện như sau:

5.     Style Flags của Field

Hầu như tất cả các Field và Manager đều có một constructor mà có chứa tham số style. Style được đánh dấu bởi các flags style, mỗi style sẽ được sử dụng kết hợp với nhau bởi toán tử “|”. Flags được định nghĩa trong API, mỗi style sẽ có tác động nhất định đến Field hoặc Manage, chẳng hạn như nó quy định vị trí, hành vi…

6.     Tạo các Field usename và password

Ta sẽ sử dụng lớp EditField  để thiết lập usename, PasswordEditField để thiết lập password. Chúng ta không cần sử dụng style đặc biệt cho các Field này.

EditField usernameField;

PasswordEditField passwordField;

…

usernameField = new EditField(“Username:”, “”);

passwordField = new PasswordEditField(“Password:”, “”);

add(usernameField);

add(passwordField);

7.     Tạo Domain và CheckBox field

Tạo domain nên sử dụng drop-down list, trong Blackberry API, một giao diện net.rim.device.api.ui.component.ChoiceField sử dụng tương tự như một drop-down list. Bạn có thể thực thi gian diện này một cách trực tiếp, nhưng trong ví dụ này, ta chỉ sử dụng một component thực thi giao diện này, đó là net.rim.device.api.ui.component.

ObjectChoiceField, nếu bạn muốn list các số, sử dụng net.rim.device.api.ui.component.

NumericChoiceField để thay thế.

ObjectChoiceField domainField;

CheckboxField rememberCheckbox;

…

domainField = new ObjectChoiceField(“Domain:”, new String[] {“Home”, “Work”});

add(domainField);

rememberCheckbox = new CheckboxField(“Remember password”, false);

add(rememberCheckbox);

8.     Tạo Button

Để tạo 2 button Clear và Login, ta tạo ra 2 thể hiện từ lớp ButtonField, đồng thời gán vào style là ButtonField.CONSUME_CLICK. Nếu không sử dụng style này, thì sự kiện click sẽ được truyền vào Screen, một menu sẽ được bật lên khi người dùng click vào button, mặc dù button vẫn làm cho action này thực hiện.
BitmapField bitmapField;

EditField usernameField;

clearButton = new ButtonField(“Clear”, ButtonField.CONSUME_CLICK);

loginButton = new ButtonField(“Login”, ButtonField.CONSUME_CLICK);

add(clearButton);

add(loginButton);

Tóm lại, code sau khi thêm các thành phần giao diện trong lớp UiFunMainScreen như sau:

package blog.mobilesprogramming.uifun;

import net.rim.device.api.system.Bitmap;

import net.rim.device.api.ui.Field;

import net.rim.device.api.ui.component.BitmapField;

import net.rim.device.api.ui.component.ButtonField;

import net.rim.device.api.ui.component.CheckboxField;

import net.rim.device.api.ui.component.EditField;

import net.rim.device.api.ui.component.ObjectChoiceField;

import net.rim.device.api.ui.component.PasswordEditField;

import net.rim.device.api.ui.container.MainScreen;

public class UiFunMainScreen extends MainScreen {

BitmapField bitmapField;

EditField usernameField;

PasswordEditField passwordField;

ObjectChoiceField domainField;

CheckboxField rememberCheckbox;

ButtonField clearButton;

ButtonField loginButton;

public UiFunMainScreen() {

Bitmap logoBitmap = Bitmap.getBitmapResource(“res/apress_logo.png”);

bitmapField = new BitmapField(logoBitmap, Field.FIELD_HCENTER);

add(bitmapField);

usernameField = new EditField(“Username:”, “”);

passwordField = new PasswordEditField(“Password:”, “”);

add(usernameField);

add(passwordField);

domainField = new ObjectChoiceField(“Domain:”, new String[] { “Home”,”Work” });

add(domainField);

rememberCheckbox = new CheckboxField(“Remember password”, false);

add(rememberCheckbox);

clearButton = new ButtonField(“Clear”,ButtonField.CONSUME_CLICK);

loginButton = new ButtonField(“Login”,ButtonField.CONSUME_CLICK);

add(clearButton);

add(loginButton);

}

}

Bây giờ, nếu bạn chạy ứng dụng sẽ như hình vẽ sau:

9.     Sắp xếp các Button theo chiều ngang

Lớp UiFunMainScreen trong ví dụ này kế thừa từ MainScreen, nên nó có một trình quản lý layout mặc định là VerticalFieldManager để quản lý các Field. Khi thêm bất kỳ Field nào vào ứng dụng, trình quản lý này sẽ sắp xếp các Field theo chiều dọc. Tuy nhiên trong ví dụ này, ta muốn một số thành phần được sắp xếp theo chiều dọc, riêng các Button thì sẽ sắp xếp theo chiều ngang; để làm được như vậy, chúng ta sẽ sử dụng HorizonetalFieldManager với style là Field.FIELD_RIGHT(canh bên phải) để đẩy các Button vào màn hình.
HorizontalFieldManager buttonManager = new HorizontalFieldManager(Field.FIELD_RIGHT);

buttonManager.add(clearButton);

buttonManager.add(loginButton);

add(buttonManager);

Ngoài ra, ta sẽ sử dụng thêm một đối tượng SeparatorField để vẽ một thanh chắn ngang bên dưới image với các Field của ứng dụng.

Bitmap logoBitmap = Bitmap.getBitmapResource(“res/apress_logo.png”);

bitmapField = new BitmapField(logoBitmap, Field.FIELD_HCENTER);

add(bitmapField);

add(new SeparatorField());

add(new LabelField(“Please enter your credentials:”));

usernameField = new EditField(“Username:”, “”);

passwordField = new PasswordEditField(“Password:”, “”);

add(usernameField);

add(passwordField);

domainField = new ObjectChoiceField(“Domain:”, new String[] {“Home”, “Work”});

add(domainField);

rememberCheckbox = new CheckboxField(“Remember password:”, false);

add(rememberCheckbox);

add(new SeparatorField());

clearButton = new ButtonField(“Clear”, ButtonField.CONSUME_CLICK);

loginButton = new ButtonField(“Login”, ButtonField.CONSUME_CLICK);

HorizontalFieldManager buttonManager =

new HorizontalFieldManager(Field.FIELD_RIGHT);

buttonManager.add(clearButton);

buttonManager.add(loginButton);

add(buttonManager);

Bây giờ, nếu bạn chạy đoạn code trên, nó sẽ như hình vẽ sau:

Bạn thấy bài viết này thế nào?

Các bài liên quan:
Lập Trình Với Blackberry – Phần 1
Lập Trình Với Blackberry – Phần 3

Để thiết lập các kiểu MIME bổ xung cho Browser, bạn sử dụng gói net.rim.device.api.browser.plugin, cho phép các ứng dụng của bên thứ 3 đăng ký chúng với thư viện rendering như là một provider rendering cho các kiểu MIME không được browser trên thiết bị Blackberry hỗ trợ.

Lưu ý Phương thức BrowserFieldProviderRegistry.registry() sẽ ném ra một exception nếu bạn cố gắng đăng ký một kiểu MIME mà đã được thiết bị Blackberry hỗ trợ. Để nhận biết được danh sách các kiểu MIME được thiết bị Blackberry hỗ trợ, gọi phương thức RenderingSession.getSupportMimeType().

1.Đăng ký provider rendering cho một kiểu MIME

Để hỗ trợ các kiểu MIME bổ xung, kế thừa lớp abstract BrowserContentProvider. Để xác định các đặc tính hiển thị như: không có srollbar hay full màn hình, bạn thực thi giao diện BrowserPageContext. Thư viện rendering gọi phương thức BrowserContentProvider.accept() và BrowserContentProvider.getSupportedMimeTypes() để xác định các kiểu MIME cho provider rendering.

1.1.List danh sách các kiểu MIME chấp nhận

Cài đặt phương thức getAccept() và getSupportedMimeTypes() để list ra danh sách các các kiểu MIME mà provider có thể chấp nhận như là một tập hợp các tùy chọn rendering. Phương thức getAccept() xem xét các tùy chọn rendering được thiết lập.

Ví dụ 7:

public String[] getAccept(RenderingOptions context) {

// Return subset of getSupportedMimeTypes() if accept depends on rendering

// options. For example, HTML can be turned off in the rendering options.

// This would cause HTMLConverter to remove HTML MIME types.

return ACCEPT;

}

public String[] getSupportedMimeTypes() {

return ACCEPT;

}

1.2.Xác định các đặc tính hiển thị

Thực thi giao diện BrowserPageContext để xác định các đặc tính hiển thị. Nếu bạn không thực thi giao diện này, các giá trị mặc định sẽ được sử dụng.

Ví dụ 8:

public boolean getPropertyWithBooleanValue(int id, boolean defaultValue) {

// TODO Implement.

return false;

}

public int getPropertyWithIntValue(int id, int defaultValue) {

if (id == BrowserPageContext.DISPLAY_STYLE) {

// Turn off the scroll bar.

return BrowserPageContext.STYLE_NO_VERTICAL_SCROLLBAR;

}

return 0;

}

public Object getPropertyWithObjectValue(int id, Object defaultValue) {

// TODO Implement.

return null;

}

public String getPropertyWithStringValue(int id, String defaultValue) {

// TODO Implement.

return null;

}

1.3.Nhận một field để trình diễn nội dung

Cài đặt phương thức getBrowserContent().

Ví dụ 9:

public BrowserContent getBrowserContent( BrowserContentProviderContext context) throws RenderingException {

if (context == null) {

throw new RenderingException(“No Context is passed into Provider”);

}

BrowserContentBaseImpl browserContentBaseImpl = new

BrowserContentBaseImpl(context.getHttpConnection().getURL(), null,

context.getRenderingApplication(),

context.getRenderingSession().getRenderingOptions(), context.getFlags());

VerticalFieldManager vfm = new VerticalFieldManager(Manager.VERTICAL_SCROLL);

vfm.add(new LabelField(“Mime type: “) );

vfm.add(new LabelField(ACCEPT[0]));

vfm.add(new SeparatorField());

vfm.add(new LabelField(“Content of the resource file: \n”));

vfm.add(new SeparatorField());

try {

HttpConnection conn = context.getHttpConnection();

InputStream in = conn.openInputStream();

byte[] data = IOUtilities.streamToBytes(in);

vfm.add(new LabelField(new String(data)));

} catch (IOException e) {

// TODO Implement.

e.printStackTrace();

}

browserContentBaseImpl.setContent(vfm);

browserContentBaseImpl.setTitle(ACCEPT[0]);

// Set browser page context, this will tell the browser how to display this

// field.

browserContentBaseImpl.setBrowserPageContext(this);

return browserContentBaseImpl;

}

1.4.Đăng kí khi thiết bị Blackberry bắt đầu

Tạo một project library và thiết lập các thuộc tính của nó để auto-run khi bắt đầu. Trong phương thức libMain(String[] args) bạn cài đặt như sau:

public static void libMain( String[] args ) {

BrowserContentProviderRegistry converterRegistry =

BrowserContentProviderRegistry.getInstance();

if (converterRegistry != null) {

converterRegistry.register(new BrowserPlugin());

}

}

2.Ví dụ:

Ví dụ này gồm 3 file: BrowserFieldSampleApplication.java, Utilities.java và SecondaryResourceFetchThread.

package blog.mobilesprogramming;

import java.io.IOException;

import javax.microedition.io.HttpConnection;

import net.rim.device.api.browser.field.*;

import net.rim.device.api.io.http.HttpHeaders;

import net.rim.device.api.system.Application;

import net.rim.device.api.ui.*;

import net.rim.device.api.ui.component.Status;

import net.rim.device.api.ui.container.MainScreen;

/**

*

*/

final public class BrowserFieldSampleApplication extends UiApplication implements RenderingApplication {

private static final String REFERER = “referer”;

private RenderingSession _renderingSession;

private MainScreen _mainScreen;

private HttpConnection  _currentConnection;

/***************************************************************************

* Main.

**************************************************************************/

public static void main(String[] args) {

BrowserFieldSampleApplication app = new BrowserFieldSampleApplication();

app.enterEventDispatcher();

}

private BrowserFieldSampleApplication() {

_mainScreen = new MainScreen();

pushScreen(_mainScreen);

_renderingSession = RenderingSession.getNewInstance();

// enable javascript

//_renderingSession.getRenderingOptions().setProperty(RenderingOptions.CORE_OPTIONS_GUID, RenderingOptions.JAVASCRIPT_ENABLED, true);

PrimaryResourceFetchThread thread = new PrimaryResourceFetchThread(“http://www.google.com”, null, null, null, this);

thread.start();

}

public void processConnection(HttpConnection connection, Event e) {

// cancel previous request

if (_currentConnection != null) {

try {

_currentConnection.close();

} catch (IOException e1) {

}

}

_currentConnection = connection;

BrowserContent browserContent = null;

try {

browserContent = _renderingSession.getBrowserContent(connection, this, e);

if (browserContent != null) {

Field field = browserContent.getDisplayableContent();

if (field != null) {

synchronized (Application.getEventLock()) {

_mainScreen.deleteAll();

_mainScreen.add(field);

}

}

browserContent.finishLoading();

}

} catch (RenderingException re) {

} finally {

SecondaryResourceFetchThread.doneAddingImages();

}

}

/**

* @see net.rim.device.api.browser.RenderingApplication#eventOccurred(net.rim.device.api.browser.Event)

*/

public Object eventOccurred(Event event) {

int eventId = event.getUID();

switch (eventId) {

case Event.EVENT_URL_REQUESTED : {

UrlRequestedEvent urlRequestedEvent = (UrlRequestedEvent) event;

String absoluteUrl = urlRequestedEvent.getURL();

HttpConnection conn = null;

PrimaryResourceFetchThread thread = new PrimaryResourceFetchThread(urlRequestedEvent.getURL(),

urlRequestedEvent.getHeaders(),

urlRequestedEvent.getPostData(),

event, this);

thread.start();

break;

} case Event.EVENT_BROWSER_CONTENT_CHANGED: {

// browser field title might have changed update title

BrowserContentChangedEvent browserContentChangedEvent = (BrowserContentChangedEvent) event;

if (browserContentChangedEvent.getSource() instanceof BrowserContent) {

BrowserContent browserField = (BrowserContent) browserContentChangedEvent.getSource();

String newTitle = browserField.getTitle();

if (newTitle != null) {

_mainScreen.setTitle(newTitle);

}

}

break;

} case Event.EVENT_REDIRECT : {

RedirectEvent e = (RedirectEvent) event;

String referrer = e.getSourceURL();

switch (e.getType()) {

case RedirectEvent.TYPE_SINGLE_FRAME_REDIRECT :

// show redirect message

Application.getApplication().invokeAndWait(new Runnable() {

public void run() {

Status.show(“You are being redirected to a different page…”);

}

});

break;

case RedirectEvent.TYPE_JAVASCRIPT :

break;

case RedirectEvent.TYPE_META :

// MSIE and Mozilla don’t send a Referer for META Refresh.

referrer = null;

break;

case RedirectEvent.TYPE_300_REDIRECT :

// MSIE, Mozilla, and Opera all send the original

// request’s Referer as the Referer for the new

// request.

Object eventSource = e.getSource();

if (eventSource instanceof HttpConnection) {

referrer = ((HttpConnection)eventSource).getRequestProperty(REFERER);

}

break;

}

HttpHeaders requestHeaders = new HttpHeaders();

requestHeaders.setProperty(REFERER, referrer);

PrimaryResourceFetchThread thread = new PrimaryResourceFetchThread(e.getLocation(), requestHeaders,null, event, this);

thread.start();

break;

} case Event.EVENT_CLOSE :

// TODO: close the appication

break;

case Event.EVENT_SET_HEADER :        // no cache support

case Event.EVENT_SET_HTTP_COOKIE :   // no cookie support

case Event.EVENT_HISTORY :           // no history support

case Event.EVENT_EXECUTING_SCRIPT :  // no progress bar is supported

case Event.EVENT_FULL_WINDOW :       // no full window support

case Event.EVENT_STOP :              // no stop loading support

default :

}

return null;

}

/**

* @see net.rim.device.api.browser.RenderingApplication#getAvailableHeight(net.rim.device.api.browser.BrowserContent)

*/

public int getAvailableHeight(BrowserContent browserField) {

// field has full screen

return Graphics.getScreenHeight();

}

/**

* @see net.rim.device.api.browser.RenderingApplication#getAvailableWidth(net.rim.device.api.browser.BrowserContent)

*/

public int getAvailableWidth(BrowserContent browserField) {

// field has full screen

return Graphics.getScreenWidth();

}

/**

* @see net.rim.device.api.browser.RenderingApplication#getHistoryPosition(net.rim.device.api.browser.BrowserContent)

*/

public int getHistoryPosition(BrowserContent browserField) {

// no history support

return 0;

}

/**

* @see net.rim.device.api.browser.RenderingApplication#getHTTPCookie(java.lang.String)

*/

public String getHTTPCookie(String url) {

// no cookie support

return null;

}

/**

* @see net.rim.device.api.browser.RenderingApplication#getResource(net.rim.device.api.browser.RequestedResource,

*      net.rim.device.api.browser.BrowserContent)

*/

public HttpConnection getResource( RequestedResource resource, BrowserContent referrer) {

if (resource == null) {

return null;

}

// check if this is cache-only request

if (resource.isCacheOnly()) {

// no cache support

return null;

}

String url = resource.getUrl();

if (url == null) {

return null;

}

// if referrer is null we must return the connection

if (referrer == null) {

HttpConnection connection = Utilities.makeConnection(resource.getUrl(), resource.getRequestHeaders(), null);

return connection;

} else {

// if referrer is provided we can set up the connection on a separate thread

SecondaryResourceFetchThread.enqueue(resource, referrer);

}

return null;

}

/**

* @see net.rim.device.api.browser.RenderingApplication#invokeRunnable(java.lang.Runnable)

*/

public void invokeRunnable(Runnable runnable) {

(new Thread(runnable)).run();

}

}

class PrimaryResourceFetchThread extends Thread {

private BrowserFieldSampleApplication _application;

private Event _event;

private byte[] _postData;

private HttpHeaders _requestHeaders;

private String _url;

PrimaryResourceFetchThread(String url, HttpHeaders requestHeaders, byte[] postData,

Event event, BrowserFieldSampleApplication application) {

_url = url;

_requestHeaders = requestHeaders;

_postData = postData;

_application = application;

_event = event;

}

public void run() {

HttpConnection connection = Utilities.makeConnection(_url, _requestHeaders, _postData);

_application.processConnection(connection, _event);

}

}

package blog.mobilesprogramming;

import java.util.Vector;

import javax.microedition.io.HttpConnection;

import net.rim.device.api.browser.field.BrowserContent;

import net.rim.device.api.browser.field.RequestedResource;

/**

*

*/

class SecondaryResourceFetchThread extends Thread {

/**

* Callback browser field

*/

private BrowserContent    _browserField;

/**

* Images to retrieve

*/

private Vector            _imageQueue;

/**

* True is all images have been enqueued

*/

private boolean _done;

/**

* Sync object

*/

private static Object     _syncObject = new Object();

/**

* Secondary thread

*/

private static SecondaryResourceFetchThread _currentThread;

/**

* Enqueues secondary resource for a browser field.

*

* @param resource – resource to retrieve

* @param referrer – call back browsr field

*/

public static void enqueue(RequestedResource resource, BrowserContent referrer) {

if (resource == null) {

return;

}

synchronized( _syncObject ) {

// create new thread

if (_currentThread == null) {

_currentThread = new SecondaryResourceFetchThread();

_currentThread.start();

} else {

// if thread alread is running, check that we are adding images for the same browser field

if (referrer != _currentThread._browserField) {

synchronized( _currentThread._imageQueue) {

// if the request is for a different browser field,

// clear old elements

_currentThread._imageQueue.removeAllElements();

}

}

}

synchronized( _currentThread._imageQueue) {

_currentThread._imageQueue.addElement(resource);

}

_currentThread._browserField = referrer;

}

}

/**

* Constructor

*

*/

private SecondaryResourceFetchThread() {

_imageQueue = new Vector();

}

/**

* Indicate that all images have been enqueued for this browser field

*/

public static void doneAddingImages() {

synchronized( _syncObject ) {

if (_currentThread != null) {

_currentThread._done = true;

}

}

}

public void run() {

while (true) {

if (_done) {

// check if we are done requesting images

synchronized( _syncObject ) {

synchronized( _imageQueue ) {

if (_imageQueue.size() == 0) {

_currentThread = null;

break;

}

}

}

}

RequestedResource resource = null;

// request next image

synchronized( _imageQueue ) {

if (_imageQueue.size() > 0) {

resource = (RequestedResource)_imageQueue.elementAt(0);

_imageQueue.removeElementAt(0);

}

}

if (resource != null) {

HttpConnection connection = Utilities.makeConnection(resource.getUrl(), resource.getRequestHeaders(), null);

resource.setHttpConnection(connection);

// signal to the browser field that resource is ready

if (_browserField != null) {

_browserField.resourceReady(resource);

}

}

}

}

}

package blog.mobilesprogramming;

import java.io.IOException;

import java.io.OutputStream;

import javax.microedition.io.Connector;

import javax.microedition.io.HttpConnection;

import net.rim.device.api.io.http.HttpHeaders;

import net.rim.device.api.io.http.HttpProtocolConstants;

import net.rim.device.api.util.StringUtilities;

/**

*

*/

public class Utilities {

public static HttpConnection makeConnection(String url, HttpHeaders requestHeaders, byte[] postData) {

HttpConnection conn = null;

OutputStream out = null;

try {

conn = (HttpConnection) Connector.open(url);

if (requestHeaders != null) {

// From

// http://www.w3.org/Protocols/rfc2616/rfc2616-sec15.html#sec15.1.3

//

//     Clients SHOULD NOT include a Referer header

//     field in a (non-secure) HTTP request if the

//     referring page was transferred with a secure

//     protocol.

String referer = requestHeaders.getPropertyValue(“referer”);

boolean sendReferrer = true;

if (referer != null && StringUtilities.startsWithIgnoreCase(referer, “https:”) && !StringUtilities.startsWithIgnoreCase(url, “https:”)) {

sendReferrer = false;

}

int size = requestHeaders.size();

for (int i = 0; i < size;) {

String header = requestHeaders.getPropertyKey(i);

// remove referer header if needed

if ( !sendReferrer && header.equals(“referer”)) {

requestHeaders.removeProperty(i);

–size;

continue;

}

String value = requestHeaders.getPropertyValue( i++ );

if (value != null) {

conn.setRequestProperty( header, value);

}

}

}

if (postData == null) {

conn.setRequestMethod(HttpConnection.GET);

} else {

conn.setRequestMethod(HttpConnection.POST);

conn.setRequestProperty(

HttpProtocolConstants.HEADER_CONTENT_LENGTH,

String.valueOf(postData.length));

out = conn.openOutputStream();

out.write(postData);

}

} catch (IOException e1) {

} finally {

if (out != null) {

try {

out.close();

} catch (IOException e2) {

}

}

}

return conn;

}

}

Các bài liên quan:
Blackberry Browser API – Phần 1

II.Hiểu Thị Nội Dung Web Trên Browser

1.Nhận một Browser session

Để nhận một đối tượng BrowserSession mặc định, gọi phương thức tĩnh Browser.getDefaultSession(). Đối tượng  này cho phép bạn truy cập vào browser đang chạy trên thiết bị.

Lưu ý Việc nhận một default session sẽ override các session đang mở trong thiết bị Blackberry.

Để nhận một session khác, bạn chỉ cần gọi phương thức getSession(). Phương thức này lấy một bản ghi cầu hình dịch vụ trình duyệt theo ID duy nhất của nó(UID).

2.Yêu cầu một Web page

Để yêu cầu một web page, gọi phương thức BrowserSession.displayPage(). Ví dụ dưới đây sử dụng các phiên bản của displayPage() mà chỉ chấp nhận một URL. Để xác định một referrer, HTTP header, và post dữ liệu, sử dụng phiên bản chấp nhận các đối số bổ sung này.

Ví dụ 1:

private MenuItem browserItem = new MenuItem(_resources.getString(MENUITEM_BROWSER), 110, 12) {

public void run() {

synchronized(store) {

String websiteUrl = websitefield.getText();

if (websiteUrl.length == 0) {

Dialog.alert(_resources.getString(ALERT_NO_WEBSITE));

} else {

BrowserSession visit = Browser.getDefaultSession();

visit.displayPage(websiteUrl);

}

}

}

};

III.Hiển Thị Nội Dung Web Trong Một Browser Field

Để hiển thị nội dung web trong một browser field, sử dụng gọi net.rim.device.api.browser.field. Thư viện trình diễn browser xử lý việc rendering nội dung web cho field và sau đó trả về một BrowserField -  đây là field mà nội dung web được rendering vào ứng dụng để hiển thị.

Lưu ý Phiên làm việc đã được sử dụng để mở browser field phụ thuộc vào phiên làm việc mặc định của browser trên thiết bị Blackberry.

Giao diện RenderingApplication định nghĩa các chức năng gọi lại (callback) một session rendering để hỗ trợ xử lý các tài nguyên URL. Việc cài đặt các phương thức trong RenderingApplication nhằm hiển thị nội dung web trong một browser field.

1.Tạo một thread riêng biệt cho quá trình rendering

Để tránh làm cho ứng dụng bị treo trong khi ứng dụng nhận và hiển thị browser field, bạn nên thực hiện các hành động đó trong một thread riêng biệt.

Ví dụ 2: Tạo một thread riêng biệt

class CreationThread extends Thread {

BrowserFieldHandlerApplication _callBackApplication;

BasicRenderingApplication  _renderingApplication;

public CreationThread(BrowserFieldHandlerApplication callBackApplication) {

_callBackApplication = callBackApplication;

}

public void run() {

_renderingApplication = new BasicRenderingApplication(_callBackApplication);

BrowserField field = _renderingApplication.getBrowserField(“www.blackberry.com”);

_callBackApplication.displayBrowserField(field);

}

}

2.Thiết lập các tùy chọn Rendering

Override phương thức getRenderingOptions() để thiết lập các tùy chọn, nếu bạn không override phương thức này, các tùy chọn rendering mặc định sẽ được sử dụng.

3.Xử lý sự kiện

Cài đặt phương thức eventOccured() để xử lý các sự kiện, như là một URL request.

Ví dụ 3:

public Object eventOccurred(Event event) {

int eventId = event.getUID();

switch (eventId) {

case Event.EVENT_URL_REQUESTED : {

UrlRequestedEvent e = (UrlRequestedEvent) event;

// This is a regular request.

String absoluteUrl = e.getURL();

HttpConnection conn = null;

OutputStream out = null;

try {

conn = (HttpConnection) Connector.open(absoluteUrl);

FormData postData = e.getPostData();

if (postData == null) {

conn.setRequestMethod(HttpConnection.GET);

} else {

conn.setRequestMethod(HttpConnection.POST);

byte[] postBytes = postData.getBytes();

conn.setRequestProperty(

HttpProtocolConstants.HEADER_CONTENT_LENGTH,

String.valueOf(postBytes.length));

if (conn.getRequestProperty(

HttpProtocolConstants.HEADER_CONTENT_TYPE) == null) {

conn.setRequestProperty(

HttpProtocolConstants.HEADER_CONTENT_TYPE,

postData.getContentType());

}

out = conn.openOutputStream();

out.write(postBytes);

}

HttpHeaders requestHeaders = e.getHeaders();

if (requestHeaders != null) {

/* From http://www.w3.org/Protocols/rfc2616/rfc2616-

sec15.html#sec15.1.354

…

Clients SHOULD NOT include a Referer header field in a

(non-secure) HTTP request if the referring page was

transferred with a secure protocol.*/

String referer = requestHeaders.getPropertyValue(“referer”);

boolean sendReferrer = true;

if (referer != null && referer.startsWith(“https:”) && !absoluteUrl.startsWith(“https:”)) {

sendReferrer = false;

}

int size = requestHeaders.size();

for (int i = 0; i < size; i++) {

String header = requestHeaders.getPropertyKey(i);

// Remove refer header if needed.

if ( !sendReferrer && header.equals(“referer”)) {

equestHeaders.removeProperty(i);

continue;

}

conn.setRequestProperty( header,

requestHeaders.getPropertyValue( i ) );

}

}

} catch (IOException e1) {

} finally {

if (out != null) {

try {

out.close();

} catch (IOException e2) {}

}

}

BrowserField browserField = getBrowserField(conn, e);

_callbackApplication.displayBrowserField(browserField);

break;

}

case Event.EVENT_BROWSER_FIELD_CHANGED : {

// Browser field title might have changed. Update title.

break;

}

case Event.EVENT_REDIRECT : {

RedirectEvent e = (RedirectEvent) event;

switch (e.getType()) {

case RedirectEvent.TYPE_SINGLE_FRAME_REDIRECT :

// Show redirect message.

Application.getApplication().invokeAndWait(new Runnable() {

public void run() {

Status.show(“”);

}

});

break;

case RedirectEvent.TYPE_JAVASCRIPT :

case RedirectEvent.TYPE_META :

case RedirectEvent.TYPE_300_REDIRECT :

}

String absoluteUrl = e.getLocation();

HttpConnection conn = null;

try {

conn = (HttpConnection) Connector.open(absoluteUrl);

} catch (IOException e1) {

}

BrowserField browserField = getBrowserField(conn,

e.getOriginalEvent());

_callbackApplication.displayBrowserField(browserField);

break;

}

case Event.EVENT_CLOSE :

// Close the appication.

break;

case Event.EVENT_SET_HEADER :// no cache support

case Event.EVENT_SET_HTTP_COOKIE :   // no cookie support

case Event.EVENT_HISTORY :   // no history support

case Event.EVENT_LOADING_IMAGES :// no progress bar is supported

case Event.EVENT_EXECUTING_SCRIPT :  // no progress bar is supported

case Event.EVENT_FULL_WINDOW :   // no full window support

case Event.EVENT_STOP :  // no stop loading support

default :

}

return null;

}

4.Nhận nội dung browser để rendering

Cài đặt phương thức getBrowserField() để nhận nội dung browser để rendering. Phương thức getBrowserField() gọi phương thức RenderingSession.getBrowserField() để nhận một browser field, ứng dụng không thể khởi tạo browser field một cách trực tiếp.

Ví dụ 4:

public BrowserField getBrowserField (String absoluteUrl) {

HttpConnection conn = null;

try {

conn = (HttpConnection) Connector.open(absoluteUrl);

// Set transcode to true.

conn.setRequestProperty( “x-rim-transcode-content”, “*/*” );

} catch (IOException e1) {

}

return getBrowserField(conn, null);

}

private BrowserField getBrowserField(HttpConnection conn, Event e) {

BrowserField field = null;

try {

field = _renderingSession.getBrowserField(conn, this, e);

} catch (RenderingException re) {

return null;

}

// Add to the event queue a thread that invokes finishLoading().

Application.getApplication().invokeLater(new RenderingThread(field));

return field;

}

5.Rendering browser field

Gọi phương thức finishLoading(). Trong ví dụ trên, BrowserField.getBrowserField() chạy phương thức finishLoading() bằng cách thêm một thread mới vào event queue của ứng dụng.

Lưu ý Các file HTML sẽ hiển thị một blank field cho đến khi bạn gọi phương thức BrowserField.finishLoading(). Các file WML hay các image có thể được load trước khi phương thức này được gọi. Chạy phương thức finishLoading() trên một thread mới để UI không bị khóa.

Ví dụ 5:

class RenderingThread implements Runnable {

BrowserField _browserField;

RenderingThread(BrowserField field) {

_browserField = field;

}

public void run() {

try {

_browserField.finishLoading();

} catch (RenderingException e) {

// Handle exception.

}

}

}

6.Hiển thị BrowserField

Cài đặt phương thức displayBrowserField() bằng cách xóa nội dung cũ và thêm browser field vào màn hình.

Ví dụ 6:

public void displayBrowserField(BrowserField browserField) {

synchronized (Application.getEventLock()) {

_vfm.deleteAll();

_vfm.add(browserField);

}

}

Các bài liên quan:
Blackberry Bbrowser API – Phần 2

Chúc các bạn thành công!