11

I have an Android WebView which should load the following URLs:

https://buchung.salonmeister.de/ort/301655/menue/#offerId=907601&venueId=301655

https://buchung.salonmeister.de/place/#offer-details-page?id=907599&venueId=301655

Here is what I did:

<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"
                android:background="@android:color/holo_orange_light"
                tools:context=".MainActivityFragment">



    <WebView
        android:id="@+id/webView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentBottom="true"
        android:layout_margin="5dp"
        android:layout_above="@+id/progressBar"></WebView>


    <ProgressBar
        android:id="@id/progressBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:visibility="invisible"
        style="?android:attr/progressBarStyleHorizontal"/>

    <TextView
        android:id="@+id/titleView"
        android:text="@string/hello_world"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

</RelativeLayout>

In onCreateView():

  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container,
                           Bundle savedInstanceState) {
       View v = inflater.inflate(R.layout.fragment_main, container, false);

        String url = // some url
        final ProgressBar progressBar = (ProgressBar)v.findViewById(R.id.progressBar);
        progressBar.setMax(100);

        final TextView titleView = (TextView)v.findViewById(R.id.titleView);


        mWebView = (WebView)v.findViewById(R.id.webView);
        mWebView.getSettings().setJavaScriptEnabled(true);
        mWebView.getSettings().setAllowFileAccess(true);
        mWebView.getSettings().setAllowContentAccess(true);

        mWebView.setWebViewClient(new WebViewClient() {
          @Override
          public boolean shouldOverrideUrlLoading(WebView view, String url) {
            return false;
          }
        });

        mWebView.setWebChromeClient(new WebChromeClient() {
          @Override
          public void onProgressChanged(WebView view, int progress) {
            if (progress == 100) {
              progressBar.setVisibility(View.INVISIBLE);
              progressBar.setProgress(0);
            } else {
              progressBar.setVisibility(View.VISIBLE);
              progressBar.setProgress(progress);
            }
          }

          @Override
          public void onReceivedTitle(WebView view, String title) {
            titleView.setText(title);
          }
        });
        mWebView.loadUrl(url);

        return v;
}

The screen is empty when I start my activity.

Note: This is not a layout issue. Please do not comment on layout and focus on the real problem.

How can I load the above urls in a WebView?

Edit: Here are the permissions I gave:

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.READ_PHONE_STATE" />
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" />
    <uses-permission android:name="android.permission.GET_ACCOUNTS" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

Edit:

In my console I get the following:

I/chromium: [INFO:CONSOLE(84)] "undefined", source: https://buchung.salonmeister.de/place/ (84)

09-13 15:12:33.230 28407-28407/de.test.webviewtest I/chromium: [INFO:CONSOLE(1)] "Uncaught Error: Script error for: widget/venue-menu/mobile/venue-menu-app
09-13 15:12:33.230 28407-28407/de.test.webviewtest I/chromium: http://requirejs.org/docs/errors.html#scripterror", source: https://buchung.salonmeister.de/javascript-module/1.162.3/thirdparty/require.2.1.10.js (1)
nhaarman
  • 98,571
  • 55
  • 246
  • 278
Michael
  • 32,527
  • 49
  • 210
  • 370

7 Answers7

7

The first problem is you have to swap the position of ProgressBar and WebView.

<ProgressBar
    android:id="@id/progressBar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:visibility="invisible"
    style="?android:attr/progressBarStyleHorizontal"/>

<WebView
    android:id="@+id/webView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_alignParentBottom="true"
    android:layout_margin="5dp"
    android:layout_above="@id/progressBar"/> 

The second problem is this line:

android:layout_above="@+id/progressBar"

Inside a RelativeLayout, you must have the view id declared in advance, so that another view can be layouted above(right, left is the same way) to.

And again is the same line:

android:layout_above="@+id/progressBar"

Inside a RelativeView, a view can not layout above(or to below, to left to right) to an ID which is generated for nothing.

You do

@+id/progressBar

the IDE will auto-generate a new ID, this ID is not the same ID of you mean the WebView to layout above to. And in your ProgressBar declaration, you @+id/progressBar again, which it will re-generate another id.

So, your WebView is layouted above to nothing, you can not even see the WebView, it may loads the URLs, and you just can't see it.

Good luck.

5

