SlideShare a Scribd company logo
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/andro
id"
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>
B6:Trong thư mục values, tạo file colors.xml (chuột phải vào thư mục, chọn New -
> Android XML File, và lưu ý chữ s, không phải là color.xml). Gõ nội dung cho
file như sau:
Mã:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="text_color">#ff3300</color>
</resources>
OK, vậy là bạn đã tạo một màu mới cho dòng chữ sẽ được hiển thị trong Text
View (ff3300 là mã hexa của màu đỏ). Thực chất bạn hoàn toàn có thể gõ thẳng
Mã:
android:textColor="#ff3300"
trong file main.xml mà không cần tạo mới file colors.xml, nhưng mục đích của
XML trong Android chính là để hỗ trợ nâng cấp chỉnh sửa dễ dàng. Nếu sau này
bạn muốn sửa màu của dòng text thì chỉ cần vào colors.xml thay đổi thay vì mò
mẫm trong main.xml (có thể rất dài nếu giao diện phức tạp).
Các thành phần trên mới chỉ là các phần cơ bản của XML. Ngoài ra các bạn có thể
khai báo thêm về Animation, Style và Theme (phức tạp hơn nhiều nên mình không
giới thiệu trong phần cơ bản này).
B7: Vậy là chúng ta đã hoàn thiện phần giao diện với XML, giờ đến viết code để
xử lý các sự kiện cho các thành phần:
=> 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;
}
}
});
}
}

More Related Content

PDF
Laptrinh webaspvoitiengvietunicode
PDF
Bài 3 CÁC PHẦN MỀM ỨNG DỤNG CƠ BẢN
PDF
Giaotrinh vb
PDF
Chuong vb.net
PDF
Bài 2: Hướng dẫn làm việc với các điều khiển - Giáo trình FPT - Có ví dụ kèm ...
PDF
Bài 1 - Làm quen với C# - Lập trình winform
PDF
BÀI 2: Thiết kế FORM và xử lý sự kiện - Giáo trình FPT
PDF
Quy tắc thiết kế giao diện và viết code C#
Laptrinh webaspvoitiengvietunicode
Bài 3 CÁC PHẦN MỀM ỨNG DỤNG CƠ BẢN
Giaotrinh vb
Chuong vb.net
Bài 2: Hướng dẫn làm việc với các điều khiển - Giáo trình FPT - Có ví dụ kèm ...
Bài 1 - Làm quen với C# - Lập trình winform
BÀI 2: Thiết kế FORM và xử lý sự kiện - Giáo trình FPT
Quy tắc thiết kế giao diện và viết code C#

What's hot (20)

PDF
Giáo trình hướng dãn sử dụng Microsoft Word 2013
PDF
BÀI 1: Làm quen với lập trình - Giáo trình FPT
PDF
Bài giảng lý thuyết ms excel 2010 - MICROSOFT EXCEL 2010
DOC
Giáo trình tự học Word 2013 bản Tiếng Việt
PDF
Tai lieu hoc ms word 2013 tieng viet
PDF
Web1012 slide 7
PDF
Tu hoc microsoft asp.net
PDF
Tu hoc excel
DOC
Giáo trình tự học Excel 2013 bản Tiếng Việt
POT
Open office
DOC
Tai lieu html
DOC
Tailieu.vncty.com huong dan nhap mon html
DOC
Tai Lieu Html
PDF
Pdf bai tap_lap_trinh_win_form - mon_1-mastercode.vn
PDF
Bài 1: Làm quen với ASP.NET - Giáo trình FPT - Có ví dụ kèm theo
PDF
Pdf bai 2 làm việc với biểu mẫu cơ bản-slide 02-quan tri csdl voi access-mast...
PPT
IT120-3. Thiết kế giao diện trên Android
DOCX
Huongdanthuchanhtinhoc
PDF
Open office & Microsoft office
Giáo trình hướng dãn sử dụng Microsoft Word 2013
BÀI 1: Làm quen với lập trình - Giáo trình FPT
Bài giảng lý thuyết ms excel 2010 - MICROSOFT EXCEL 2010
Giáo trình tự học Word 2013 bản Tiếng Việt
Tai lieu hoc ms word 2013 tieng viet
Web1012 slide 7
Tu hoc microsoft asp.net
Tu hoc excel
Giáo trình tự học Excel 2013 bản Tiếng Việt
Open office
Tai lieu html
Tailieu.vncty.com huong dan nhap mon html
Tai Lieu Html
Pdf bai tap_lap_trinh_win_form - mon_1-mastercode.vn
Bài 1: Làm quen với ASP.NET - Giáo trình FPT - Có ví dụ kèm theo
Pdf bai 2 làm việc với biểu mẫu cơ bản-slide 02-quan tri csdl voi access-mast...
IT120-3. Thiết kế giao diện trên Android
Huongdanthuchanhtinhoc
Open office & Microsoft office
Ad

