How to Use Custom Chrome Tabs in Android? - GeeksforGeeks

28 Mar, 2021
Many apps have to display different types of webpages inside their application. For displaying webpages in Android there are so many features with which we can display webpages in our Android app. Developers generally prefer to use WebView or redirect users to any browser inside their application. But opening the webpage inside a browser as well as displaying a webpage in Android WebView sometimes becomes a heavy task which we have to perform. Instead of using WebView and opening a webpage in the browser. We can simply use the custom chrome tabs in our application to make this task easier and lighter. Many apps use this feature of custom chrome tabs for redirecting their users from their application to any webpage via custom chrome tabs. So in this article, we will take a look at the implementation of Custom Chrome tabs in Android.
Using the Custom Chrome tab we will be simply displaying GFG webpage on a button click in our Android app. A sample GIF is given below from which you will get to know what we are going to do in this article. Note that we are using Java language for the implementation of Chrome tabs in Android.
Step 1: Create a New Project
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Java as the programming language.
Step 2: Add dependency to build.gradle(Module:app)
Navigate to the Gradle Scripts > build.gradle(Module:app) and add the below dependency in the dependencies section. 
implementation ‘androidx.browser:browser:1.2.0’
Now sync option will appear at the top right corner click on the sync now option.  
Step 3: Working with the activity_main.xml file
Go to the activity_main.xml file and refer to the following code. Below is the code for the activity_main.xml file.
XML
<?xml version="1.0" encoding="utf-8"?><RelativeLayout     xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context=".MainActivity">      <Button        android:id="@+id/idBtnCustomChromeTab"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_centerInParent="true"        android:text="Custom Chrome Tabs" />  </RelativeLayout>
Step 4: Working with the MainActivity.java file
Go to the MainActivity.java file and refer to the following code. Below is the code for the MainActivity.java file. Comments are added inside the code to understand the code in more detail.
Java
import android.app.Activity;import android.content.Intent;import android.net.Uri;import android.os.Bundle;import android.view.View;import android.widget.Button;  import androidx.appcompat.app.AppCompatActivity;import androidx.browser.customtabs.CustomTabsIntent;import androidx.core.content.ContextCompat;  public class MainActivity extends AppCompatActivity {      Button customChromeTabBtn;          // url for loading in custom chrome tab    String url = "https://www.geeksforgeeks.org/";      @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);                  // initializing button for opening custom chrome tabs.        customChromeTabBtn = findViewById(R.id.idBtnCustomChromeTab);        customChromeTabBtn.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                                  // initializing object for custom chrome tabs.                CustomTabsIntent.Builder customIntent = new CustomTabsIntent.Builder();                                  // below line is setting toolbar color                 // for our custom chrome tab.                customIntent.setToolbarColor(ContextCompat.getColor(MainActivity.this, R.color.purple_200));                                  // we are calling below method after                 // setting our toolbar color.                openCustomTab(MainActivity.this, customIntent.build(), Uri.parse(url));            }        });    }      public static void openCustomTab(Activity activity, CustomTabsIntent customTabsIntent, Uri uri) {        // package name is the default package        // for our custom chrome tab        String packageName = "com.android.chrome";        if (packageName != null) {                          // we are checking if the package name is not null            // if package name is not null then we are calling             // that custom chrome tab with intent by passing its            // package name.            customTabsIntent.intent.setPackage(packageName);                          // in that custom tab intent we are passing             // our url which we have to browse.            customTabsIntent.launchUrl(activity, uri);        } else {            // if the custom tabs fails to load then we are simply             // redirecting our user to users device default browser.            activity.startActivity(new Intent(Intent.ACTION_VIEW, uri));        }    }}
android
Chrome
Technical Scripter 2020
Android
Java
Technical Scripter
Java
Android
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
How to Create and Add Data to SQLite Database in Android?
Broadcast Receiver in Android With Example
Services in Android with Example
Content Providers in Android with Example
Android RecyclerView in Kotlin
Arrays in Java
Split() String method in Java with examples
For-each loop in Java
Arrays.sort() in Java with examples
Reverse a string in Java