What is the best way to eliminate the white padding block at the bottom of an Android WebView app?

I am fairly new to android coding and recently developed a webview app for my church. Even though the apk was generated successfully, I am facing an issue with persistent white space at the bottom of the screen.

Despite removing all android:padding references in the content_main.xml file, the problem persists.

I have searched forums hoping to find a solution to this issue, but most threads only helped me remove padding code without addressing the white space problem.

If necessary, I can share code snippets. Thank you in advance! View a visual example of the white block at the bottom

activity_main.xml------------------

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimaryDark"
        app:popupTheme="@style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>

<include layout="@layout/content_main" />

activity_main.xml------------------

content_main.xml-------------------

<ProgressBar
    android:layout_centerHorizontal="true"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:layout_gravity="center_vertical|center_horizontal"
    android:id="@+id/progressBar1"/>

<TextView
    android:layout_below="@+id/progressBar1"
    android:layout_height="wrap_content"
    android:id="@+id/LoadingText"
    android:layout_width="fill_parent"
    android:text="Loading, Please Wait.."
    android:textSize="20sp"
    android:gravity="center_vertical|center_horizontal">
</TextView>

<WebView
    android:id="@+id/activity_main_webview"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"/>

content_main.xml------------------

MainActivity.java------------------ package org.communionchapelefca.ccsatx;

    import android.app.Activity;
    import android.app.AlertDialog;
    import android.content.DialogInterface;
    import android.graphics.Bitmap;
    import android.os.Bundle;
    import android.view.KeyEvent;
    import android.view.Menu;
    import android.view.MenuItem;
    import android.webkit.WebSettings;
    import android.webkit.WebView;
    import android.webkit.WebViewClient;
    import android.widget.ProgressBar;

public class MainActivity extends Activity {

private WebView mWebView;
ProgressBar progressBar;


@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    mWebView = (WebView) findViewById(R.id.activity_main_webview);

    progressBar = (ProgressBar) findViewById(R.id.progressBar1);

    WebSettings webSettings = mWebView.getSettings();
    webSettings.setJavaScriptEnabled(true);
    mWebView.loadUrl("http://communionchapelefca.org/edy-home");
    mWebView.setWebViewClient(new HelloWebViewClient());


}

private class HelloWebViewClient extends WebViewClient{


    @Override
    public void onPageStarted(WebView view, String url, Bitmap favicon) {
        // TODO Auto-generated method stub
        super.onPageStarted(view, url, favicon);
    }

    @Override
    public boolean shouldOverrideUrlLoading(WebView webView, String url)
    {
        webView.loadUrl(url);
        return true;
    }

    @Override
    public void onPageFinished(WebView view, String url) {
        // TODO Auto-generated method stub
        super.onPageFinished(view, url);

        progressBar.setVisibility(view.GONE);
    }

}


@Override
public boolean onKeyDown(int keyCode, KeyEvent event)
{ //if back key is pressed
    if((keyCode == KeyEvent.KEYCODE_BACK)&& mWebView.canGoBack())
    {
        mWebView.goBack();
        return true;

    }

    return super.onKeyDown(keyCode, event);

}




@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.menu_main, menu);
    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    // Handle action bar item clicks here. The action bar will
    // automatically handle clicks on the Home/Up button, so long
    // as you specify a parent activity in AndroidManifest.xml.
    int id = item.getItemId();

    //noinspection SimplifiableIfStatement
    if (id == R.id.action_settings) {
        return true;
    }

    return super.onOptionsItemSelected(item);
}

public void onBackPressed() {
    AlertDialog.Builder alertDialogBuilder = new AlertDialog.Builder(
            MainActivity.this);

    // set title
    alertDialogBuilder.setTitle("Exit");

    // set dialog message
    alertDialogBuilder
            .setMessage("Do you really want to exit?")
            .setCancelable(false)
            .setPositiveButton("Yes",new DialogInterface.OnClickListener() {
                public void onClick(DialogInterface dialog,int id) {
                    // if this button is clicked, close
                    // current activity
                    MainActivity.this.finish();
                }
            })
            .setNegativeButton("No",new DialogInterface.OnClickListener() {
                public void onClick(DialogInterface dialog,int id) {
                    // if this button is clicked, just close
                    // the dialog box and do nothing
                    dialog.cancel();
                }
            });

    // create alert dialog
    AlertDialog alertDialog = alertDialogBuilder.create();

    // show it
    alertDialog.show();
}

} MainActivity.java------------------

For the html code for the page we use Wordpress to host it. I've disabled all footers and such for what I think are the likely culprits. When opening the page (www.communionchapelefca.org/edy-home) it does not display the white block at the bottom.

Please let me know if other XML or java files need to be shared. Your assistance is highly appreciated.

Answer №1

To resolve the issue, I simply pressed the enter key multiple times to create space at the end of the document. After that, I inserted some text at the bottom and styled it with the same color as the background. It may not have been the most elegant solution, but it did the trick.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for eliminating annoying white space on petite gadgets with css programming?