Similar to Huong dan lap_trinh_voi_android_5 (18)

PPT
Lập trình Android cơ bản bằng tiếng Việt
PPT
IT120-2. Bắt đầu với Hello World
PPT
2.bat dau voi hello world
PPT
2.bat dau voi hello world
PPT
Hướng Dẫn Lập Trình Android: 2. Bắt đầu với Hello World.ppt
PPT
Slide bài giảng lập trình Android DTU - Phần 2 (Bắt đầu với Helloworld)
PPT
3.thiet ke giao dien tren android
PPTX
Hướng Dẫn Lập Trình Android: 3. Thiet ke giao dien tren Android
PPT
Slide bài giảng lập trình Android DTU - Phần 2 (Thiết kế giao diện)
PPTX
Introduction Android For Begineer
PDF
Bao cao-lap-trinh-android-final
PPTX
Semina Kết nối nguồn dữ liệu từ Internet
PDF
Sáng kiến kinh nghiệm hướng dẫn học sinh lập trình ứng dụng học tập cho thiết...
ODP
Android Nâng cao-Bài 8-JSON & XML Parsing
PPTX
mp_hag_slide_android_2321.pptx
DOC
Lớp học lập trình android tại hà đông
PPTX
Báo cáo thực tập cơ sở
PDF
Bài tập Lập trinh viên thiết bị di động
Lập trình Android cơ bản bằng tiếng Việt
IT120-2. Bắt đầu với Hello World
2.bat dau voi hello world
2.bat dau voi hello world
Hướng Dẫn Lập Trình Android: 2. Bắt đầu với Hello World.ppt
Slide bài giảng lập trình Android DTU - Phần 2 (Bắt đầu với Helloworld)
3.thiet ke giao dien tren android
Hướng Dẫn Lập Trình Android: 3. Thiet ke giao dien tren Android
Slide bài giảng lập trình Android DTU - Phần 2 (Thiết kế giao diện)
Introduction Android For Begineer
Bao cao-lap-trinh-android-final
Semina Kết nối nguồn dữ liệu từ Internet
Sáng kiến kinh nghiệm hướng dẫn học sinh lập trình ứng dụng học tập cho thiết...
Android Nâng cao-Bài 8-JSON & XML Parsing
mp_hag_slide_android_2321.pptx
Lớp học lập trình android tại hà đông
Báo cáo thực tập cơ sở
Bài tập Lập trinh viên thiết bị di động
Ad

Recently uploaded (16)

