暖機和預先擷取:使用自訂分頁服務

本指南第三部分將著重於自訂分頁服務,以及在應用程式中使用這項服務可帶來更好使用者體驗的原因:

  • 立即開啟外部內容:使用 warmup() 會在使用者點選連結之前,在背景啟動瀏覽器程序,開啟連結時可節省最多 700 毫秒的時間。mayLaunchUrl() 會預先擷取網頁。同時使用這兩個 API 可讓網頁立即載入,大幅改善自訂分頁整合的使用者體驗。
  • 更妥善處理已最小化的自訂分頁:只要在啟動自訂分頁時連線至自訂分頁服務,並使用相同的 CustomTabSession,Chrome 就能在啟動新分頁前移除先前已最小化的自訂分頁,提供更一致的使用者體驗。

必要步驟如下:

  1. 使用 CustomTabsClient.getPackageName(...) 檢查預設瀏覽器是否支援自訂分頁。如果是,請使用 CustomTabsClient.bindCustomTabsService() 繫結至 CustomTabsService。
  2. 連線至 CustomTabsService 後,在 CustomTabsServiceConnection.onCustomTabsServiceConnected() 回呼中執行以下操作:

    a. 使用 CustomTabsClient.warmup() 暖機瀏覽器程序。b. 使用 CustomTabsClient.newSession() 建立新的 CustomTabsSession

  3. 您可以選擇使用 CustomTabsSession.mayLaunchUrl(),預先載入使用者可能會造訪的網頁。

  4. 啟動新的自訂分頁時,請使用建構函式 new CustomTabsIntent.Builder(session)CustomTabsSession 傳遞至 CustomTabsIntent.Builder

如果應用程式指定的 Android API 級別 30CustomTabsClient.getPackageName(...) 會要求您在 Android 資訊清單加入查詢部分,並宣告符合自訂分頁支援的瀏覽器的意圖篩選器。

<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>

以下是如何連線至 Custom Tabs 服務的完整範例:

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));
        }
    });
}

在 Android 上,網址可由 Android 應用程式處理。舉例來說,如果使用者已安裝 Facebook 應用程式,並點選 Facebook 貼文的連結,通常會希望連結在 Facebook 應用程式中開啟,而不是在瀏覽器中開啟。

根據預設,「自訂分頁」會在已安裝應用程式的個別 Android 應用程式中開啟連結。不過,一旦建立 CustomTabsServiceConnection,這項行為就會停止運作,所有網址都會改為在自訂分頁中開啟。為了改善使用者體驗,建議您使用下列程式碼重新啟用這項行為:

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

接下來:瞭解如何調整自訂分頁的使用體驗