jump to navigation

Tạo một state mới trên Android 20/11/2010

Posted by hnb1988 in Android Development.
Tags: , ,
trackback

Chào các bạn, tiếp tục với việc tạo giao diện trên Android. Hôm nay mình sẽ tìm hiểu cách tạo ra một state mới trên Android thử xem.

Tài liệu tham khảo vẫn là HelloAndroid – Trang 57

Web: http://developer.android.com/guide/topics/ui/themes.html

Bài viết trước

State ở đây là gì? Hiểu nôm na ở đây, state là một trang màn hình.

Vậy như trong game của mình state ở đây sẽ bao gồm như:

  • State Menu
  • State Game
  • State Menu Option
  • State About
  • State Help

Project chúng ta tiếp tục project trước – Game Sudoku🙂

State chúng ta tạo ra hôm nay là một state đơn giản – State About🙂 (Để cho nhanh chóng gọn nhẹ)

Giao diện Menu

Giao diện Menu

Để tạo được một state mới, chúng ta cần 3 bước chính sau:

  • Define a new Activity, and start it
  • Use the AlertDialog class, and show it
  • Subclass Android’s Dialog class, and show that.

Giờ việc đầu tiên chúng ta tạo một layout cho layout About (Define a new Activity)

Chúng ta cần tạo một file xml để xây dựng layout cho About.  Chúng ta có thể đặt tên như : res/layout/about.xml:

Và add một vài đoạn định nghĩa theo ý bạn, ví dụ như:

<?xml version=”1.0″ encoding=”utf-8″?>

<ScrollView

xmlns:android=”http://schemas.android.com/apk/res/android&#8221;

android:layout_width=”fill_parent”

android:layout_height=”fill_parent”

android:padding=”10dip”>

<TextView

android:id=”@+id/about_game”

android:layout_width=”wrap_content”

android:layout_height=”wrap_content”

android:text=”@string/about_text” />

</ScrollView>

Giờ bạn tạo một đoạn text cho about, đoạn giới thiệu thông tin gì về game sudoku

Đoạn text này bạn định nghĩa trong file : res/values/strings.xml, Ví dụ như:

<string name=”about_title”>About Android Sudoku</string>

<string name=”about_text”>\

Sudoku is a logic-based number placement puzzle.

Starting with a partially completed 9×9 grid,

the objective is to fill the grid so that eachrow,

each column, and each of the 3×3 boxes(also called <i>blocks</i>)

contains the digits1 to 9 exactly once.

</string>

Text này có thể chứa định dạng HTML để tạo text, và bạn có thể cho thể hiện text trên nhiều dòng.

Xong việc tạo một layout, công việc tiếp theo cũng khá quan trọng. About activity nên được định nghĩa trong một file About.java. Nó sẽ overwride các hàm như onCreate( ) và  call setContentView( ). Để tạo lớp About, bạn có thể File > New > Class

import android.app.Activity;

import android.os.Bundle;

public class About extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.about);

}

}

Tiếp theo bạn cần viết tất các định nghĩa này lên file sudoku.java. Và nhớ import những thư viện sau

import android.content.Intent;

import android.view.View;

import android.view.View.OnClickListener;

 

Trong phương thức  onCreate( ) , thêm code call findViewById( ) để tìm các phương thức trong Android, và add phương thức setOnClickListener( ) để gọi tới Android cái gì được gọi.

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

// Set up click listeners for all the buttons

View continueButton = findViewById(R.id.continue_game);

continueButton.setOnClickListener(this);

View newButton = findViewById(R.id.new_game);

newButton.setOnClickListener(this);

View aboutButton = findViewById(R.id.about_game);

aboutButton.setOnClickListener(this);

View exitButton = findViewById(R.id.exit_game);

exitButton.setOnClickListener(this);

}

Trong khi bạn tạo những code này thì Plugin Anroid trong Eclipse tạo ra những định nghĩa trong file R.java như

R.id.about_game khi plugin này thấy id about trong mail.xml, about.xml

Rồi cũng gần như hoàn thành, giờ làm sao khi touch và about làm sao biết gọi tới ai. Thì chúng ta cần định nghĩa lại một tí khi gọi hàm onClick

public class Sudoku extends Activity implements OnClickListener {

// …

public void onClick(View v) {

switch (v.getId()) {

case R.id.about_button:

Intent i = new Intent(this, About.class);

startActivity(i);

break;

// More buttons go here (if any) …

}

}

}

Xong, chúng ta thử chạy xem, và sẽ có một vấn đề nhỏ xảy ra ở đây  :-)

Lỗi khai báo

Lỗi khai báo

Chúng ta còn một bước đơn giản nhưng khá quan trọng là tất cả những gì cần hiển thị đều được định nghĩa lên  AndroidManifest.xml.

<activity

android:name=”.About”

android:label=”@string/about_title”>

</activity>

Rồi giờ thì chúng ta có thể chạy tốt được rồi🙂

 

Màn hình about

Màn hình about

 

Chúng ta có thể thay đổi một tí về giao diện này bằng cách đổi theme trong phần khai báo ở trên:

<activity

android:name=”.About”

android:label=”@string/about_title”

        android:theme="@android:style/Theme.Dialog">

</activity>

Và giao diện chúng ta sẽ như thế này, nhìn đẹp hơn🙂

Theme mới cho About

Theme mới cho About

Rồi như thế là chúng ta đã hoàn thành xong  ..🙂

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

—————————————————————————————————

bloghnb

Comments»

1. Hà - 29/11/2010

A Bang ơi. A viết 1 tut hướng dẫn thay đổi background của 1 layout theo thời gian khi application đang chay được không anh. em mò hoài mà vẫn chưa thay đổi được.

Cảm ơn a trước nha!hihi

2. conan - 15/01/2011

cảm ơn anh.
bài của anh rất hay anh có tài liệu về android ko ạ anh có thể share cho em ít để em tìm hiểu kỹ hơn về nó được ko ạ
thanks anh nhìu

hnb1988 - 15/01/2011

Hôm sau có gì bạn để lại email trên này luôn nha. Đôi khi email gửi về mail mình chỉ xem qua một lần rồi xóa mất tiêu…🙂

hnb1988 - 15/01/2011

Mình sẽ gửi cho bạn trong vài ngày tới ha…

3. Song Ngư - 28/12/2012

Cảm ơn anh về bài viết.
E áp dụng làm menu button trong project của e, nhưng khi bấm vào 1 button chuyển sang activity mới rồi quay lại chọn 1 button khác thì gặp lỗi Fatal signal 11, ứng dụng tự tắt đi. E không biết lỗi này do đâu và sửa như thế nào. Mong anh giúp đỡ ạ


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: