Nguyên tắc điều hướng

Việc điều hướng giữa các màn hình và ứng dụng khác nhau là phần cốt lõi trong trải nghiệm người dùng. Nguyên tắc sau đây đặt tiêu chí để trải nghiệm người dùng nhất quán và trực quan trên các ứng dụng. Thành phần điều hướng được thiết kế để triển khai các nguyên tắc này theo mặc định, đảm bảo người dùng áp dụng phỏng đoán và mẫu tương tự khi di chuyển giữa các ứng dụng.

Điểm bắt đầu cố định

Mỗi ứng dụng bạn tạo đều có một điểm bắt đầu cố định. Đây là màn hình đầu tiên người dùng nhìn thấy khi khởi chạy ứng dụng từ trình chạy. Điểm này cũng là màn hình cuối cùng người dùng nhìn thấy khi nhấn nút Quay lại trình chạy. Hãy cùng xem ví dụ ứng dụng Sunflower.

Hình 1: Màn hình danh sách là điểm bắt đầu của ứng dụng Sunflower.

Khi khởi chạy ứng dụng Sunflower từ trình chạy, màn hình đầu tiên người dùng nhìn thấy là Màn hình danh sách, danh sách các loài cây trong vườn của họ. Đây cũng là màn hình cuối cùng họ nhìn thấy trước khi thoát khỏi ứng dụng. Nếu nhấn vào nút Quay lại từ màn hình danh sách, người dùng sẽ quay lại trình chạy.

Khi khởi chạy ứng dụng lần đầu, mộtthao tác mớiđược tạo cho người dùng và ứng dụng sẽ hiển thị điểm bắt đầu của nó. Điểm này trở thành điểm cơ sở của ngăn xếp lui và là cơ sở cho trạng thái điều hướng của ứng dụng. Phần trên cùng của ngăn xếp là màn hình hiện tại, còn các điểm trước đó trong ngăn xếp thể hiện lịch sử những nơi bạn đã đến. Ngăn xếp lui luôn có điểm bắt đầu của ứng dụng ở cuối ngăn xếp.

Thao tác thay đổi ngăn xếp lui luôn hoạt động ở đầu ngăn xếp bằng cách đẩy đích đến mới lên đầu ngăn xếp hoặc làm bật đích đến trên cùng khỏi ngăn xếp. Việc điều hướng đến một đích đến sẽ đẩy đích đến đó lên đầu ngăn xếp.

Thành phần điều hướng quản lý mọi thứ tự ngăn xếp lui, dù bạn cũng có thể chọn tự quản lý ngăn xếp lui.

Tính năng Lên và Quay lại giống hệt nhau trong thanh tác vụ của ứng dụng

Hình 2: Nút Lên và Quay lại

Nút Quay lại xuất hiện ở thanh điều hướng hệ thống cuối màn hình và được dùng để di chuyển theo thứ tự thời gian ngược qua lịch sử màn hình mà người dùng sử dụng gần đây. Khi bạn nhấn nút Quay lại, đích đến hiện tại sẽ bật lên trên đầu ngăn xếp lui, sau đó chuyển đến đích đến trước.

Nút Lên sẽ xuất hiện trong thanh ứng dụng ở đầu màn hình. Trong thanh tác vụ của ứng dụng, nút Lên và Quay lại giống hệt nhau.

Nút Lên không bao giờ thoát khỏi ứng dụng của bạn

Nếu người dùng đang ở điểm bắt đầu của ứng dụng, nút Lên sẽ không xuất hiện vì nó không bao giờ thoát khỏi ứng dụng. Tuy nhiên, nút Quay lại sẽ hiển thị và thoát khỏi ứng dụng.

Khi khởi chạy ứng dụng bằng một liên kết sâutrên thanh tác vụ của ứng dụng khác, tính năng Lên sẽ chuyển đổi người dùng quay lại thanh tác vụ của ứng dụng đó và thông quangăn xếp lui mô phỏng chứ không phải đến ứng dụng đã kích hoạt liên kết sâu. Tuy nhiên, nút Quay lại sẽ đưa bạn trở về ứng dụng khác.

Cho dù liên kết sâu hay điều hướng thủ công đến một đích cụ thể, bạn đều có thể sử dụng nút Lên để di chuyển qua các điểm đến trở lại điểm xuất phát.

Khi liên kết sâu với một đích đến trong thanh tác vụ của ứng dụng, mọi ngăn xếp lui hiện tại trong thanh tác vụ ứng dụng sẽ bị xóa và thay thế bằng ngăn xếp lui liên kết sâu.

Lại lấy ứng dụng Sunflower làm ví dụ, giả sử người dùng đã từng khởi chạy ứng dụng này từ màn hình trình chạy và đã điều hướng đến màn hình chi tiết một quả táo. Màn hình Gần đây chỉ ra cho thấy một tác vụ đang tồn tại với phần trên cùng là màn hình chi tiết của Apple.

Hình 3: Điều hướng người dùng thông qua ứng dụng Sunflower và kết quả là ngăn xếp lui.

Tại thời điểm này, người dùng có thể nhấn vào nút Home để đưa ứng dụng vào chế độ nền. Tiếp theo, giả sử ứng dụng này có tính năng liên kết sâu cho phép người dùng khởi chạy trực tiếp vào một màn hình chi tiết về cây cối cụ thể theo tên. Việc mở ứng dụng thông qua liên kết sâu này sẽ thay thế hoàn toàn ngăn xếp lui Sunflower hiện tại trong hình 3 bằng một ngăn xếp lui mới, như trong hình 4:

Hình 4: Theo đường liên kết sâu thay thế ngăn xếp lui hiện có cho ứng dụng Sunflower.

Lưu ý ngăn xếp lui Sunflower được thay thế bằng một ngăn xếp lui tổng hợpvới màn hình chi tiết quả bơ ở trên cùng. Màn hình Vườn của tôi là điểm bắt đầu, cũng được thêm vào ngăn xếp lui. Ngăn xếp lui ban đầu của Sunflower đã biến mất, bao gồm cả thông tin người dùng từng ở trên màn hình chi tiết của Apple trước đây. Những điều này đều rất quan trọng vì ngăn xếp lui tổng hợp phải thực tế. Nó phải khớp với ngăn xếp lui và có thể thao tác bằng cách điều hướng tự nhiên qua ứng dụng.

Để đáp ứng nhu cầu này, ngăn xếp lui tổng hợp được tạo phải là một ngăn đơn giản dựa trên NavGraph. Đối với NavGraph đơn giản mà không lồng nhau, thuộc tính này sẽ bao gồm điểm bắt đầu và đích đến của liên kết sâu. Đối với các biểu đồ điều hướng lồng nhau, ngăn xếp lui tổng hợp cũng chứa điểm bắt đầu của mọi biểu đồ lồng nhau là đối tượng cấp trên của đích đến liên kết sâu.

Thành phần Điều hướnghỗ trợ liên kết sâuvà tạo lại ngăn xếp lui thực tế khi liên kết đến bất kỳ đích đến nào trong biểu đồ điều hướng.