Bài 03 · Tìm và nhấp

Cặp hai node được dùng nhiều nhất trong sản phẩm: tìm nó, rồi chạm đúng chỗ vừa tìm thấy.

Bài toán

Ở Bài 01–02 bạn vẽ vùng chạm bằng tay. Cách đó chạy tốt — cho đến khi cái nút di chuyển. Đổi độ phân giải, thay bố cục, cuộn danh sách — và hình chữ nhật của bạn chạm vào khoảng trống.

Cách sửa là ngừng nói cho flow biết nút ở đâu và bắt đầu nói cho nó biết nút trông thế nào. Phát hiện tìm ra nút; Click mượn vị trí khớp.

Bạn sẽ học được

• Nối coordinate source (nguồn tọa độ) của Click vào kết quả Find Image.
• Dữ liệu thực sự chảy giữa hai node ra sao.
• Xử lý "nó không có ở đó" như một kết cục hạng nhất.
• Đọc cấu hình của node trong Properties panel.

Trước khi bắt đầu

• Hoàn thành Bài 02.
• Practice App tại dashboard.html.

Flow

Dựng flow

1. Flow mới. Thêm Find Image tên 1. Find the Collect icon. Bắt biểu tượng dấu tích xanh của nút Collect làm template. Threshold 0.88, timeout 5000 ms.
2. Thêm Click tên 2. Tap exactly where it matched. Trong Properties, đặt Coordinate source là node Find Image — không phải vùng vẽ tay.
3. Thêm Stop: success (thông điệp Collected) và Stop: not on this screen (failure).
4. Nối: Find Image Success → Click, Failure → Stop thất bại; Click Success → Stop thành công.
5. Save, Auto Layout.

Đây là node Find Image đang được chọn, với toàn bộ cấu hình trong Properties panel — template, threshold và search region hiện rõ trong một cái nhìn:

Vì sao dùng từng node — và dữ liệu truyền giữa chúng

Node	Vai trò	Truyền đi cái gì
Find Image	Liên tục chụp màn hình mới cho đến khi template khớp	Kết quả được ghi lại: tâm điểm khớp, hình chữ nhật, độ tin cậy
Click	Suy ra điểm chạm từ kết quả được ghi ấy	Quyền điều khiển

Đây là lần đầu một node tiêu thụ output của node khác. Runtime ghi kết quả của mọi node vào ngữ cảnh lần chạy; khi Click thực thi, nó tra kết quả khớp đã ghi của Find Image và chạm vào tâm.

Hai hệ quả:

• Thứ tự quan trọng. Find Image phải đã thực thi trên nhánh này trước Click. Một Click có nguồn chưa từng chạy (hoặc chưa từng khớp) sẽ rời qua Failure — chẳng có gì để chạm.
• Không còn tọa độ trong flow. Dời nút, đổi độ phân giải, cuộn panel — chừng nào template còn khớp, cú chạm còn bám theo.

Khi bạn thực sự cần con số

Click đọc thẳng kết quả khớp — không cần biến. Nếu có lúc bạn cần tọa độ để tính toán hay ghi log, mục Save results to variables của Find Image gán centerX/centerY cùng các trường khác vào biến có tên. Đó là bộ máy mà Bài 05 xây tiếp lên.

Chạy thử

Trên dashboard, kỳ vọng: khớp trong ~300 ms, chạm, success · Collected — và giả lập điều hướng sang trang Targets (Collect làm đúng việc đó).

Rồi cuộn dashboard đi hoặc mở verify.html và chạy lại: không khớp suốt 5 giây → failure · Collect icon not found. Flow đã xử lý sự vắng mặt thay vì chạm mù vào hư không.

Best practices

• Ưu tiên nguồn Find Image thay cho vùng vẽ tay với bất kỳ thứ gì có thể di chuyển. Chỉ vẽ vùng cho phần khung cố định thật sự.
• Luôn nối port Failure. "Không có ở đó" là kết cục bình thường, và một route không nối sẽ kết thúc lần chạy bằng lỗi chung chung thay vì thông điệp của bạn.
• Template ôm sát. Biểu tượng, không phải nút-kèm-chữ — biểu tượng sống sót qua thay đổi chữ và bố cục.
• Bắt đầu threshold ở 0.88 và dùng Test Node xem độ tin cậy thật trước khi chỉnh.
• Timeout trung thực. 5000 ms nghĩa là "biểu tượng này chính đáng có thể mất tới 5 giây mới hiện". Nếu nó hoặc có hoặc không, 1500–2000 ms tiết kiệm thời gian ở mọi lần chạy âm tính.

Lỗi thường gặp

Lỗi	Hậu quả	Cách sửa
Node nguồn của Click chưa chạy trên nhánh này	Click rời qua Failure	Nối Find Image trước Click, cùng nhánh
Chỉ nối Success	"Không thấy" giết lần chạy bằng TRANSITION_NOT_FOUND	Nối Failure về một Stop
Template bắt kèm nền	Độ tin cậy tụt khi bất kỳ thứ gì xê dịch	Bắt lại mảnh cắt sát
Thêm retry vào Find Image để "tìm kỹ hơn"	Retry không bao giờ chạy — không-thấy mang status success	Tăng timeout thay vào đó

Khắc phục sự cố

Find Image không khớp dù biểu tượng rành rành trên màn hình. Chạy Test Node và đọc độ tin cậy được báo. Thấp hơn hẳn 0.88 → template dính nền hoặc bắt ở mức zoom khác; bắt lại.

Nó khớp nhầm chỗ. Thêm search region trùm hàng nút — vùng tìm nhỏ hơn, ít dương tính giả hơn, và nhanh hơn.

Cú chạm lệch nhẹ khỏi biểu tượng. Nó chạm tâm điểm khớp. Muốn chạm mục tiêu lệch đi (nhãn dưới biểu tượng), dùng Click Offset của Click — xem Click.

Tóm tắt

• Phát hiện tìm; hành động tiêu thụ kết quả khớp đã ghi. Không tọa độ trong flow.
• Node nguồn phải thực thi (và khớp) trên cùng nhánh, trước node đọc nó.
• Nối Failure. Sự vắng mặt là thông tin, không phải lỗi.

Tiếp theo

Đôi khi một phần tử vốn dĩ lúc có lúc không — popup hằng ngày, ưu đãi một lần. Bài 04 · Xử lý popup tùy chọn dựng nhánh rẽ nơi cả hai kết cục đều đúng.

Xem thêm: Find Image · Click · Giải phẫu Flow