In this article, we have to create a webview layout in activity with a firebase URL string. So, we must implement the code below in your project and follow it step by step.
STEP: 01
Add internet permission in the AndroidManifest.xml layout
<uses-permission android:name="android.permission.INTERNET" />
STEP: 02
Now, we have to replace DakActionBar with NoActionBar.
parent="Theme.MaterialComponents.DayNight.NoActionBar"
STEP: 03
Now, we have to add some string sentences into strings.xml.
<string name="custom_app_name">WebView App</string>
<string name="website_url">https://www.demowebsite.com</string>
STEP: 04
Now, we have to add some files to the drawable file named ic_back, ic_refresh, and logo. If you are not able to add then you have to our YouTube video.
STEP: 05
And, we have to create and design into activity_main.xml layout with the help of constraint layout. Here we can implement a click-button system which is an open webview layout.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/purple_200"
android:fitsSystemWindows="true"
tools:context=".MainActivity">
<ImageView
android:layout_width="120dp"
android:layout_height="120dp"
android:contentDescription="@string/app_name"
android:src="@drawable/logo"
app:layout_constraintBottom_toTopOf="@+id/openWebView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.cardview.widget.CardView
android:id="@+id/openWebView"
android:layout_width="250dp"
android:layout_height="50dp"
app:cardCornerRadius="48dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.7">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Open WebView"
android:textColor="@color/purple_200"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
STEP: 06
And now, we have to create java code on the button-click system in MainActivity.class.
CardView cardViewBtn = findViewById(R.id.openWebView);
cardViewBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Intent intent = new Intent(MainActivity.this, HomeActivity.class);
startActivity(intent);
}
});
STEP: 07
And, we have to create and design a webview layout into activity_home.xml layout with the help of a constraint layout.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white"
android:fitsSystemWindows="true"
android:orientation="vertical"
tools:context=".HomeActivity">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/constraintLayout"
android:layout_width="0dp"
android:layout_height="50dp"
android:background="@color/purple_200"
android:paddingStart="8dp"
android:paddingEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.cardview.widget.CardView
android:id="@+id/backBtn"
android:layout_width="32dp"
android:layout_height="32dp"
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground"
app:cardCornerRadius="100dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.3">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="18dp"
android:layout_height="18dp"
android:contentDescription="@string/app_name"
android:src="@drawable/ic_back"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="@+id/refreshBtn"
android:layout_width="32dp"
android:layout_height="32dp"
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground"
app:cardCornerRadius="100dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.3">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:contentDescription="@string/app_name"
android:src="@drawable/ic_refresh"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="36dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
app:cardCornerRadius="100dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/refreshBtn"
app:layout_constraintStart_toEndOf="@+id/backBtn"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.3">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingStart="12dp"
android:paddingEnd="12dp">
<TextView
android:id="@+id/websiteUrl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLength="36"
android:text="@string/website_url"
android:textSize="14sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
<WebView
android:id="@+id/webView"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/constraintLayout" />
</androidx.constraintlayout.widget.ConstraintLayout>
STEP: 08
And now, we have to create java code on the webview layout with refresh and back system in HomeActivity.class.
Some Variables Codes
private WebView webView;
private TextView websiteUrl;
private final FirebaseDatabase firebaseDatabase = FirebaseDatabase.getInstance();
private final DatabaseReference databaseReference = firebaseDatabase.getReference();
private final DatabaseReference childReference = databaseReference.child("url");
this code is imported under the onCreate method.
websiteUrl = findViewById(R.id.websiteUrl);
webView = findViewById(R.id.webView);
WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);
webView.setWebViewClient(new WebViewClient());
CardView refreshBtn = findViewById(R.id.refreshBtn);
refreshBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
webView.reload();
}
});
CardView backBtn = findViewById(R.id.backBtn);
backBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
finish();
}
});
Now, remain some methods here to load webview with the help of Firebase.
@Override
public void onBackPressed() {
if (webView.canGoBack()) {
webView.goBack();
} else {
super.onBackPressed();
}
}
@Override
protected void onStart() {
super.onStart();
childReference.addValueEventListener(new ValueEventListener() {
@Override
public void onDataChange(@NonNull DataSnapshot dataSnapshot) {
String message = dataSnapshot.getValue(String.class);
websiteUrl.setText(message);
webView.loadUrl(message);
}
@Override
public void onCancelled(@NonNull DatabaseError databaseError) {
}
});
}
***** THANK YOU *****