Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
65 views
in Technique[技术] by (71.8m points)

javascript - Remove configurations options from google fileViewer in webView Android Studio

I am displaying google drive files in my app using google drive file viewer in a webView. The fileViewer diplays a top bar with the file name and login option and a bar in the bottom with some options.

Is it possible to hide the top bar and bottom bar?

I think it is possible to do this through javascript in AndroidStudio, but I don't know how to do it

This is the Phone screen with the webView: [Phone screen with the webview]

this is my code on Android Studio to diplay the webview:

  private WebView webView;


    @SuppressLint("SetJavaScriptEnabled")
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_edit);

        String fileId = "1HHNdVFfGSnLLXsvpN5ITEktsdNENLT-jYl1guyNqgZw";
        String url = "https://docs.google.com/file/d/" + fileId + "/view";
        initializeWebViewer(url);
    }

    @SuppressLint("SetJavaScriptEnabled")
    public void initializeWebViewer(String url) {

        webView = (WebView) findViewById(R.id.webViewViewer);

        Log.i("url", url);

        webView.setWebViewClient(new MyWebViewClient());
        WebSettings webViewSettings = webView.getSettings();
        webViewSettings.setJavaScriptCanOpenWindowsAutomatically(true);
        webViewSettings.setJavaScriptEnabled(true);
        webView.loadUrl(url);


    }

    public class MyWebViewClient extends WebViewClient {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            return false;
        }
    }

