Thứ Năm, 18 tháng 12, 2014

Lập trình Android TUT ANDROID 007


Lập trình Android TUT ANDROID 007: USER INTERFACE TRONG ANDROID – SPINNER (PART 5)


( VEDA ) Spinner trong Android khá là giống với Combo Box trên web đó là giao diện dạng “Drop Down List” giúp người dùng lựa chọn một “Item” trong danh sách có sẵn

Để làm rõ thành phần này trong ví dụ này mình sẽ làm một ứng dụng với kịch bản như sau: Giao diện của ứng dụng gồm 2 Spinner và 1 Button. Khi bạn thay đổi giá trị của Spinner thì sẽ Toast lên giá trị mới đó. Khi bạn click vào Button mình sẽ hiển thị giá trị đang được chọn của 2 Spinner qua LogCat.

Để làm được ví dụ này các bạn thực hiện lần lượt các bước sau:

Bước 1: Mở file res-> values ->strings.xml

Bước 2: tạo file res-> values ->array.xml

Bước 3: Mở file res-> layout ->activity_main.xml

Bước 4: mở file MainActivity.java

Tiếp theo: Bài 8 TUT ANDROID 008: USER INTERFACE TRONG ANDROID – LISTVIEW (PART 6)

Ngoài ra học viện công nghệ veada  mở khóa học Android miễn phí, trả phí bằng tháng lương đầu tiên của bạn.
Học viện công nghệ veda
Địa chỉ: Số 1, Hoàng Đạo Thúy, Thanh Xuân, Hà Nội

Lập trình Android TUT ANDROID 006


Lập trình android TUT ANDROID 006: USER INTERFACE TRONG ANDROID – TOGGLE BUTTON, CHECKBOX (PART 4)


( VEDA ) ToggleButton: Cho phép người dùng có thể thay đổi cài đặt giữa hai trạng thái.

CheckBox: Cho phép người dùng chọn một trong hai trạng thái các bạn đã rất quen thuộc với CheckBox với remmerber trên yahoo và facbook…

Để làm rõ 2 thành phần này trong ví dụ này mình sẽ làm một ứng dụng với kịch bản như sau: Giao diện của ứng dụng gồm 1 CheckBox (CB), 1 ToggleButton(TB) và 1 Button. Khi bạn click vào CB hay TB mình sẽ hiện Toast để thông báo trạng thái hiện tại của CB hay TB. Khi bạn click vào Button mình sẽ hiển thị trạng thái hiện tại của CB và TB

Để làm được ví dụ này các bạn thực hiện lần lượt các bước sau:

Bước 1: Mở file res-> values ->strings.xml

Bước 2: Mở file res-> layout ->activity_main.xml

Bước 3: mở file MainActivity.java

Bài tiếp theo: Bài 7 TUT ANDROID 007: USER INTERFACE TRONG ANDROID – SPINNER (PART 5)
Học viện công nghệ veda
Địa chỉ: Số 1, Hoàng Đạo Thúy, Thanh Xuân, Hà Nội

 

Lập trình Android TUT ANDROID 005


Lập trình Android TUT ANDROID 005: USER INTERFACE TRONG ANDOID – IMAGEVIEW, IMAGE BUTTON (PART 3)


( VEDA ) ImageView: trong andoird là lớp hỗ trợ các bạn hiện thị các ảnh một cách dễ dàng.

ImageButton: trong android bạn có thể sử dụng ImageButton để hiển thị một Button thông thường với hình nền là một bức ảnh tùy ý. Về việc xử lý với ImageButton rất giống với Button

Để làm rõ 2 thành phần này trong ví dụ này mình sẽ làm một ứng dụng với kịch bản như sau: Giao diện của ứng dụng gồm 2 thành phần: 1 ImageView, 1 ImageButton khi bạn click vào ImageView thì mình sẽ hiển thị “Toast” để thông báo; khi bạn click vào ImageButton mình sẽ thay đổi ảnh của ImageView theo vòng lần lượt 6 ảnh là quốc kỳ của các nước.

Để làm được ví dụ này các bạn thực hiện lần lượt các bước sau:

Bước 1: bạn tạo thư mục drawable trong folder res và copy các bức ảnh các bạn muốn hiển thị vào trong đó trong ví dụ của mình mình copy hình ảnh quốc kỳ 6 nước vào thư mục này như hình.

