Skip to content Skip to sidebar Skip to footer

Opening Custom Webview With "powered By Chrome" With Action Menus

I've recently noticed that when a link is opened in some of few Android apps, they have this similar look and feel and the custom action menus with the 'Powered by Chrome' below th

Solution 1:

It is Chrome Custom Tabs. You can see the sample code from Google Chrome here.

Try the following util class:

publicclassCustomTabs {

    privatestaticfinalintTOOLBAR_SHARE_ITEM_ID=1;

    publicstaticvoidopenTab(Context context, String url) {
        CustomTabsIntent.Builderbuilder=newCustomTabsIntent.Builder();

        enableUrlBarHiding(builder);
        setToolbarColor(context, builder);
        setSecondaryToolbarColor(context, builder);
        setCloseButtonIcon(context, builder);
        setShowTitle(builder);
        setAnimations(context, builder);
        setShareActionButton(context, builder, url);
        addToolbarShareItem(context, builder, url);
        addShareMenuItem(builder);
        addCopyMenuItem(context, builder);

        CustomTabsIntentcustomTabsIntent= builder.build();
        customTabsIntent.launchUrl(context, Uri.parse(url));
    }

    /* Enables the url bar to hide as the user scrolls down on the page */privatestaticvoidenableUrlBarHiding(CustomTabsIntent.Builder builder) {
        builder.enableUrlBarHiding();
    }

    /* Sets the toolbar color */privatestaticvoidsetToolbarColor(Context context, CustomTabsIntent.Builder builder) {
        builder.setToolbarColor(ContextCompat.getColor(context, R.color.colorPrimary));
    }

    /* Sets the secondary toolbar color */privatestaticvoidsetSecondaryToolbarColor(Context context, CustomTabsIntent.Builder builder) {
        builder.setSecondaryToolbarColor(ContextCompat.getColor(context, R.color.colorPrimary));
    }    

    /* Sets the Close button icon for the custom tab */privatestaticvoidsetCloseButtonIcon(Context context, CustomTabsIntent.Builder builder) {
        builder.setCloseButtonIcon(BitmapFactory.decodeResource(context.getResources(), R.drawable.ic_arrow_back));
    }

    /* Sets whether the title should be shown in the custom tab */privatestaticvoidsetShowTitle(CustomTabsIntent.Builder builder) {
        builder.setShowTitle(true);
    }

    /* Sets animations */privatestaticvoidsetAnimations(Context context, CustomTabsIntent.Builder builder) {
        builder.setStartAnimations(context, R.anim.slide_in_right, R.anim.slide_out_left);
        builder.setExitAnimations(context, R.anim.slide_in_left, R.anim.slide_out_right);
    }

    /* Sets share action button that is displayed in the Toolbar */privatestaticvoidsetShareActionButton(Context context, CustomTabsIntent.Builder builder, String url) {
        Bitmapicon= BitmapFactory.decodeResource(context.getResources(), android.R.drawable.ic_menu_share);
        Stringlabel="Share via";

        IntentshareIntent=newIntent(Intent.ACTION_SEND);
        shareIntent.putExtra(Intent.EXTRA_TEXT, url);
        shareIntent.setType("text/plain");

        PendingIntentpendingIntent= PendingIntent.getActivity(context, 0, shareIntent, PendingIntent.FLAG_UPDATE_CURRENT);

        builder.setActionButton(icon, label, pendingIntent);
    }

    /* Adds share item that is displayed in the secondary Toolbar */privatestaticvoidaddToolbarShareItem(Context context, CustomTabsIntent.Builder builder, String url) {
        Bitmapicon= BitmapFactory.decodeResource(context.getResources(), android.R.drawable.ic_menu_share);
        Stringlabel="Share via";

        IntentshareIntent=newIntent(Intent.ACTION_SEND);
        shareIntent.putExtra(Intent.EXTRA_TEXT, url);
        shareIntent.setType("text/plain");

        PendingIntentpendingIntent= PendingIntent.getActivity(context, 0, shareIntent, PendingIntent.FLAG_UPDATE_CURRENT);

        builder.addToolbarItem(TOOLBAR_SHARE_ITEM_ID, icon, label, pendingIntent);

    }

    /* Adds a default share item to the menu */privatestaticvoidaddShareMenuItem(CustomTabsIntent.Builder builder) {
        builder.addDefaultShareMenuItem();
    }

    /* Adds a copy item to the menu */privatestaticvoidaddCopyMenuItem(Context context, CustomTabsIntent.Builder builder) {
        Stringlabel="Copy";
        Intentintent=newIntent(context, CopyBroadcastReceiver.class);
        PendingIntentpendingIntent= PendingIntent.getBroadcast(context, 0, intent, PendingIntent.FLAG_UPDATE_CURRENT);

        builder.addMenuItem(label, pendingIntent);
    }

    publicstaticclassCopyBroadcastReceiverextendsBroadcastReceiver {

        @OverridepublicvoidonReceive(Context context, Intent intent) {
            Stringurl= intent.getDataString();

            ClipboardManagerclipboardManager= (ClipboardManager) context.getSystemService(Context.CLIPBOARD_SERVICE);
            ClipDatadata= ClipData.newPlainText("Link", url);
            clipboardManager.setPrimaryClip(data);

            Toast.makeText(context, "Copied " + url, Toast.LENGTH_SHORT).show();
        }
    }
}

Don't forget to add the dependencies to your app/build.gradle

dependencies {
    ...
    compile'com.android.support:customtabs:25.2.0'
}

and register your BroadcastReceiver in your AndroidManifest.xml

<application>
    ...
    <receiverandroid:name=".CustomTabs$CopyBroadcastReceiver" /></application>

Here is the animation xml:

slide_in_left.xml

<?xml version="1.0" encoding="utf-8"?><translatexmlns:android="http://schemas.android.com/apk/res/android"android:fromXDelta="100%p"android:toXDelta="0%p"android:duration="@android:integer/config_longAnimTime"android:interpolator="@android:anim/overshoot_interpolator" />

slide_in_right.xml

<?xml version="1.0" encoding="utf-8"?><translatexmlns:android="http://schemas.android.com/apk/res/android"android:fromXDelta="-100%p"android:toXDelta="0%p"android:duration="@android:integer/config_longAnimTime"android:interpolator="@android:anim/overshoot_interpolator" />

slide_out_left.xml

<?xml version="1.0" encoding="utf-8"?><translatexmlns:android="http://schemas.android.com/apk/res/android"android:fromXDelta="0"android:toXDelta="-100%p"android:duration="@android:integer/config_longAnimTime"android:interpolator="@android:anim/overshoot_interpolator" />

slide_out_right.xml

<?xml version="1.0" encoding="utf-8"?><translatexmlns:android="http://schemas.android.com/apk/res/android"android:fromXDelta="0"android:toXDelta="100%p"android:duration="@android:integer/config_longAnimTime"android:interpolator="@android:anim/overshoot_interpolator" />

Post a Comment for "Opening Custom Webview With "powered By Chrome" With Action Menus"