web-dev-qa-db-ja.com

折りたたみ可能なツールバーを備えたWebView？ （マテリアルデザイン）

アクティビティと2種類のフラグメントを含むAndroidアプリを開発しています。

タイプ1：折りたたみ可能なツールバーとRecyclerViewをコンテンツとして持つフラグメント。 （できます）。レイアウト：

<Android.support.design.widget.CoordinatorLayout xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:fitsSystemWindows="true">

    <Android.support.design.widget.AppBarLayout
        Android:id="@+id/appbar"
        Android:layout_width="match_parent"
        Android:layout_height="250dp"
        Android:fitsSystemWindows="true"
        Android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <Android.support.design.widget.CollapsingToolbarLayout
            Android:id="@+id/collapsing_toolbar"
            Android:layout_width="match_parent"
            Android:layout_height="match_parent"
            Android:fitsSystemWindows="true"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleMarginEnd="64dp"
            app:expandedTitleMarginStart="48dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <ImageView
                Android:id="@+id/header"
                Android:layout_width="match_parent"
                Android:layout_height="match_parent"
                Android:background="@drawable/indicaciones"
                Android:fitsSystemWindows="true"
                Android:scaleType="centerCrop"
                app:layout_collapseMode="parallax" />


            <Android.support.v7.widget.Toolbar
                Android:id="@+id/anim_toolbar"
                Android:layout_width="match_parent"
                Android:layout_height="100dp"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

            </Android.support.v7.widget.Toolbar>

        </Android.support.design.widget.CollapsingToolbarLayout>

    </Android.support.design.widget.AppBarLayout>

    <Android.support.v7.widget.RecyclerView
        Android:id="@+id/scrollableview"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:background="@Android:color/white"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    <Android.support.design.widget.FloatingActionButton
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_margin="20dp"
        Android:clickable="true"
        Android:src="@Android:drawable/ic_menu_add"
        Android:visibility="gone"
        app:layout_anchor="@+id/appbar"
        app:layout_anchorGravity="bottom|right|end" />


</Android.support.design.widget.CoordinatorLayout>

タイプ2：折りたたみ可能なツールバーとWebViewをコンテンツとして持つフラグメント。 （ここに問題があります）。 「WebView」でRecyclerViewを変更してみましたが、次のようになります。

<Android.support.design.widget.CoordinatorLayout xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:fitsSystemWindows="true">

    <Android.support.design.widget.AppBarLayout
        Android:id="@+id/appbar"
        Android:layout_width="match_parent"
        Android:layout_height="250dp"
        Android:fitsSystemWindows="true"
        Android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <Android.support.design.widget.CollapsingToolbarLayout
            Android:id="@+id/collapsing_toolbar"
            Android:layout_width="match_parent"
            Android:layout_height="match_parent"
            Android:fitsSystemWindows="true"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleMarginEnd="64dp"
            app:expandedTitleMarginStart="48dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <ImageView
                Android:id="@+id/header"
                Android:layout_width="match_parent"
                Android:layout_height="match_parent"
                Android:background="@drawable/indicaciones"
                Android:fitsSystemWindows="true"
                Android:scaleType="centerCrop"
                app:layout_collapseMode="parallax" />


            <Android.support.v7.widget.Toolbar
                Android:id="@+id/anim_toolbar"
                Android:layout_width="match_parent"
                Android:layout_height="100dp"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

            </Android.support.v7.widget.Toolbar>

        </Android.support.design.widget.CollapsingToolbarLayout>

    </Android.support.design.widget.AppBarLayout>

    <WebView
        Android:id="@+id/scrollableview"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:background="@Android:color/white"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    <Android.support.design.widget.FloatingActionButton
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_margin="20dp"
        Android:clickable="true"
        Android:src="@Android:drawable/ic_menu_add"
        Android:visibility="gone"
        app:layout_anchor="@+id/appbar"
        app:layout_anchorGravity="bottom|right|end" />


</Android.support.design.widget.CoordinatorLayout>

問題は、WebViewが表示されないことです。助言がありますか？これを達成するためのアイデアはありますか？私はそれを大丈夫ですか？

前もって感謝します。

編集：

私はこの方法でwebViewをロードします：

String template = ... (a xml string, well formed).
webView.getSettings().setJavaScriptEnabled(true);
        webView.getSettings().setBuiltInZoomControls(true);
        webView.getSettings().setDisplayZoomControls(false);
        webView.loadDataWithBaseURL("file:///Android_asset/", template, "text/html", "UTF-8", "");
        webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
        webView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);
        webView.getSettings().setSupportZoom(true);
        webView.getSettings().setRenderPriority(WebSettings.RenderPriority.HIGH);

私もこれを試しました：

 WebSettings ws = webView.getSettings();
    ws.setJavaScriptEnabled(true);
    webView.loadUrl("http://www.google.com");

    webView.setWebViewClient(new WebViewClient() {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            view.loadUrl(url);
            return true;
        }
    });
androidandroid-layoutandroid-fragmentswebview
16
Borja

WebviewをNestedScrollViewに配置し、Android：isScrollContainer：falseを設定します

だからそれは

<Android.support.v4.widget.NestedScrollView
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <WebView
        Android:id="@+id/scrollableview"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:background="@Android:color/white"
        Android:isScrollContainer="false"/>

</Android.support.v4.widget.NestedScrollView>

WebViewの代わりに

18
Andrew

スクロールイベントを聞いて、折りたたみ効果を出すことができます。

レイアウト

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
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">

<com.google.Android.material.appbar.AppBarLayout
    Android:id="@+id/appBarLayout"
    Android:layout_width="match_parent"
    Android:layout_height="146dp">

    <com.google.Android.material.appbar.CollapsingToolbarLayout
        Android:id="@+id/collapsingToolbarLayout"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        app:contentScrim="@color/primary"
        app:expandedTitleGravity="bottom"
        app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">

        <androidx.appcompat.widget.Toolbar
            Android:id="@+id/toolbar"
            Android:layout_width="match_parent"
            Android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin" />

    </com.google.Android.material.appbar.CollapsingToolbarLayout>
</com.google.Android.material.appbar.AppBarLayout>

<WebView
    Android:id="@+id/webview"
    Android:layout_width="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    Android:layout_height="match_parent"/>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

コード

webview.setOnScrollChangeListener(new View.OnScrollChangeListener() {
  @Override
  public void onScrollChange(View view, int i, int i1, int i2, int i3) {
    // i1 last Y, i3 previous Y
    // Do you stuff here. A simple example: (not performant)
    AppBarLayout appBarLayout = 
    CollapsingToolbarActivity.this.findViewById(R.id.appBarLayout);
    appBarLayout.setExpanded(i1 < i3, true);
  }
});
0
Yunus Emre