CODEWITHSUNDEEP
androidprogressive-web-appstrusted-web-activity
Leonardo Javier
Leonardo Javier

Reputation: 99

How to hide the URL bar in PWA Android app?

I'm following all steps to convert my PWA into an Android app but it fails to show the URL bar

I've built my PWA I've checked with Lighthouse and scored +90 I've made it native I've obtained SHA256 app signing certificate I've checked my assetlinks.json with digital asset links tool. I've released on Google Play

but I've still had the URL bar at the top of my app

assetlinks.json

[{
  "relation": ["delegate_permission/common.handle_all_urls"],
  "target" : { "namespace": "android_app", "package_name":     "org.mysite.mysite",
               "sha256_cert_fingerprints": ["..."] }
}]

AndroidManifest.xml

apply plugin: 'com.android.application'

def twaManifest = [
    applicationId: 'org.mysite.mysite',
    hostName: 'www.mysite.org', // The domain being opened in the TWA.
    launchUrl: '/', // The start path for the TWA. Must be relative to the domain.
    name: 'MySite', // The name shown on the Android Launcher.
    themeColor: '#000000', // The color used for the status bar.
    backgroundColor: '#e6086e' // The color used for the splash screen background.
]

android {
compileSdkVersion 28
defaultConfig {
    applicationId twaManifest.applicationId
    minSdkVersion 16
    targetSdkVersion 28
    versionCode 19
    versionName "1.19"
    testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"

    // The name for the application on the Android Launcher
    resValue "string", "appName", twaManifest.name

    // The URL that will be used when launching the TWA from the Android Launcher
    resValue "string", "launchUrl", "https://" + twaManifest.hostName + twaManifest.launchUrl

    // The hostname is used when building the intent-filter, so the TWA is able to
    // handle Intents to open https://svgomg.firebaseapp.com.
    resValue "string", "hostName", twaManifest.hostName

    // This variable below expresses the relationship between the app and the site,
    // as documented in the TWA documentation at
    // https://developers.google.com/web/updates/2017/10/using-twa#set_up_digital_asset_links_in_an_android_app
    // and is injected into the AndroidManifest.xml
    resValue "string", "assetStatements",
            '[{ \\"relation\\": [\\"delegate_permission/common.handle_all_urls\\"],' +
                    '\\"target\\": {\\"namespace\\": \\"web\\", \\"site\\": \\"https://' +
                    twaManifest.hostName + '\\"}}]'

    // This attribute sets the status bar color for the TWA. It can be either set here or in
    // `res/values/colors.xml`. Setting in both places is an error and the app will not
    // compile. If not set, the status bar color defaults to #FFFFFF - white.
    resValue "color", "colorPrimary", twaManifest.themeColor

    // Sets the color for the background used for the splash screen when launching the
    // Trusted Web Activity.
    resValue "color", "backgroundColor", twaManifest.backgroundColor

    // Defines a provider authority fot the Splash Screen
    resValue "string", "providerAuthority", twaManifest.applicationId + '.fileprovider'
}
buildTypes {
    release {
        minifyEnabled false
    }
}
compileOptions {
    sourceCompatibility JavaVersion.VERSION_1_8
    targetCompatibility JavaVersion.VERSION_1_8
}
}

dependencies {
implementation fileTree(include: ['*.jar'], dir: 'libs')
implementation 'com.github.GoogleChrome.custom-tabs-    client:customtabs:d08e93fce3'
}

Upvotes: 1

Views: 5244

Answers (2)

Thomas Mcdonnell
Thomas Mcdonnell

Reputation: 11

Hey I assume if you have it in the play store it must be wrapped in a skeleton android app ? These are called TWA's or trusted web apps. You could try hiding the status bar 

<style>
<item name="android:windowActionBar">false</item>
</style>

if that does not work try

Upvotes: 1

nadunc
nadunc

Reputation: 727

To hide address bar & get full screen view of you PWA, you need to have "display": "standalone" property in your PWA's manifest.json file.

Upvotes: 1

Related Questions