Chức năng SetFocus

Áp dụng cho: Ứng dụng canvas Ứng dụng dựa trên mô hình

Chuyển tiêu điểm nhập sang một công cụ điều khiển cụ thể.

Description

Hàm SetFocus cung cấp tiêu điểm nhập cho một công cụ điều khiển. Sau đó, công cụ điều khiển này sẽ tiếp nhận các lần gõ phím của người dùng, cho phép họ nhập vào công cụ điều khiển dùng để nhập văn bản hoặc sử dụng phím Enter để chọn một nút. Người dùng cũng có thể sử dụng phím Tab, cử chỉ chạm, chuột hoặc cử chỉ khác để tự di chuyển tiêu điểm nhập. Hành vi của phím Tab được điều chỉnh bởi thuộc tính TabIndex.

Sử dụng hàm SetFocus để đặt tiêu điểm khi (mỗi trường hợp có một ví dụ bên dưới):

• một công cụ điều khiển dùng để nhập liệu mới được bật hoặc hiển thị để hướng dẫn người dùng các bước tiếp theo và để nhập dữ liệu nhanh hơn.
• một biểu mẫu được xác thực để đặt tiêu điểm và hiển thị công cụ điều khiển nhập liệu vi phạm nhằm mục đích xử lý nhanh.
• một màn hình được hiển thị để đặt tiêu điểm cho công cụ điều khiển dùng để nhập liệu đầu tiên có thuộc tính OnVisible của Màn hình.

Công cụ điều khiển được đặt tiêu điểm có thể khác biệt về mặt hình ảnh dựa trên các thuộc tính FocusedBorderColor và FocusedBorderThickness.

Giới hạn

Bạn chỉ có thể sử dụng hàm SetFocus với:

• Điều khiển Nút
• Điều khiển Biểu tượng
• Điều khiển Hình ảnh
• Điều khiển Nhãn
• Điều khiển TextInput

Bạn không thể đặt tiêu điểm cho các điều khiển nằm trong điều khiển Thư viện điều khiển, Chỉnh sửa biểu mẫu điều khiển hoặc Thành phần. SetFocus có thể được sử dụng với điều khiển trên màn hình có thể cuộn.

Bạn không thể đặt tiêu điểm cho các điều khiển nằm trong điều khiển Bộ chứa.

Bạn chỉ có thể đặt tiêu điểm cho các công cụ điều khiển trên cùng màn hình với công thức có chứa lệnh gọi SetFocus.

Không có tác dụng gì khi cố gắng đặt tiêu điểm cho một công cụ điều khiển chứa thuộc tính DisplayMode (Chế độ hiển thị) được đặt thành Disabled (Tắt). Tiêu điểm sẽ vẫn ở vị trí như cũ.

Trên Apple iOS, bàn phím mềm sẽ chỉ được hiển thị tự động nếu SetFocus được khởi tạo bởi hành động trực tiếp của người dùng. Ví dụ: bàn phím mềm sẽ hiển thị nếu gọi từ thuộc tính OnSelect của một nút nhưng sẽ không hiển thị nếu gọi từ thuộc tính OnVisible của một màn hình.

Bạn chỉ có thể sử dụng hàm SetFocus trong các công thức hành vi.

Cú pháp

SetFocus( Control )

• Control – Bắt buộc. Công cụ điều khiển cần đặt tiêu điểm nhập.

Ví dụ

Đặt tiêu điểm trên một công cụ điều khiển dùng để nhập liệu mới bật hoặc hiển thị

Nhiều giỏ hàng cho phép khách hàng sử dụng địa chỉ giao hàng làm địa chỉ thanh toán nên họ sẽ không cần phải nhập cùng một thông tin 2 lần. Nếu muốn có một địa chỉ thanh toán khác, hộp nhập văn bản địa chỉ thanh toán sẽ được bật và sẽ rất hữu ích nếu hướng dẫn khách hàng đến các biện pháp kiểm soát mới được bật này để nhập dữ liệu nhanh hơn.

Có nhiều công thức để áp dụng ở đây, nhưng công thức chuyển tiêu điểm là ở trên thuộc tính OnUncheck của công cụ điều khiển Check box (Hộp kiểm):

SetFocus( BillingName )

Bạn cũng có thể dùng phím Tab để di chuyển nhanh tiêu điểm từ trường này sang trường khác. Để minh họa rõ hơn, phím Tab không được dùng trong ảnh động.

Cách tạo ví dụ này:

1. Tạo ứng dụng mới.
2. Thêm các công cụ điều khiển Label (Nhãn) với nội dung "Shipping address" (Địa chỉ giao hàng), "Address:" (Tên), "Address:" (Địa chỉ), "Billing Address" (Địa chỉ thanh toán), "Name:" (Tên) và "Address:" (Địa chỉ) rồi đặt chúng vào vị trí như minh họa trong ảnh động.
3. Thêm một công cụ điều khiển Text Input (Nhập văn bản) rồi đổi tên thành ShippingName.
4. Thêm một công cụ điều khiển Text Input (Nhập văn bản) rồi đổi tên thành ShippingAddress.
5. Thêm một công cụ điều khiển Check box (Hộp kiểm) rồi đổi tên thành SyncAddresses.
6. Đặt thuộc tính Văn bản của công cụ điều khiển này theo công thức "Use Shipping address as Billing address".
7. Thêm một công cụ điều khiển Text Input (Nhập văn bản) rồi đổi tên thành BillingName.
8. Đặt thuộc tính Default (Mặc định) trên công cụ điều khiển này theo công thức ShippingName.
9. Đặt thuộc tính DisplayMode trên công cụ điều khiển này theo công thức If( SyncAddresses.Value, DisplayMode.View, DisplayMode.Edit ). Thao tác này sẽ tự động bật hoặc tắt công cụ điều khiển này dựa trên trạng thái của công cụ điều khiển hộp kiểm.
10. Thêm một công cụ điều khiển Text Input (Nhập văn bản) rồi đổi tên thành BillingAddress.
11. Đặt thuộc tính Default (Mặc định) trên công cụ điều khiển này theo công thức ShippingAddress.
12. Đặt thuộc tính DisplayMode trên công cụ điều khiển này theo công thức If( SyncAddresses.Value, DisplayMode.View, DisplayMode.Edit ). Thao tác này sẽ tự động bật hoặc tắt công cụ điều khiển này dựa trên trạng thái của công cụ điều khiển hộp kiểm.
13. Đặt thuộc tính Default (Mặc định) của hộp kiểm này theo công thức true. Thao tác này sẽ đặt mặc định Địa chỉ thanh toán để sử dụng cùng giá trị với Địa chỉ giao hàng.
14. Đặt thuộc tính OnCheck của hộp kiểm này theo công thức Reset( BillingName ); Reset( BillingAddress ). Nếu người dùng chọn đồng bộ hóa Địa chỉ giao hàng và Địa chỉ thanh toán, thì việc này sẽ xóa mọi nội dung người dùng nhập vào trong các trường Billing address (Địa chỉ thanh toán) cho phép thuộc tính Default (Mặc định) trên từng trường lấy các giá trị từ các trường Shipping address (Địa chỉ giao hàng) tương ứng.
15. Đặt thuộc tính OnUncheck của hộp kiểm này theo công thức SetFocus( BillingName ). Nếu người dùng chọn một địa chỉ thanh toán khác, thì điều này sẽ chuyển tiêu điểm sang công cụ điều khiển đầu tiên trong Billing address (Địa chỉ thanh toán). Các công cụ điều khiển đã được bật do thuộc tính DisplayMode (Chế độ hiển thị).

Tập trung vào các vấn đề xác thực

Lưu ý

Mặc dù ví dụ này có vẻ như là một công cụ điều khiển Edit form (Chỉnh sửa biểu mẫu) nhưng rất tiếc, công cụ điều khiển đó chưa hỗ trợ hàm SetFocus. Thay vào đó, ví dụ này sử dụng màn hình có thể cuộn để lưu trữ các các cụ điều khiển nhập văn bản.

Khi xác thực một biểu mẫu, công cụ điều khiển này có thể hữu ích vì không chỉ hiển thị thông báo nếu có vấn đề mà còn đưa người dùng đến trường đang vi phạm. Công cụ điều khiển này có thể đặc biệt hữu ích nếu trường đang xét được cuộn ra khỏi màn hình và không hiển thị.

Trong ảnh động này, nút xác thực được nhấn liên tục cho đến khi tất cả các trường đều được điền đúng. Lưu ý rằng con trỏ chuột không di chuyển xuống từ đầu màn hình. Thay vào đó, hàm SetFocus đã chuyển tiêu điểm nhập sang công cụ điều khiển cần chú ý bằng công thức sau:

If( IsBlank( Name ),
        Notify( "Name requires a value", Error ); SetFocus( Name ),
    IsBlank( Street1 ),
        Notify( "Street Address 1 requires a value", Error ); SetFocus( Street1 ),
    IsBlank( Street2 ),
        Notify( "Street Address 2 requires a value", Error ); SetFocus( Street2 ),
    IsBlank( City ),
        Notify( "City requires a value", Error ); SetFocus( City ),
    IsBlank( County ),
        Notify( "County requires a value", Error ); SetFocus( County ),
    IsBlank( StateProvince ),
        Notify( "State or Province requires a value", Error ); SetFocus( StateProvince ),
    IsBlank( PostalCode ),
        Notify( "Postal Code requires a value", Error ); SetFocus( PostalCode ),
    IsBlank( Phone ),
        Notify( "Contact Phone requires a value", Error ); SetFocus( Phone ),
    Notify( "Form is Complete", Success )
)

Cách tạo ví dụ này:

1. Tạo một ứng dụng trống mới.
2. Từ menu Insert (Chèn), hãy chọn New screen (Màn hình mới) rồi chọn Scrollable (Có thể cuộn).
3. Ở giữa màn hình, hãy thêm các công cụ điều khiển Text input (Nhập văn bản) rồi đặt tên cho chúng là Name (Tên), Street1 (Phố 1), Street2 (Phố 2), City (Thành phố), County (Hạt/Quận), StateProvince (Tiểu bang/Tỉnh), PostalCode (Mã bưu chính) và Phone (Điện thoại). Thêm các công cụ điều khiển Label (Nhãn) phía trên mỗi tên này để xác định các trường. Bạn có thể cần thay đổi kích thước phần nếu phần đó không đủ dài để đặt vừa tất cả các công cụ điều khiển.
4. Thêm một dấu kiểm công cụ điều khiển Icon (Biểu tượng) ở đầu màn hình, phía trên phần có thể cuộn.
5. Đặt thuộc tính OnSelect của công cụ điều khiển biểu tượng theo công thức If( IsBlank( ... nêu trên.

Đặt tiêu điểm khi hiển thị màn hình

Lưu ý

Mặc dù ví dụ này có vẻ như là một công cụ điều khiển Edit form (Chỉnh sửa biểu mẫu) nhưng rất tiếc, công cụ điều khiển đó chưa hỗ trợ hàm SetFocus. Thay vào đó, ví dụ này sử dụng màn hình có thể cuộn để lưu trữ các các cụ điều khiển nhập văn bản.

Tương tự như việc hiển thị một công cụ điều khiển dùng để nhập liệu, khi hiển thị màn hình nhập dữ liệu, sẽ rất hữu ích khi đặt tiêu điểm vào công cụ điều khiển dùng để nhập liệu đầu tiên để nhập dữ liệu nhanh hơn.

Trong ảnh động này, màn hình nhập dữ liệu bên trái không sử dụng SetFocus. Khi hiển thị, không có công cụ điều khiển dùng để nhập nào có tiêu điểm, yêu cầu người dùng phải sử dụng phím Tab, cử chỉ chạm, chuột hoặc cách khác để lấy tiêu điểm cho trường Name (Tên) trước khi có thể nhập một giá trị vào trường đó.

Ở bên phải, chúng ta có cùng một ứng dụng với thuộc tính OnVisible của màn hình nhập dữ liệu được đặt theo công thức này:

SetFocus( Name )

Công thức này tự động đặt tiêu điểm cho trường Name (Tên). Người dùng có thể bắt đầu nhập và dùng phím Tab giữa các trường ngay lập tức mà không cần hành động trước.

Cách tạo ví dụ này:

1. Tạo ứng dụng "Tập trung vào các vấn đề xác thực" ở trên.
2. Trên màn hình này, hãy đặt thuộc tính OnVisible theo công thức SetFocus( Name ).
3. Thêm màn hình thứ hai.
4. Thêm một công cụ điều khiển Button (Nút).
5. Đặt thuộc tính OnSelect của công cụ điều khiển này theo công thức Navigate( Screen1 ).
6. Xem trước ứng dụng từ màn hình này. Nhấn nút. Công thức OnVisible sẽ được đánh giá và trường Name (Tên) sẽ tự động nằm trong tiêu điểm.