I used devTools to get the code from page in my phone (I think it is in html, I'm new to this, so sorry if I confused javascript, html or something else) I used the "select an item in the page to inspect it" and erased the code to see if it really was what I was looking for:

I think this is the top bar element in the devTools (If I erase it goes away):

<div class="ndfHFb-c4YZDc-Wrql6b ndfHFb-c4YZDc-N4imRe-NMrWyd-RCfa3e" role="toolbar">
  <div class="ndfHFb-c4YZDc-Wrql6b-SmKAyb" style="margin-right: 12px; padding-left: 12px;">
    <div class="ndfHFb-c4YZDc-Wrql6b-hOcTPc" style="left: 12px;">
      <div class="ndfHFb-c4YZDc-Wrql6b-Bz112c" tabindex="-1" role="img" aria-label="ícone de Apresenta??es Google" style="background-image: url(&quot;//ssl.gstatic.com/docs/doclist/images/mediatype/icon_1_presentation_x32.png&quot;); background-position: left top; background-repeat: no-repeat;"></div>
      <div class="ndfHFb-c4YZDc-Wrql6b-jfdpUb" tabindex="-1">
        <div class="ndfHFb-c4YZDc-Wrql6b-V1ur5d" data-tooltip-unhoverable="true" data-tooltip-delay="500" data-tooltip-class="ndfHFb-c4YZDc-tk3N6e-suEOdc" data-tooltip-align="b,c" data-tooltip-offset="-6">Apresenta??o sem título</div>
        <div class="ndfHFb-c4YZDc-Wrql6b-V1ur5d ndfHFb-c4YZDc-Wrql6b-V1ur5d-hpYHOb">Apresenta??o sem título</div>
        <div class="ndfHFb-c4YZDc-Wrql6b-K4efff-V1ur5d" style="display: none;"></div>
        <div class="ndfHFb-c4YZDc-Wrql6b-K4efff-V1ur5d ndfHFb-c4YZDc-Wrql6b-K4efff-V1ur5d-hpYHOb"></div>
      </div>
      <div class="ndfHFb-c4YZDc-Wrql6b-C7uZwb-b0t70b">
        <div class="ndfHFb-c4YZDc-to915-LgbsSe ndfHFb-c4YZDc-C7uZwb-LgbsSe VIpgJd-TzA9Ye-eEGnhe ndfHFb-c4YZDc-LgbsSe ndfHFb-c4YZDc-C7uZwb-ibnC6b-Btuy5e ndfHFb-c4YZDc-LgbsSe-OWB6Me" role="button" data-tooltip-unhoverable="true" data-tooltip-delay="500" data-tooltip-class="ndfHFb-c4YZDc-tk3N6e-suEOdc"
          data-tooltip-align="b,c" data-tooltip-offset="-6" aria-disabled="true" aria-hidden="true" aria-label="Bloqueado" data-tooltip="Bloqueado" style="user-select: none; display: none;">
          <div class="ndfHFb-c4YZDc-Bz112c ndfHFb-c4YZDc-C7uZwb-LgbsSe-Bz112c ndfHFb-c4YZDc-pGuBYc-Bz112c">
            <div class="ndfHFb-aZ2wEe" dir="ltr">
              <div class="ndfHFb-vyDMJf-aZ2wEe auswjd">
                <div class="aZ2wEe-pbTTYe aZ2wEe-v3pZbf">
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-LK5yu">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-pehrl-TpMipd">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-qwU8Me">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                </div>
                <div class="aZ2wEe-pbTTYe aZ2wEe-oq6NAc">
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-LK5yu">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-pehrl-TpMipd">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-qwU8Me">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                </div>
                <div class="aZ2wEe-pbTTYe aZ2wEe-gS7Ybc">
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-LK5yu">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-pehrl-TpMipd">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-qwU8Me">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                </div>
                <div class="aZ2wEe-pbTTYe aZ2wEe-nllRtd">
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-LK5yu">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-pehrl-TpMipd">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-qwU8Me">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="ndfHFb-c4YZDc-Wrql6b-DdWCyb-b0t70b" style="display: none;">
      <div class="ndfHFb-c4YZDc-Wrql6b-FNFY6c-J42Xof-qMHh7d" style="display: none;">
        <div class="ndfHFb-c4YZDc-Wrql6b-FNFY6c ndfHFb-c4YZDc-to915-LgbsSe VIpgJd-TzA9Ye-eEGnhe ndfHFb-c4YZDc-LgbsSe" role="button" data-tooltip-unhoverable="true" data-tooltip-delay="500" data-tooltip-class="ndfHFb-c4YZDc-tk3N6e-suEOdc" data-tooltip-align="b,c"
          data-tooltip-offset="-6" aria-hidden="true" aria-label="Abrir" data-tooltip="Abrir" style="user-select: none; display: none;">
          <div class="ndfHFb-c4YZDc-FNFY6c-DWWcKd-Bz112c" style="display: none;"></div>
          <div class="ndfHFb-c4YZDc-FNFY6c-V67aGc">Abrir</div>
        </div>
        <div class="ndfHFb-c4YZDc-Wrql6b-PlOyMe ndfHFb-c4YZDc-to915-LgbsSe VIpgJd-TzA9Ye-eEGnhe ndfHFb-c4YZDc-LgbsSe" role="button" data-tooltip-unhoverable="true" data-tooltip-delay="500" data-tooltip-class="ndfHFb-c4YZDc-tk3N6e-suEOdc" data-tooltip-align="b,c"
          data-tooltip-offset="-6" style="user-select: none; display: none;" aria-hidden="true">
          <div class="ndfHFb-c4YZDc-Wrql6b-PlOyMe-bN97Pc">Extrair</div>
          <div class="ndfHFb-c4YZDc-Wrql6b-HDMZaf-Bz112c">
            <div class="ndfHFb-aZ2wEe" dir="ltr">
              <div class="ndfHFb-vyDMJf-aZ2wEe auswjd">
                <div class="aZ2wEe-pbTTYe aZ2wEe-v3pZbf">
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-LK5yu">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-pehrl-TpMipd">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-qwU8Me">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                </div>
                <div class="aZ2wEe-pbTTYe aZ2wEe-oq6NAc">
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-LK5yu">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-pehrl-TpMipd">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-qwU8Me">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                </div>
                <div class="aZ2wEe-pbTTYe aZ2wEe-gS7Ybc">
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-LK5yu">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-pehrl-TpMipd">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-qwU8Me">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                </div>
                <div class="aZ2wEe-pbTTYe aZ2wEe-nllRtd">
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-LK5yu">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-pehrl-TpMipd">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                  <div class="aZ2wEe-LkdAo-e9ayKc aZ2wEe-qwU8Me">
                    <div class="aZ2wEe-LkdAo aZ2wEe-hj4D6d"></div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="ndfHFb-c4YZDc-Wrql6b-qMHh7d ndfHFb-c4YZDc-to915-LgbsSe VIpgJd-TzA9Ye-eEGnhe ndfHFb-c4YZDc-LgbsSe" role="button" aria-expanded="false" aria-haspopup="true" data-tooltip-unhoverable="true" data-tooltip-delay="500" data-tooltip-class="ndfHFb-c4YZDc-tk3N6e-suEOdc"
          data-tooltip-align="b,c" data-tooltip-offset="-6" aria-label="Abrir com" data-tooltip="Abrir com" style="user-select: none; display: none;" aria-hidden="true">
          <div class="ndfHFb-c4YZDc-Wrql6b-FNFY6c-hgDUwe"></div>
          <div class="ndfHFb-c4YZDc-Wrql6b-qMHh7d-SmKAyb">
            <div class="ndfHFb-c4YZDc-Wrql6b-qMHh7d-fmcmS" tabindex="-1">Abrir com</div>
            <div class="ndfHFb

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

I managed to hide the top bar using

webView.loadUrl("javascript:(function() { " +
                    "document.getElementsByClassName('ndfHFb-c4YZDc-Wrql6b-SmKAyb')[0].style.display='none'; })()"); 

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...