Viết android game tài xỉu

Viết android game tài xỉu

Bước 1: Thiết kế giao diện

Mục tiêu mình thiết kế như sau nhá:

Viết android game tài xỉu

Để tạo giao diện như trên ta cần thêm các hình Tài, Xỉu và hình xí ngầu vào thư mục res/drawable-hdpi. Việc này mình đã hướng dẫn ở bài lab touch gallery images.

Còn về mục tiêu thiết kế giao diện của bài lab này là hướng dẫn các bạn cách thay đổi màu sắc, chuyển sắc.. cho các đối tượng , hiểu các trang thái của đối tượng, khai thác được resource color và drawable

Và dùng kiến thức đó tạo cho nút Button hấp dẫn hơn!!!

Phần 1- Màu sắc cho text

1.Tạo 1 thư mục tên “color” trong thư muc res. Click phải thư mục color vừa tạo chọn tiếp New/Other.. Cửa sổ New mở ra, mở rộng Android và chọn Android XML File , Next. Cửa sổ New Android XML file mở ra . Resource Type: ColorList, Project: chọn project cho đúng, File: button_text. Root Element: Selector. Xong nhấn Next/Finish.

Đến đây ta đã tạo được 1 file xml resource về màu sắc. Tiếp theo ta tìm hiểu về lý thuyết 1 tí. Ta có class ColorStateList có thể được định nghĩa trong XML dùng để lưu màu sắc nhưng có thể có nhiều trang thái khác nhau.

VD: nút có nhiều trạng thái là: bình thường, đưa chuột lên, lấy chuột ra ….Và ta có thể dùng colorstatelist để cung cấp màu cho nhiều trang thái khác nhau.

Mỗi màu sắc được định nghĩa trong một thẻ item trong đó:

  • Android:color bằng 1 màu kiểu thập lục phân
  • Android:state_pressed =true là khi đối tượng được nhấn (vd: nút được chạm hay click. Bằng false dùng cho bình thường khi không được nhấn.
  • Android:state_focused=true dùng cho đối tượng được chọn (vd: tab được mở).false dùng cho đối tượng không được chọn.
  • Android:state_checkable=true dùng cho đối tượng có thể được check. False khi đối tượng không thể check.
  • Android:state_checked=true dùng cho đối tượng đã được check. False dùng khi đối tượng chưa được check.
  • Android:state_enabled=true dùng khi đối tượng enabled. False khi đối tượng disabled.

2. Mở file button_text.xml và thêm source như sau:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:state_pressed="true"
        android:color="#FF0000" />
    <item
        android:state_focused="true"
        android:color="#00FF00" />
    <item
        android:color="#0000FF" />
</selector>

3. Mở file activity_main.xml và áp màu vào text cho các đối tượng button như sau

<Button
        android:id="@+id/button1"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="ĐỔ XÍ NGẦU"
        android:textColor="@color/button_text"//dòng này
/> 

4. Bạn có thể chạy và thấy các nút có chữ màu xanh (#0000FF), khi nhấn vào sẽ đổi màu thành đỏ (#FF0000).

Phần 2 Màu sắc , chuyển sắc, đường viền, bo góc cho đối tượng

1. Phần 1 chỉ làm được cho màu sắc và áp dụng được cho text, muốn chỉnh trên nút để có thể tô chuyển sắc, bo góc.. ta phải tạo resource theo kiểu drawable. Click phải thư mục res chọn New/Other… Mở rộng mục Android chọn Android XML File rồi nhấn Next. Trong cửa sổ New Android XML File chọn Resource Type rawable File: button_custom. Root Element chọn selector Rồi Next/Finish (thư mục drawable được tự động tạo ra và có file button_custom.xml):

2. Trong file button_custom.xml thêm như sau:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
   <item>
      <shape>
        <!-- phan chuyen sac -->
       <gradient
             android:startColor="#CCFE80"
             android:endColor="#6BB200"
             android:angle="270" />
         <stroke
             android:width="3dp"
             android:color="#0f0000" />
         <corners
             android:radius="3dp"
              />    
        <padding
            android:left="10dp"
            android:top="10dp"
            android:bottom="10dp"
            android:right="10dp"
            />
        </shape>
    
    </item>
    
</selector>

3. Mở file main.xml và thêm vào các nút thuộc tính android:background như sau:

<Button
        android:id="@+id/button1"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="ĐỔ XÍ NGẦU"
        android:textColor="@color/button_text"
        android:background="@drawable/button_custom"//dòng này
        android:textSize="30sp" /> 

Hoàn tất phần giao diện. Bạn chạy chương trình và kiễm tra thấy màu sắc của nút như hình yêu cầu thì OK.

Bước 2: Xử lý

Mình chỉ nêu ý tưởng, code cụ thể thế nào các bạn down source (link đầu trang) về xem nhé

Đầu tiên ta tạo một mảng chứa hình xí ngầu (xúc xắc), ta quy ước luôn xx1 sẽ là 1 nút, xx2 là 2 nút,...

int mang_hinh_xx[]={
            R.drawable.xx1,R.drawable.xx2,R.drawable.xx3,R.drawable.xx4,R.drawable.xx5,R.drawable.xx6
    };

Viết hàm soNgauNhien() trả ra số nút của xí ngầu (từ 1 -> 6) như sau:

public int soNgauNhien()
    {
        return random = (int) (Math.random()*6);
    }

Mỗi hạt xí ngầu sẽ gọi số ngẫu nhiên 1 lần, để lấy được số nút:

public void doXiNgau()
    {
        // Khai báo các biến chứa giá trị xx1,xx2,xx3 và tổng nút
        int value1,value2,value3,sonut;
        // Khai báo biến kq để chứa chuỗi "Thắng" hay "Thua"
        String kq;
        
        //Gán số nút cho xí ngầu
        value1 = soNgauNhien();
        value2 = soNgauNhien();
        value3 = soNgauNhien();
        
        img1.setImageResource(mang_hinh_xx[value1]);
        img2.setImageResource(mang_hinh_xx[value2]);
        img3.setImageResource(mang_hinh_xx[value3]);
        
        //Tổng nút
        sonut = value1+value2+value3+3;
        
        //Xuất kết quả tài xỉu
        if((taixiu & sonut>9) || (!taixiu & sonut<=9))
        {
            kq = "\n Thắng";            
        }
        else
        {
                kq = "\n Thua";
        }
            
        //Xuất kết quả ra textView
        tv.setText("Số nút là :"+sonut+kq);

P/S: Khuyến khích các bạn bổ sung thêm cho bài, ví dụ như bấm nút đổ xí ngầu thì có hiệu ứng xoay xí ngầu xong mới hiện ra kết quả, hay chơi với máy có tính điểm, chơi tới khi hết điểm thì thua, chơi lại.....

File: 
Bạn thấy bài viết này như thế nào?: 
Average: 5.5 (2 votes)
Ảnh của Khanh Hoang

Khanh Hoang - Kenn

Kenn is a user experience designer and front end developer who enjoys creating beautiful and usable web and mobile experiences.

Advertisement

 

jobsora

Dich vu khu trung tphcm

Dich vu diet chuot tphcm

Dich vu diet con trung

Quảng Cáo Bài Viết

 
Học thiết kế – thiết kế ly café sữa ngon nhất của Marketer

Học thiết kế – thiết kế ly café sữa ngon nhất của Marketer

Nhớ hồi mới tập tành theo chân ngành Marketing vào Đại học, mở màn với biết bao môn học đại cương, triết học, thế dục, quân sự, nằm gai nếm mật với Xác suất thống kê, Nguyên lý kế toán

iPhone sẽ có thêm tính năng nhận dạng khuôn mặt (Face Unlock)

iPhone sẽ có thêm tính năng nhận dạng khuôn mặt (Face Unlock)

Theo Patently Apple thì Apple đã gửi đơn xin đăng ký bằng sáng chế cho công nghệ nhận diện khuôn mặt trên các thiết bị di động...

Vấn đề tăng tốc độ load website bằng hệ thống CDN

Vấn đề tăng tốc độ load website bằng hệ thống CDN

Trên phần CDN Resource, bạn bấm vào nút Edit để đến phần CDN Resource Properties, tại đây bấm vào nút Advanced Settings như ảnh bên dưới.

Công ty diệt chuột T&C

 

Diet con trung