Ngoài ra mình có copy 1 ảnh để làm nền cho ImageButton vì ảnh của mình có kích thước 96×96 nên mình copy vào thư mục drawalbe-xhdpi . Việc copy chuẩn vào folder rất có lợi vì hđh android sẽ tự xác định kích thước màn hình của bạn để chọn ảnh tương ứng các bạn có thể thử bằng cách delete ảnh ở thư mục này và copy vào thư mục drawalbe ở trên và chạy để xem kết quả.


Bước 2: Mở file res-> layout ->activity_main.xml

Bước 3: mở file MainActivity.java

Bài tiếp theo: Bài 6: 
TUT ANDROID 006: USER INTERFACE TRONG ANDROID – TOGGLE BUTTON, CHECKBOX (PART 4)
 Học viện công nghệ veda
Địa chỉ: Số 1, Hoàng Đạo Thúy, Thanh Xuân, Hà Nội

Thứ Tư, 17 tháng 12, 2014

Lập trình Android TUT ANDROID 004


Lập trình android TUT ANDROID 004: USER INTERFACE TRONG ANDROID – EDITTEXT, TEXTVIEW (PART 2)


( VEDA ) Trong bài này mình sẽ giới thiệu cho các bạn về EditText và TextView 2 thành phần được dùng khá nhiều trong các app android.

EditText: Các bạn có thể hiểu đơn giản giống như ô đăng nhập nhập của yahoo hay Facebook nó là một loại View trong lập trình android hỗ trợ người dùng nhập dữ liệu.

TextView: là một loại View trong andoird dùng để hiển thị nội dung các text (có thể là nội dung bất kỳ hoặc các bài báo,bài hát …)

Mình sẽ demo bằng một ứng dụng đơn giản theo kịch bản sau: Giao diện gồm có 3 thành phần 1 EditText, 1 TextView, 1 Button. Khi bạn click vào Button thì nội dung text trong EditText sẽ được gán cho TextView

Để làm được ví dụ này các bạn thực hiện lần lượt các bước sau

Bước 1: Vào thư mục res->values

- Mở file: strings.xml - thông thường các bạn nên khai báo tất cả các String được dùng trong app ở đây. Điều này rất có lợi cho việc multi Langues trong các android app cũng như dễ dàng sửa đổi nội dung String mà không phải sửa lại code vi vậy các bạn nên quen làm với các file strings hay color để hạn chế Hardcoded


- Tạo file color.xml - để tao file này bạn chuột phải vào folder value -> New -> Android XML File

(Nếu k có Android XML File bạn chọn Other -> Android -> Android XML File)

Đây là các tạo chung cho tất cả các file XML trong android. Mình thường tạo file này để lưu tất cả giá trị màu được sử dụng trong lập trình android app


Bước 2: Vào thư mục res->layout -> activity_main.xml


Bước 3: Mở file MainActivity.Java trong folder src

Bài tiếp theo bài 5: 
TUT ANDROID 005: USER INTERFACE TRONG ANDOID – IMAGEVIEW, IMAGE BUTTON (PART 3)

Học viện công nghệ veda
Địa chỉ: Số 1, Hoàng Đạo Thúy, Thanh Xuân, Hà Nội

Lập trình Android TUT ANDROID 003: USER INTERFACE TRONG ANDROID – BUTTON (PART 1)


Lập trình Android TUT ANDROID 003: USER INTERFACE TRONG ANDROID – BUTTON (PART 1)


( VEDA ) Giao diện người dùng (UI) trong andoid app có 2 loại là View và View Group


UI trong andoird app được định nghĩa trong tập tin xml trong thư mục res->layout



UI trong android app gồm rất nhiều thành phần mình sẽ từ từ giới thiệu với các bạn từng thành phần trong đó cũng như những xử lý cơ bản nhất với các thành phần đó
Button

Button là một đối tượng rất phổ biết không chỉ trong android mà còn trong rất nhiều loại ngôn ngữ khác.

Trong ví dụ demo của mình mình có làm 1 ví dụ đơn giản về việc tạo một button trong giao diện và khi người dùng click vào button đó thì sẽ show ra “Toast” để thông báo là button đã được click

Để làm được ví dụ này các bạn thực hiện lần lượt các bước sau

Bước 1: Vào thư mục res->layout -> activity_main.xml : thêm button vào giao diện