Having an issue with my static html page where I am seeing white space on the right side when checking responsiveness. I have tried multiple solutions found here on stack overflow, including adding the following code: I attempted to add this inline: html ...

Achieve horizontal wrapping of div elements

Currently, I am developing a blog where search results for articles will be displayed within divs. The design of the website is completely horizontal, meaning that articles scroll horizontally. Creating a single line of divs is straightforward, but it&apo ...

Guide on adjusting the darkness of a MaterialUI Avatar component image and adding text to it

I'm currently working with the Avatar component from Material UI along with Tailwind CSS. I found that by simply adding the image URL to the src, it displays the avatar successfully. <Avatar alt="Cindy Baker" src="https://mui.com/sta ...

Module ‘gulp’ could not be located

Whenever I try to execute the ionic build android command, it keeps showing me an error message: WARNING: ionic.project has been updated to ionic.config.json, so you need to rename it. Oops! It seems like there's a missing module in your gulpfile: Mo ...

Exclusive Pages in NextJS for Development Purposes

I want to set up a /storybook page specifically for development purposes. However, I do not want this page to be accessible in production mode. How can we make that happen? ...

Is there a way to eliminate the CSS width and height properties and instead establish a custom max-width for an image tag?

Currently, I have incorporated my theme's CSS file into my application and it contains the following code: .status .who img { float: left; height: 40px; margin-right: 10px; width: 40px; } However, I want it to appear like this: .status .who ...

How can I customize the appearance of a specific tagged page on my Tumblr blog?

Although I have a solid grasp of HTML & CSS, I am encountering some difficulties with the Tag Page feature on Tumblr. Specifically, I want to change the heading displayed on the /tagged/vld tag page without altering the URL. Currently, the heading is gener ...

Tips for transferring information from a form to your email address

I am trying to find a way to automatically send form data to my email without the user having to open their inbox. I attempted to use the "mailto" function but it didn't work as desired, still opening the email box. Here is the script I tried: functio ...

Implement Infinite Scrolling Pagination in WordPress

I'm completely new to Wordpress and currently utilizing the FoundationPress theme. My goal is to include a button that users can click on to load more posts. Essentially, I want users to see four blog posts initially and then be able to load the next ...

A guide to implementing drag and drop functionality using JavaScript

I have developed a unique drag and drop application that features both a left and right panel. The issue I am facing is that when I drag the ball from the left panel to the right panel, it does get dragged successfully. However, the problem arises when the ...

Troubleshooting problem with text alignment in ViewPager on Android version 5.1.1?

I'm currently working on an Android application that utilizes a Custom ViewPager. I've encountered a problem with the functionality, which is outlined below in the following steps: Initially, when I open a new activity within the ViewPager and ...

Tips for automating dialog box scroll with selenium in Java

I'm attempting to automate the Instagram website, but when I click on the followers link it opens a dialog box with users to follow. However, when I try to scroll within that dialog box, it ends up scrolling the main page rather than the followers dia ...

What is the best way to retrieve the longest call duration record from the Contacts database on an Android device, utilizing a cursor?

I tried using the code snippet below to fetch the maximum call duration from the call logs database on my Android device, inspired by this discussion on Stack Overflow: Querying the max value of a column in SQLite For Android. Cursor cur = managedQuery(Ca ...

Choosing between notifyDataSetChanged() and notifyItemChanged() when dealing with different dataset sizes

I am currently working with a RecyclerView that contains a dataset of around 5000 items. Users have the ability to select multiple items and update their data by simply clicking a button. The issue at hand: When only a few items are selected, using not ...

using Javascript to eliminate necessary tags from concealed tabs

My goal is to dynamically remove the required tag from fields in hidden tabs when a tab is clicked using JavaScript. The presence of the required tag on unused fields causes issues with form submission, preventing data insertion into the database. Here&apo ...

Create a custom Angular.js directive that showcases a specified segment of a string in bold font

I need assistance with my Angular table display. Here is the current setup: <table class="row"> <tr ng-repeat="x in myWelcome | filter :search"> <td>{{$index}}</td> <td>{{x._id}}</td> <td ...

Could Android databinding getters dynamically return specific fields based on the argument passed to the getter?

An error is thrown by the compiler stating that a build exception occurred in relation to a getter method marked with @Bindable, which must follow JavaBeans convention. This getter method accepts one parameter (phototag) and returns the value of a specific ...

Guide to saving a Python docx file on the client side with the help of Ajax

I am currently using Python 3.6 with Django, and my code snippet is shown below: from docx import Document document = Document() document.add_heading('My docx', 0) document.save('myFile.docx') return HttpResponse(document, content_typ ...

Why isn't my useState function initializing with the default value?

Below is a simplified version of my code: const handleEdit = async (event) => { event.preventDefault(); if (parentLayer === 0) { const { content, attachment} = event.target.elements; let contentValue = content.value; setEdite ...

After the form is submitted, the script is activated once more

Whenever I click the button that triggers an AJAX POST script multiple times, the script gets activated repeatedly. This results in items being created more than once. How can I solve this issue? $(document).delegate(".add_page_submit","click",fu ...