Is it possible to hide URL bar on Chrome Custom Tabs

Question

I'm looking for a way to, as the title says hide the url bar.

I've got this so far but it hasn't changed anything.

CustomTabsIntent.Builder builder = new CustomTabsIntent.Builder();
        builder.setShowTitle(false);
        builder.enableUrlBarHiding();
        CustomTabsIntent customTabsIntent = builder.build();
        customTabsIntent.launchUrl(this, Uri.parse(url));

I've tried to use webviews but I've had endless problems with them with regards to file upload and certain css that isn't working well. The Custom Tab works well in all those aspects, and it seems faster.

As per @113408 answer I'm trying to implement a TWA, I've got it working, added the link between the website and the app and the app to the website, but the URL bar is still viable.

Here is the manifest file as it is the only coding I've done.

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.app.comppanynme.twatest">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme" >

        <meta-data
            android:name="asset_statements"
            android:resource="@string/asset_statements" />

        <activity
            android:name="android.support.customtabs.trusted.LauncherActivity">

            <!-- Edit android:value to change the url opened by the TWA -->
            <meta-data
                android:name="android.support.customtabs.trusted.DEFAULT_URL"
                android:value="http://192.168.8.46" />

            <!-- This intent-filter adds the TWA to the Android Launcher -->
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>

            <!--
              This intent-filter allows the TWA to handle Intents to open
              airhorner.com.
            -->
            <intent-filter>
                <action android:name="android.intent.action.VIEW"/>
                <category android:name="android.intent.category.DEFAULT" />
                <category android:name="android.intent.category.BROWSABLE"/>

                <!-- Edit android:host to handle links to the target URL-->
                <data
                    android:scheme="http"
                    android:host="192.168.8.46"/>
            </intent-filter>
        </activity>
    </application>
</manifest>

Here is my asset statement

<string name="asset_statements">
        [{
            \"relation\": [\"delegate_permission/common.handle_all_urls\"],
            \"target\": {
                \"namespace\": \"web\",
                \"site\": \"http://192.168.8.46"}
        }]
    </string>

fwiw `enableUrlBarHiding` just hides the bar when the user scrolls down the page. — Blundell, Dec 12 '19 at 16:12

score 12 · Answer 1 · edited Apr 14 '20 at 01:15

12

You can achieve the desired result using Trusted Web Activities

Trusted Web Activities are a new way to integrate your web-app content such as your PWA with your Android app using a protocol based on Custom Tabs.

Ultimately TWA will allow you to do exactly the same as the CustomChromeTabs but offer more functionalities.

What you're looking for more specifically is Remove the URL bar

Trusted Web Activities require an association between the Android application and the website to be established to remove the URL bar.

NB: When hiding the URL bar make sure you serve your page through HTTPS otherwise you will not be able to hide as the page is considered not secure.

How to get HTTPS working on your local development environment in 5 minutes

edited Apr 14 '20 at 01:15

DenverCoder1

2,253
1
10
23

answered Feb 12 '19 at 10:53

113408

3,364
6
27
54

Hi there, thanks for the response. This does seem to be what I'm looking for, however I'm still stuck on trying to hide the URL bar, I've got to the 'Enable debug mode' point, but i'm a little confused, for one is debugging required to hide the bar ? – Demonic218 Feb 12 '19 at 11:40
I've added the association from the website to the app but still no luck. – Demonic218 Feb 12 '19 at 12:02
@Demonic218 can you share your code, and update your question with the current status. thanks – 113408 Feb 12 '19 at 12:04
@Demonic218 I updated the answer with some useful info. – 113408 Feb 12 '19 at 12:25
Testing it on our secure server, still no luck. I am however getting an update to Chrome Stable 72 toast notification, could that be related ? – Demonic218 Feb 12 '19 at 12:42
From the docs: "Note: Trusted Web Activities are available in Chrome on Android, version 72 and above." – 113408 Feb 12 '19 at 12:47
Updated to chrome beta 73, I've got a pop up now saying no certificate found, Is this the Json file it's talking about ? – Demonic218 Feb 12 '19 at 13:12
8

Hello All, it seems no one will answer this... Is there really no way of hiding the Custom Tabs address bar ? (To simply make it work like the Webview object - but a lot better ?) Anyone ? – JamesC Nov 28 '19 at 18:57
@JamesC no, there is not. The address bar is a security feature that can't be removed by developers. – Emil S. Sep 01 '21 at 10:12
@EmilS. do you have any docs reference to back this up? – Keselme Dec 01 '21 at 08:09
@JamesC what did you do about that eventually? – Keselme Dec 01 '21 at 08:09
Well - I think that if we can hide it, given the huge amount of features built into the modern browser - you can make it behave and look (!!) like an application instead of a web page. Just a thought. – JamesC Mar 09 '22 at 20:36
@Keselme Trusted Web Activities (see https://developer.chrome.com/docs/android/trusted-web-activity/) are meant to be full-screen Custom Chrome Tabs. They are only running in fullscreen because the Website authorizes the app through Digital Asset Links, meaning you can only show sites in full screen for which you can set up Digital Asset Links. – Emil S. Aug 29 '22 at 12:03

score 1 · Answer 2 · answered Jun 17 '23 at 11:58

As of 2023, it appears you can do so with Custom Android Tabs alone:

There are a few more things you can do to adjust the UI of a Custom Tab to your needs. Hide the URL bar on scroll to give the user more space to explore web content using setUrlBarHidingEnabled()(true).

Source: https://developer.chrome.com/docs/android/custom-tabs/guide-ui-customization/

Is it possible to hide URL bar on Chrome Custom Tabs

2 Answers2

Linked