<br /><br />&lt;RelativeLayout xmlns:android=<br /><%%KEEPWHITESPACE%%> xmlns:tools=<br /><%%KEEPWHITESPACE%%> android:layout_width="match_parent"<br /><%%KEEPWHITESPACE%%> android:layout_height="match_parent"<br /><%%KEEPWHITESPACE%%> tools:context=".MainActivity" &gt;<br /><br />&lt;Button<br /><%%KEEPWHITESPACE%%> android:id="@+id/btDemo"<br /><%%KEEPWHITESPACE%%> android:layout_width="wrap_content"<br /><%%KEEPWHITESPACE%%> android:layout_height="wrap_content"<br /><%%KEEPWHITESPACE%%> android:text="Button" /&gt;<br /><br />&lt;/RelativeLayout&gt;<br /><br />


Note: Với View hay ViewGroup trong android thì có 2 thuộc tính là bắt buộc là 

android:layout_width 

Qui định độ rộng của View hay ViewGroup 

android:layout_height 

Qui định độ cao của View hay ViewGroup 

Thuộc tính android:id 

Qui định id của View hoặc ViewGroup dùng để “control” View hay ViewGroup từ code 

Bước 2: Mở file MainActivity.Java trong folder src 

<br /><br />package com.example.buttondemo;<br /><br />import android.app.Activity;<br /><%%KEEPWHITESPACE%%> import android.content.Context;<br /><%%KEEPWHITESPACE%%> import android.os.Bundle;<br /><%%KEEPWHITESPACE%%> import android.view.Menu;<br /><%%KEEPWHITESPACE%%> import android.view.View;<br /><%%KEEPWHITESPACE%%> import android.view.View.OnClickListener;<br /><%%KEEPWHITESPACE%%> import android.widget.Button;<br /><%%KEEPWHITESPACE%%> import android.widget.Toast;<br /><br />public class MainActivity extends Activity {<br /><br />// buoc 1 xay dung 1 button trong layout<br /><br />// buoc 2 khai bao 1 bien kieu Button trong code<br /><%%KEEPWHITESPACE%%> private Button btDemo;<br /><br />@Override<br /><%%KEEPWHITESPACE%%> protected void onCreate(Bundle savedInstanceState) {<br /><%%KEEPWHITESPACE%%> super.onCreate(savedInstanceState);<br /><br />// Phuong thuc setContentView de set giao dien cho Activity<br /><%%KEEPWHITESPACE%%> setContentView(R.layout.activity_main);<br /><br />// buoc 3 ket noi bien voi layout<br /><%%KEEPWHITESPACE%%> btDemo = (Button) findViewById(R.id.btDemo);<br /><br />// buoc 4 lang nghe su kien Button duoc Click<br /><%%KEEPWHITESPACE%%> btDemo.setOnClickListener(new OnClickListener() {<br /><br />@Override<br /><%%KEEPWHITESPACE%%> public void onClick(View v) {<br /><%%KEEPWHITESPACE%%> // lam gi do khi button duoc click<br /><%%KEEPWHITESPACE%%> // trong vi du nay minh chi don gian la hien thi 1 Toast thong bao<br /><%%KEEPWHITESPACE%%> ShowToastLong(MainActivity.this, "Button duoc click");<br /><br />}<br /><%%KEEPWHITESPACE%%> });<br /><%%KEEPWHITESPACE%%> }<br /><br />public static void ShowToastLong(Context mContext, String Message) {<br /><%%KEEPWHITESPACE%%> Toast.makeText(mContext, Message, Toast.LENGTH_LONG).show();<br /><%%KEEPWHITESPACE%%> }<br /><br />@Override<br /><%%KEEPWHITESPACE%%> public boolean onCreateOptionsMenu(Menu menu) {<br /><%%KEEPWHITESPACE%%> // Inflate the menu; this adds items to the action bar if it is present.<br /><%%KEEPWHITESPACE%%> getMenuInflater().inflate(R.menu.main, menu);<br /><%%KEEPWHITESPACE%%> return true;<br /><%%KEEPWHITESPACE%%> }<br /><br />}<br /><br />

kết quả chạy demo

Tiếp theo Bài 4: 
TUT ANDROID 004: USER INTERFACE TRONG ANDROID – EDITTEXT, TEXTVIEW (PART 2)
Học viện công nghệ veda
Địa chỉ: Số 1, Hoàng Đạo Thúy, Thanh Xuân, Hà Nội

Lập trình Android, TUT ANDROID 002

TUT ANDROID 002: CÁC THÀNH PHẦN CHÍNH TRONG ANDROID APP, ACTIVITY TRONG ANDROID

( VEDA ) Trong bài trước mình đã giới thiệu với các bạn về cách cài đặt và chạy một ví dụ đơn giản nhất về app trong android. Trong bài này mình sẽ giới thiệu về các thành phần chính trong app.

Trong Android app có thể chia thành 4 thành phần chính

- Activity: Là một thành phần của ứng dụng cung cấp một giao diện mà người dùng có thể tương tác vào đó để thực hiện một hành động nào đó ví dụ như: gọi điện, gửi email, gửi sms …

- Service: là một thành phần chạy ngầm trong android. Service dùng để update dữ liệu, đưa ra các cảnh báo (Notifacation) và không bao giờ hiển thị cho người dùng nhìn thấy.

- Broadcast Receiver(BR): Là thành phần để thu nhận các Intent thông báo từ hệ điều hành (pin yếu, có sms, có cuộc gọi đến..) hoặc từ chính trong app của chúng ta. BR cũng không có giao diện người dùng.

- Content Provider: Lưu và truy suất dữ liệu trong tất cả app, cho phép ứng dụng truy suất, chỉnh sửa và chia sẻ dữ liệu với nhau.

Ngoài 4 thành phần chính này trong một số tài liệu khác có thể nhắc tới các thành phần khác như : Intent, Notification, app widget mình sẽ dần dần đề cập đến tất cả các vấn đề này

Trong bài này mình tập trung giới thiệu về Activity vòng đời của Activity để các bạn có thể hiểu tương đối rõ ràng về nó


Trong vòng đời của mình Activity tồn tại ở một trong 3 trạng thái:

Running: Activity đang hiển thị trên giao diện chính, người dùng có thể tương tác với giao diện

Pause: Activity vẫn hiển thị nhưng người dùng không thể tương tác với giao diện (Khi Activity đang running thì xuất hiện 1 popup (trong android gọi Dialog) thì Activity sẽ chuyển sang trạng thái pause.

Stop: Khi Activity đang chạy và bị thay thế hoàn toàn bởi Activity mới thì Activity cũ sẽ chuyển sang trạng thái Stop

Để hiểu rõ từng trạng thái này các bạn có thể import project dưới đây về và chạy thử. Đây là project example của google mục đích để mọi người hiểu rõ về Activity và các trạng thái của nó. Các bạn chạy thử và xem kết quả ban đầu không cần hiểu về code của nó.


Note: Cách import project và cách chạy một project các bạn có thể xem lại mục 4 trong file pdf mình đính kèm trong TUT 001 ở cuối bài

Khi Các bạn chạy ứng dụng các bạn sẽ thấy màn hình có giao diện như sau:


Điều này có nghĩa khi ứng dụng bắt đầu chạy thì chạy vào Activity A, nó thực hiện lần lượt các Phương thức A.onCreate() -> A.onStart() -> A.onResume() của Activity A.

Activity A đang ở trạng thái running người dùng có thể tương tác với giao diện

Khi bạn click vào button “start B” Ứng dụng sẽ có hình như sau:


Khi đó các bạn đã start Activity B các bạn sẽ thấy các phương thức mà ứng dụng đã đi qua

A.onCreate() -> A.onStart() -> A.onResume() -> A.onPause() -> B.onCreate() -> B.onStart() -> B.onResume() -> A.onStop()

Muốn start Activity B từ Activity A đầu tiên ứng dụng phải pause Activity A sau đó khởi tạo Activity B (thực hiện onCreate(), onStart(), onResume() của Activity B) rồi mới thực hiện A.onStop()

Activity B đang ở trạng thái running người dùng có thể tương tác với giao diện; Activity A trở về trạng thái stop

Khi các bạn klick vào button Dialog thì Activity B sẽ chuyển sang trạng thái Paused


Activity B đang Pause người dùng có thể nhìn thấy giao diện nhưng không thể tương tác vào giao diện; Activity A vẫn đang là Stop

Sau khi các ban close dialog rồi các bạn chọn Button “Start C”


ð Activity C đang ở trạng thái running người dùng có thể tương tác với giao diện; Activity A và Activity B đang ở trạng thái Stop

Mỗi khi 1 Activity mới được Start thì Activity trước đó sẽ được chuyển sang trạng thái Stop và hệ điều hành sẽ đưa thêm Activity mới vào trong 1 “Stack”

Note: Các bạn có thể hiểu Stack như là 1 chồng đĩa mỗi lần các bạn đặt thêm 1 chiếc đĩa thì các bạn chỉ có thể đặt nó ở trên cùng của chồng đĩa và khi các bạn lấy ra thì các bạn chỉ có thể lấy các chiếc đĩa theo thứ tự từ trên xuống (Firt In Last Out – FILO: vào trước ra sau)như vậy chiếc đĩa đặt vào đầu tiên sẽ được lấy ra cuối cùng và chiếc đĩa đặt vào cuối cùng thì được lấy ra sau. Các bạn có thể tìm hiểu thêm về cơ chế Queue (hàng đợi Firt In Firt Out – FIFO: vào trước ra trước) đây là hai kiến thức khá hay và cơ bản trong kỹ thuật lập trình

Việc xếp chồng (Stack) các Activity sẽ được thể hiện rõ khi các bạn thực hiện lần lượt việc finish Activity C (click button Finish C)


Sau khi finish Activity C: Activity C bị Destroyed và Activity B được restart lại chuyển sang trạng thái running

Sau đó các bạn click “Finish B”


Sau khi finish Activity B: Activity B chuyển sang trạng thái Destroyed và Activity A được restart lại

Note: các bạn có thể thấy rõ ràng cơ chế stack ở đây. Ban đầu chúng ta start lần lượt các Activity theo thứ tự A->B->C nhưng khi chúng ta destroy chúng thì chúng ta phải hủy theo thứ tự ngược lại khi ta destroy C -> B ở trên đỉnh Stack -> B được hiển thị; tương tự khi ta destroy B thì A lại ở trên đỉnh Stack và khi đó A được hiển thị

Trên đây mình giới thiệu qua về cơ chế hoạt động của Activity, vòng đời và các trạng thái của nó điều kiện để xuất hiện các trạng thái đó và cơ chế lưu Activity của hệ điều hành.

Bài viết của mình có thể còn nhiều thiếu sót rất mong nhận được sự bổ sung chia sẻ của các bạn.
 
Tiếp theo: Bài 3 TUT ANDROID 003: USER INTERFACE TRONG ANDROID – BUTTON (PART 1)

Lập trình Android,TUT android 001: CÀI ĐẶT ANDROID SDK, ECLIPSE

TUT ANDROID 001: CÀI ĐẶT ANDROID SDK, ECLIPSE


( VEDA ) Để lập trình  android trên nền tảng android chúng ta phải cài đặt các phần sau:
Cài đặt JDK:

- Để download JDK bạn vào link sau:



Note: bạn down bản cài phù hợp với win của bạn (win 32bit hoặc win 64bit)

- Cài đặt JDK

Chúng ta tiến hành cài đặt JDK bằng tất cả giá trị mặc định của chương trình, trong quá trình cài sẽ yêu cầu cài đặt JRE (tự động), và cài vào cùng thư mực JDK (mặc định).

Cấu hình JDK: Vào Control Pannel -> System -> Advance system settings hoặc nháy chuột phải My Computer chọn properties


Chọn thẻ Advance, click “Environment Variables” mở hộp thoại “Environment Variables” clcik “” New (Xem hình)

+ Variable name = PATH

+ Variable value = C:\Program Files\Java\jdk1.7.0_07\bin (đây là đường dẫn đến thư mục bin nơi cài đặt JDK của chúng ta)


Kiểm tra cài đặt thành công:

Sau khi cài đặt xong chúng ta vào cmd rồi gõ lệnh java nếu xuất hiện như màn hình là đã thành công nếu không chúng ta xem lại bước thiết lập biến môi trường.


2. Download và cài đặt Eclipse, Android SDK

Các bạn có thể download bộ cài đầy đủ gòm Eclipse và Android SDK tại:



Sau đó bạn chọn checkbox ở vị trí 1, chọn 32 bit nếu win của bạn là win 32 bit hoặc 64 bit nếu win của bạn là win 64 bit, sau đó click download the SDK ADT Bundle for Windows


Sau khi download về giải nén các bạn được các file như sau


Để cài đặt Android SDK các bạn có 2 cách:

Cách 1: Các bạn click chuột vào biểu tượng SDK Manager.exe ở ngoài và tiến hành cài đặt.

Cách 2: Các bạn khởi chạy Eclipse lên. Rồi vào mục Android SDK Manager (như hình)


Sau đó chọn các modul cần thiết thông thường thì các bạn nên down ít nhất 2 modul Android 2.2 và Android 3.0 (sau này mình viết tutorial chủ yếu trên 2 modul này)


Sau khi Install xong là công việc cài đặt đã hoàn tất.

Hy vọng với hướng dẫn này sẽ có thể giúp cho các bạn cài đặt được bộ Eclipse và Android SDK để phục vụ công việc học tập cho mình.

Để chạy thử ứng dụng đầu tiên các bạn có thể làm theo chi tiết hướng dẫn trong file pdf ở dưới đây: