SL4A - Xây dựng GUI

Giao diện người dùng đồ họa (GUI) đại diện cho một tập hợp các thành phần đồ họa cho phép người dùng duyệt, truy cập và tương tác với các chức năng của ứng dụng.

Có hai cách tiếp cận cơ bản để tương tác của người dùng với SL4A là:

• Các hộp thoại chẳng hạn như Alerts.

• Sử dụng HTML và JavaScript để xây dựng giao diện người dùng và sau đó là Python để xử lý bất kỳ quá trình xử lý bổ sung nào.

Chương này giải thích cả hai cách tiếp cận.

Hộp thoại Python - Dựa trên GUI

SL4A bao gồm giao diện người dùng để truy cập các phần tử giao diện người dùng cơ bản được cung cấp bởi API android. Các hàm này trả về một đối tượng kết quả là một tuple được đặt tên khi được gọi. Mỗi kết quả được gán một id duy nhất cho mục đích theo dõi. Yếu tố thứ hai là kết quả. Nó đại diện cho đầu vào của người dùng. Tuple cũng bao gồm lỗi phần tử thứ ba để cung cấp phản hồi cho người gọi về bất kỳ tình trạng lỗi nào có thể gặp phải. Nếu không gặp lỗi, phần tử này được đặt thành Không.

Bảng sau liệt kê các hàm UiFacade thường được sử dụng.

Không.	Chức năng & Mô tả UiFacade
1	dialogGetInput Truy vấn người dùng để nhập văn bản. title (String) tiêu đề của hộp nhập liệu (mặc định = Giá trị) message (String) thông báo hiển thị phía trên hộp nhập (mặc định = Vui lòng nhập giá trị :) defaultText (String) văn bản để chèn vào hộp nhập liệu (tùy chọn) Kết quả là đầu vào của người dùng hoặc Không có (null) nếu lệnh hủy được nhấn.
2	dialogShow Hiển thị hộp thoại
3	dialogCreateAlert Tạo hộp thoại cảnh báo. title (String)(không bắt buộc) message (String) (không bắt buộc)
4	dialogDismiss Loại bỏ hộp thoại.
5	dialogCreateDatePicker Tạo hộp thoại chọn ngày. year (Integer) (mặc định = 1970) month (Integer) (mặc định = 1) day (Integer) (mặc định = 1)
6	dialogCreateTimePicker Tạo hộp thoại chọn thời gian. hour (Integer) (mặc định = 0) minute (Integer) (mặc định = 0) is24hour (Boolean) Sử dụng đồng hồ 24 giờ (mặc định = sai)
7	dialogGetPassword Truy vấn người dùng để biết mật khẩu. title (String) tiêu đề của hộp mật khẩu (mặc định = Mật khẩu) message (String) thông báo hiển thị phía trên hộp nhập (mặc định = Vui lòng nhập mật khẩu :)
số 8	dialogGetResponse Trả về phản hồi hộp thoại.
9	dialogSetPositiveButtonText Đặt văn bản nút khẳng định hộp thoại cảnh báo. văn bản (Chuỗi)
10	dialogSetNegativeButtonText Đặt văn bản nút hộp thoại cảnh báo. văn bản (Chuỗi)
11	dialogSetNeutralButtonText Đặt văn bản nút hộp thoại cảnh báo. văn bản (Chuỗi)
12	dialogSetSingleChoiceItems Điều này tạo ra một danh sách các nút radio.
13	dialogSetMultiChoiceItems Điều này tạo ra một hộp kiểm
14	dialogCreateHorizontalProgress Tạo một hộp thoại tiến trình ngang. title (String) (không bắt buộc) message (String) (không bắt buộc) maximum progress (Integer) (mặc định = 100)
15	dialogCreateSpinnerProgress Tạo hộp thoại tiến trình quay vòng. title (String) (không bắt buộc) message (String) (không bắt buộc) maximum progress (Integer) (mặc định = 100)
16	addContexMenuItem Thêm một mục mới vào menu ngữ cảnh. label (String) nhãn cho mục menu này event (String) sự kiện sẽ được tạo khi nhấp vào mục menu eventData (Object) (không bắt buộc)
17	addOptionsMenuItem Thêm một mục mới vào menu tùy chọn. label (String) nhãn cho mục menu này event (String) sự kiện sẽ được tạo khi nhấp vào mục menu eventData (Object) (không bắt buộc) iconName (String)
18	webViewShow Hiển thị một WebView với URL đã cho. url (String) wait (Boolean) chặn cho đến khi người dùng thoát khỏi WebView (tùy chọn)
19	clearContextMenu Xóa tất cả các mục đã thêm trước đó vào menu ngữ cảnh.
20	clearOptionsMenu Xóa tất cả các mục đã thêm trước đó vào menu tùy chọn
21	makeToast Tạo thông báo

Ví dụ

A simple Toast Example

import android 
droid = android.Android() 
uname = droid.getInput("Enter your name") 
print uname  
droid.makeToast("Hello %s" %uname.result)

A Horizontal Progress Bar

import android 
   droid = android.Android() 
   title = "Progress" 
   str = "Loading..." 
   droid.dialogCreateHorizontalProgress(title,str,100) 
   droid.showDialog() 
	
   for x in range(0,99) 
      time.sleep(0.1) 
      droid.dialogSetCurrentProgress(x) 
		
   droid.dialogDismiss()

Hộp thoại Modal Vs Non-Modal

Hộp thoại hoặc cửa sổ phương thức là con của một quá trình hoặc cửa sổ khác. Với hộp thoại phương thức, quá trình xử lý sẽ đợi hoặc chặn cho đến khi người dùng tương tác với hộp thoại mới.

Ví dụ điển hình của trường hợp này là hộp thoại cảnh báo. Cảnh báo sẽ không đóng cho đến khi người dùng thực hiện một hành động.

Hình ảnh sau đây là một ví dụ về hộp thoại phương thức.

Tóm lại, hãy sử dụng hộp thoại phương thức khi bạn cần người dùng nhập liệu trước khi tiếp tục thực thi.

GUI Python với HTML

SL4A cho phép xây dựng Giao diện người dùng đồ họa (GUI) dựa trên CSS, HTML, JavaScript và Python. Phương pháp này sử dụng HTML và JavaScript để xây dựng giao diện người dùng, CSS để tăng cường sự xuất hiện và tính nhất quán của các phần tử và phông chữ HTML và Python để xử lý bất kỳ quá trình xử lý bổ sung nào.

Ví dụ sau minh họa một ví dụ GUI HTML cơ bản:

1. Speech.html

<html> 
   <head> 
      <title>Text To Speech</title> 
		
      <script> 
         var droid = new Android(); 
         var speak = function(){ 
            droid.postEvent("say",document.getElementById("say").value); 
         } 
      </script> 
		
   </head>
	
   <body> 
      <form onsubmit = "speak()";return false;”> 
         <label for = "say">What is your message?</label> 
         <input type = "text" id = "say"/> 
         <input type = "submit" value = "Speak"/> 
      </form> 
   </body> 
	
</html>

2. txtToSpeech.py

import android 
droid = android.Android() 
droid.webViewShow(‘file:///sdcard/sl4a/scripts/Speech.html’) 

while True: 
   result = droid.waitForEvent(‘say’).result 
   droid.ttsSpeak(result[‘data’])

Cả hai tệp - Speech.html and txtToSpeech.py, phải cư trú trong /sdcard/sl4a/scriptsthư mục trên thiết bị. Chạy tập lệnh python để khởi chạy tệp HTML.

Tệp này được khởi chạy bởi webViewShowLệnh gọi API. Sự kiện được tạo khiSpeak được nhấp vào nút.