PPTX
Gioi-thieu-nen-tang-DMP-T32023-52023.pptx
PPT
C2 Sứ mệnh lịch sử của GCCN.ppt
PPTX
HIỆP ĐỊNH ĐỐI TÁC KINH TẾ TOÀN DIỆN - Cục GSQL về Hải quan 2022.pptx
PPT
i dont know cdzmnnnnnnnnnnnnnnnnnnnnnnnnnn
PDF
slide Quản trị Marketing TV.pdf sđfsdfsdfsd
DOC
Thủ tục cấp chứng nhận xuất xứ C/O mẫu D
DOCX
Báo cáo môn tuyến điểm du lịch (11).docx
PPTX
dffffffffffffffffffffffffffffffffffffffffffffffffffffffff
PDF
Báo Phú Thọ: FPT Cloud chia sẻ lợi ích của điện toán đám mây đem lại
PPTX
White and Purple Modern Artificial Intelligence Presentation (1).pptx
PPT
Bai 2 - Mô hình nhận thức thái độ hành vi .ppt
PDF
Báo Thanh Hóa: Doanh nghiệp nên thuê server vật lý hay cloud server cho hạ tầ...
PPTX
Các bước ĐÁNH GIÁ BSC KPI, bước 2 gồm những gì
PPTX
51452a0a89fbb693c3316f6a7a17ca4hsdhvhc.pptx
PPTX
MKTQT-slide-sv.pptxsdfsdfdfsdfsdfaesesse
PPTX
Bài giảng lý thuyết ung thư cổ tử cung 02.23.(SV).pptx
Gioi-thieu-nen-tang-DMP-T32023-52023.pptx
C2 Sứ mệnh lịch sử của GCCN.ppt
HIỆP ĐỊNH ĐỐI TÁC KINH TẾ TOÀN DIỆN - Cục GSQL về Hải quan 2022.pptx
i dont know cdzmnnnnnnnnnnnnnnnnnnnnnnnnnn
slide Quản trị Marketing TV.pdf sđfsdfsdfsd
Thủ tục cấp chứng nhận xuất xứ C/O mẫu D
Báo cáo môn tuyến điểm du lịch (11).docx
dffffffffffffffffffffffffffffffffffffffffffffffffffffffff
Báo Phú Thọ: FPT Cloud chia sẻ lợi ích của điện toán đám mây đem lại
White and Purple Modern Artificial Intelligence Presentation (1).pptx
Bai 2 - Mô hình nhận thức thái độ hành vi .ppt
Báo Thanh Hóa: Doanh nghiệp nên thuê server vật lý hay cloud server cho hạ tầ...
Các bước ĐÁNH GIÁ BSC KPI, bước 2 gồm những gì
51452a0a89fbb693c3316f6a7a17ca4hsdhvhc.pptx
MKTQT-slide-sv.pptxsdfsdfdfsdfsdfaesesse
Bài giảng lý thuyết ung thư cổ tử cung 02.23.(SV).pptx

Huong dan lap_trinh_voi_android_5

  • 1. 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.
  • 2. - 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/andro id" 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
  • 3. 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> B6:Trong thư mục values, tạo file colors.xml (chuột phải vào thư mục, chọn New - > Android XML File, và lưu ý chữ s, không phải là color.xml). Gõ nội dung cho file như sau: Mã: <?xml version="1.0" encoding="utf-8"?> <resources> <color name="text_color">#ff3300</color> </resources> OK, vậy là bạn đã tạo một màu mới cho dòng chữ sẽ được hiển thị trong Text View (ff3300 là mã hexa của màu đỏ). Thực chất bạn hoàn toàn có thể gõ thẳng Mã: android:textColor="#ff3300" trong file main.xml mà không cần tạo mới file colors.xml, nhưng mục đích của XML trong Android chính là để hỗ trợ nâng cấp chỉnh sửa dễ dàng. Nếu sau này bạn muốn sửa màu của dòng text thì chỉ cần vào colors.xml thay đổi thay vì mò mẫm trong main.xml (có thể rất dài nếu giao diện phức tạp). Các thành phần trên mới chỉ là các phần cơ bản của XML. Ngoài ra các bạn có thể
  • 4. khai báo thêm về Animation, Style và Theme (phức tạp hơn nhiều nên mình không giới thiệu trong phần cơ bản này). B7: Vậy là chúng ta đã hoàn thiện phần giao diện với XML, giờ đến viết code để xử lý các sự kiện cho các thành phần: => 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
  • 5. 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; } } }); } }