Your URL is https so It's ssl problem.

You can find a solution in other question.

mWebView.setWebViewClient(new WebViewClient() {

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

    @Override
    public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
        handler.proceed(); // Ignore SSL certificate errors
    }
});
Hogun
  • 602
  • 6
  • 9
4

if you want you can try to use Indeterminate Progress Bar Example and remove setWebChromeClient try this code :

public class WebViewActivityFragment extends Fragment {

 public WebViewActivityFragment() {
 }

 @Override
 public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    //return inflater.inflate(R.layout.fragment_web_view, container, false);

    View v = inflater.inflate(R.layout.fragment_web_view, container, false);

    final String url = "https://buchung.salonmeister.de/ort/301655/menue/#offerId=907601&venueId=301655";//"https://google.com.vn";
    final ProgressBar progressBar = (ProgressBar)v.findViewById(R.id.progressBar);
    progressBar.setMax(100);
    progressBar.setVisibility(View.GONE);
    final TextView titleView = (TextView)v.findViewById(R.id.titleView);
    WebView mWebView = (WebView) v.findViewById(R.id.webView);
    mWebView.setInitialScale(1);
    mWebView.getSettings().setLoadWithOverviewMode(true);
    mWebView.getSettings().setUseWideViewPort(true);
    mWebView.getSettings().setJavaScriptEnabled(false);
    mWebView.getSettings().setAllowFileAccess(true);
    mWebView.getSettings().setAllowContentAccess(true);
    mWebView.setScrollbarFadingEnabled(false);
    mWebView.setWebViewClient(new WebViewClient() {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            return false;
        }

         @Override
        public void onPageFinished(WebView view, String url) {
         progressBar.setVisibility(View.GONE);
         progressBar.setProgress(100);
         super.onPageFinished(view, url);
        }

        @Override
        public void onPageStarted(WebView view, String url, Bitmap favicon) {
         progressBar.setVisibility(View.VISIBLE);
         progressBar.setProgress(0);
         super.onPageStarted(view, url, favicon);
        }
    });


    mWebView.loadUrl(url);

    return v;
}

}

3

UPDATE: with setJavaScriptEnabled(false);, the Url "https://buchung.salonmeister.de/ort/301655/menue/#offerId=907601&venueId=301655" can displayed successfully in the WebView.

enter image description here

public class WebViewActivityFragment extends Fragment {

    public WebViewActivityFragment() {
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        //return inflater.inflate(R.layout.fragment_web_view, container, false);

        View v = inflater.inflate(R.layout.fragment_web_view, container, false);

        final String url = "https://buchung.salonmeister.de/ort/301655/menue/#offerId=907601&venueId=301655";//"https://google.com.vn";
        final ProgressBar progressBar = (ProgressBar)v.findViewById(R.id.progressBar);
        progressBar.setMax(100);
        final TextView titleView = (TextView)v.findViewById(R.id.titleView);
        WebView mWebView = (WebView) v.findViewById(R.id.webView);
        mWebView.setInitialScale(1);
        mWebView.getSettings().setLoadWithOverviewMode(true);
        mWebView.getSettings().setUseWideViewPort(true);
        mWebView.getSettings().setJavaScriptEnabled(false);
        mWebView.getSettings().setAllowFileAccess(true);
        mWebView.getSettings().setAllowContentAccess(true);
        mWebView.setScrollbarFadingEnabled(false);
        mWebView.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                return false;
            }
        });

        mWebView.setWebChromeClient(new WebChromeClient() {
            @Override
            public void onProgressChanged(WebView view, int progress) {
                if (progress == 100) {
                    progressBar.setVisibility(View.INVISIBLE);
                    progressBar.setProgress(0);
                } else {
                    progressBar.setVisibility(View.VISIBLE);
                    progressBar.setProgress(progress);
                }
            }

            @Override
            public void onReceivedTitle(WebView view, String title) {
                titleView.setText(title);
            }


        });
        mWebView.loadUrl(url);

        return v;
    }
}

I have used your entire code, here my web view result. I think perhaps that website is not mobile-ready because I tried to open your 2 urls in web browser in my phone the same problem (still loading...)

enter image description here

BNK
  • 23,994
  • 8
  • 77
  • 87
  • 2
    The website is mobile ready try to open it in mobile safari or mobile chrome. – Michael Sep 07 '15 at 07:11
  • 2
    @confile: yes. I have tried to remove the line `mWebView.setWebChromeClient` and now the webView can load the Urls – BNK Sep 07 '15 at 07:42
  • 2
    But if I remove ``setWebChromeClient`` how do I get the progress? – Michael Sep 07 '15 at 07:43
  • 2
    Please wait, I will post my code, now It can load the Url – BNK Sep 07 '15 at 07:45
  • 1
    @confile: you can see my code with some small changes from your – BNK Sep 07 '15 at 07:47
  • Could you please describe what you have changed? – Michael Sep 07 '15 at 07:47
  • `mWebView.setInitialScale(1); mWebView.getSettings().setLoadWithOverviewMode(true); mWebView.getSettings().setUseWideViewPort(true); mWebView.getSettings().setJavaScriptEnabled(false); mWebView.getSettings().setAllowFileAccess(true); mWebView.getSettings().setAllowContentAccess(true); mWebView.setScrollbarFadingEnabled(false);` – BNK Sep 07 '15 at 07:49
  • Could you please add a screenShot how the loaded page looks like with your solution? – Michael Sep 07 '15 at 09:41
  • Please wait until tomorrow because I have no working environment at this moment :-) – BNK Sep 07 '15 at 09:43
  • @confile: I added screenshot – BNK Sep 08 '15 at 01:41
  • @confile: I have tested 1st Url in some APIs (16,19,21,22), only 19 cannot display content – BNK Sep 08 '15 at 04:32
  • Why cannot Version 19 Display The page? – Michael Sep 08 '15 at 05:19
  • I don't know, just inform you that :-). Actually it displayed title only, I think that is the textView – BNK Sep 08 '15 at 05:27
  • No this does not work setJavaScriptEnabled false is a bad idea. – Michael Sep 13 '15 at 13:14
  • You think it's bad idea, but at least it worked in my testing environment. You should check your environment or contact that site's web admin for further check if needed – BNK Sep 13 '15 at 13:38
  • Could you please post a link to a demo project I could download. If it works I give you all the reputation. – Michael Sep 13 '15 at 13:39
  • Please wait until tomorrow morning, however, I don't need you have to do so. – BNK Sep 13 '15 at 13:41
  • I just need you know that I often only post answer when I have tested in my testing environment – BNK Sep 13 '15 at 13:43
  • I cannot reproduce your solution. And why should I disable javascript this would break other urls. There must be a better solution. – Michael Sep 13 '15 at 13:46
  • Ok, please wait until tomorrow because I have not had my source code right now. – BNK Sep 13 '15 at 13:50
  • I would but the bounty ends in 6hours. – Michael Sep 13 '15 at 13:51
  • Ah, don't worry, I don't need that reputation :) – BNK Sep 13 '15 at 13:51
  • I think there is a awarding period after the 6 hours so I will give you the reps after your example works at my device. – Michael Sep 13 '15 at 13:52
  • I have just created a new project with the code in my answer, can display the 1st link (tested in AVD API16). You can download at https://drive.google.com/file/d/0B2HGUM4c0Ywpb1N5SlZLQmVrUlE/view?usp=sharing – BNK Sep 13 '15 at 14:21
  • The screenshot of new project's result in AVD can be view from [this link](https://drive.google.com/file/d/0B2HGUM4c0YwpLUxiM1FaQWhjeVU/view?usp=sharing). Goodnight :) – BNK Sep 13 '15 at 14:32
  • Okay you have 22hours left for the bounty to win. – Michael Sep 13 '15 at 21:38
0

This may solve your issue :

webView.post(new Runnable() {
    @Override
    public void run() {
        webView.loadUrl(url);
    }
});
Nicolas Cornette
  • 772
  • 7
  • 11
0

I encountered the same issue. Setting useWideViewPort from the WebView's settings to true fixed the issue. WebView#getSettings().setUseWideViewPort(true);

mag
  • 81
  • 3
0

The following 2 solutions might help you.

  1. Cross check you have added Internet permission in AndroidManifest.xml

    <uses-permission android:name="android.permission.INTERNET" />

  2. If you are using an emulator then check the internet is working or not. If not then you can try wipe the data of the emulator and check.

enter image description here

raghu
  • 671
  • 5
  • 16