Khởi động và tìm nạp trước: sử dụng Dịch vụ tab tuỳ chỉnh

Sebastian Benz

Phần thứ ba của hướng dẫn này tập trung vào Dịch vụ Thẻ tuỳ chỉnh và lý do khiến việc sử dụng dịch vụ này trong ứng dụng sẽ mang lại trải nghiệm tốt hơn cho người dùng:

• Mở ngay nội dung bên ngoài: việc sử dụng warmup() khiến quá trình của trình duyệt bắt đầu trong nền ngay cả trước khi người dùng nhấp vào một đường liên kết và có thể tiết kiệm tới 700 mili giây khi mở đường liên kết. mayLaunchUrl() tìm nạp trước trang. Việc sử dụng cùng lúc cả hai API cho phép các trang tải ngay lập tức, nhờ đó cải thiện đáng kể trải nghiệm người dùng khi tích hợp Thẻ tuỳ chỉnh.
• Xử lý hiệu quả hơn các Thẻ tuỳ chỉnh thu nhỏ: Bằng cách kết nối với dịch vụ Thẻ tuỳ chỉnh và sử dụng cùng một CustomTabSession khi chạy Thẻ tuỳ chỉnh, Chrome sẽ có thể xoá các Thẻ tuỳ chỉnh đã thu nhỏ trước đó trước khi chạy thẻ mới, nhờ đó mang lại trải nghiệm nhất quán hơn cho người dùng.

Các bước bắt buộc là:

1. Kiểm tra xem trình duyệt mặc định có hỗ trợ Thẻ tuỳ chỉnh hay không bằng cách sử dụng CustomTabsClient.getPackageName(...). Nếu có, hãy liên kết với CustomTabsService bằng cách sử dụng CustomTabsClient.bindCustomTabsService().

2. Sau khi kết nối với CustomTabsService, trong lệnh gọi lại CustomTabsServiceConnection.onCustomTabsServiceConnected(), hãy làm như sau:

   a. Khởi động quá trình của trình duyệt bằng cách sử dụng CustomTabsClient.warmup(). b. Tạo một CustomTabsSession mới bằng CustomTabsClient.newSession().

3. Tìm nạp trước các trang web mà người dùng có thể sẽ truy cập bằng cách sử dụng CustomTabsSession.mayLaunchUrl() (không bắt buộc).

4. Khi chạy một Thẻ tuỳ chỉnh mới, hãy chuyển CustomTabsSession đến CustomTabsIntent.Builder bằng hàm khởi tạo new CustomTabsIntent.Builder(session).

Nếu ứng dụng của bạn nhắm đến API Android cấp 30, thì CustomTabsClient.getPackageName(...) sẽ yêu cầu bạn thêm phần truy vấn vào Tệp kê khai Android, khai báo bộ lọc ý định khớp với các trình duyệt có hỗ trợ Thẻ tuỳ chỉnh.

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">
  …
   <queries>
        <intent>
            <action android:name="android.support.customtabs.action.CustomTabsService" />
        </intent>
    </queries>
</manifest>

Dưới đây là ví dụ đầy đủ về cách kết nối với một dịch vụ Thẻ tuỳ chỉnh:

private CustomTabsClient mClient;
private CustomTabsSession mSession;

private CustomTabsServiceConnection mConnection = new CustomTabsServiceConnection() {
    @Override
    public void onCustomTabsServiceConnected(
            @NonNull ComponentName name,
            @NonNull CustomTabsClient client
    ) {
        mClient = client;
        // Warm up the browser process
        mClient.warmup(0 /* placeholder for future use */);
        // Create a new browser session
        mSession = mClient.newSession(new CustomTabsCallback());
        // Pre-render pages the user is likely to visit
        // you can do this any time while the service is connected
        mSession.mayLaunchUrl(Uri.parse("https://developers.android.com"), null, null);
    }

    @Override
    public void onServiceDisconnected(ComponentName name) {
        mClient = null;
        mSession = null;
    }
};

private void bindCustomTabService(Context context) {
    // Check for an existing connection
    if (mClient != null) {
        // Do nothing if there is an existing service connection
        return;
    }

    // Get the default browser package name, this will be null if
    // the default browser does not provide a CustomTabsService
    String packageName = CustomTabsClient.getPackageName(context, null);
    if (packageName == null) {
        // Do nothing as service connection is not supported
        return;
    }
    CustomTabsClient.bindCustomTabsService(context, packageName, mConnection);
}

@Override
protected void onCreate(Bundle savedInstanceState) {
…
    bindCustomTabService(this);
    findViewById(R.id.button).setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            String url = "https://developers.android.com";
            CustomTabsIntent intent = new CustomTabsIntent.Builder(mSession)
                    .build();
            intent.launchUrl(MainActivity.this, Uri.parse(url));
        }
    });
}

Mở đường liên kết trong ứng dụng Android

Trên Android, các ứng dụng Android có thể xử lý URL. Ví dụ: nếu người dùng đã cài đặt ứng dụng Facebook và nhấp vào một đường liên kết đến bài đăng trên Facebook, họ thường thích đường liên kết mở trong ứng dụng Facebook thay vì trong trình duyệt.

Theo mặc định, Thẻ tuỳ chỉnh sẽ mở các đường liên kết trong ứng dụng Android tương ứng nếu đã được cài đặt. Tuy nhiên, sau khi CustomTabsServiceConnection được thiết lập, hành vi này sẽ ngừng hoạt động và tất cả URL sẽ mở trong Thẻ tuỳ chỉnh. Để cải thiện trải nghiệm người dùng, bạn nên bật lại hành vi này bằng đoạn mã sau:

CustomTabsIntent customTabsIntent = new CustomTabsIntent.Builder()
    .setSendToExternalDefaultHandlerEnabled(true)
    .build();

Tiếp theo: Tìm hiểu cách đổi kích thước trải nghiệm Thẻ tuỳ chỉnh.