2015-02-27 10 views
13

In Google Chrome und Play Store. Die App kann die Aktionsleiste beim Scrollen ausblenden und ermöglicht dem Benutzer bequemes Browsen. Bitte hilf mir, so zu machen.So blenden Sie ActionBar/Toolbar beim Scrollen in Webview

Ich habe onTouchListener für Webview verwendet es funktioniert nicht.

mWebView.setOnTouchListener(new View.OnTouchListener() { 
      @Override 
      public boolean onTouch(View v, MotionEvent event) { 
       switch (event.getAction()) { 
        case MotionEvent.ACTION_DOWN: 
         getSupportActionBar().show(); 
          break; 
        case MotionEvent.ACTION_UP: 
         getSupportActionBar().hide(); 
          break; 
        default: break; 
       } 
       return false; 
      } 
     }); 

Vielen Dank im Voraus

+0

Beispiel für Aktionsleiste versteckt ist [hier] (http://www.techrepublic.com/article/pro-tip- maximize-android-screen-real-estate-durch-show-and-hiding-the-action-bar /) –

+0

Dieses Beispiel zeigt für Linear Layout. wie man das in webview implementiert – Sathish

+1

Es gibt ein Beispiel hier [http://stackoverflow.com/questions/14752523/how-to-make-a-croll-listener-for-webview-in-android/14753235#14753235] –

Antwort

33

Sie diese Design-Bibliothek mit der CoordinatorLayout und NestedScrollView ohne Java-Code zu tun. Hier ist, wie Sie es tun.

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

<android.support.design.widget.AppBarLayout 
    android:id="@+id/appbar" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

    <android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="?attr/actionBarSize" 
     android:background="?attr/colorPrimary" 
     app:layout_scrollFlags="scroll|enterAlways" 
     app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /> 
</android.support.design.widget.AppBarLayout> 

<android.support.v4.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:layout_gravity="fill_vertical" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior"> 

    <WebView 
     android:id="@+id/webview" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"/> 
</android.support.v4.widget.NestedScrollView> 
</android.support.design.widget.CoordinatorLayout> 

können Sie spielen, um mit mit unterschiedlichem layout_scrollFlags und fitsSystemWindows Verhalten, sobald Sie den Dreh raus zu bekommen.

+0

Ausgezeichnet! : -) ... – Sathish

+0

Das funktioniert super, aber Sie verlieren den "Zoom" per Geste. Gibt es einen Weg, um es wieder in diese Lösung zu bekommen? Danke –

+0

Einige finden es möglicherweise notwendig, 'android: fillViewport =" true "' zu 'NestedScrollView' hinzuzufügen, damit es die volle verfügbare Höhe seines Containers einnimmt. Seltsamerweise war 'android: layout_gravity =" fill_vertical "' nicht genug, um dies in allen Fällen zu erreichen. –

14

Nun, ich habe von CustomWebView umgesetzt und GestureDetector:

CustomWebView.java:

public class CustomWebView extends WebView { 
    private GestureDetector gestureDetector; 
    public CustomWebView(Context context) { 
     super(context); 
    } 
    public CustomWebView(Context context, AttributeSet attrs) { 
     super(context, attrs); 
    } 
    public CustomWebView(Context context, AttributeSet attrs, int defStyle) { 
     super(context, attrs, defStyle); 
    } 
    @Override 
    protected void onScrollChanged(int l, int t, int oldl, int oldt) { 
     super.onScrollChanged(l, t, oldl, oldt); 
    } 

    @Override 
    public boolean onTouchEvent(MotionEvent ev) { 
     return gestureDetector.onTouchEvent(ev) || super.onTouchEvent(ev); 
    } 

    public void setGestureDetector(GestureDetector gestureDetector) { 
     this.gestureDetector = gestureDetector; 
    } 
} 

web_fragment.xml:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="@android:color/transparent" 
    android:orientation="vertical"> 

    <com.customview.CustomWebView 
      android:id="@+id/customWebView" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:focusable="true" /> 

</LinearLayout> 

CustomeGestureDetector clss für Gestenerkennung (I in Fragment hinzugefügt haben):

private class CustomeGestureDetector extends GestureDetector.SimpleOnGestureListener { 
     @Override 
     public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) { 
      if(e1 == null || e2 == null) return false; 
      if(e1.getPointerCount() > 1 || e2.getPointerCount() > 1) return false; 
      else { 
       try { 
        if(e1.getY() - e2.getY() > 20) { 
          // Hide Actionbar 
         getSupportActionBar().hide(); 
         customWebView.invalidate(); 
         return false; 
        } 
        else if (e2.getY() - e1.getY() > 20) { 
          // Show Actionbar 
         getSupportActionBar().show(); 
         customWebView.invalidate(); 
         return false; 
        } 

       } catch (Exception e) { 
        customWebView.invalidate(); 
       } 
       return false; 
      } 


     } 
    } 

WebFragment.java:

private CustomWebView customWebView; 

customWebView= (CustomWebView) view.findViewById(R.id.customWebView); 

customWebView.setGestureDetector(new GestureDetector(new CustomeGestureDetector())); 

Es funktioniert gut für mich, hoffe, es würde Ihnen helfen.

+0

Danke dafür, es ist sehr hilfreich! Allerdings würde ich den Namen Ihrer 'CustomGestureDetector'-Klasse in' CustomGestureDetectorListener' ändern, da es sich nicht um einen GestureDetector handelt. So wie es ist, ist es verwirrend. – LarsH

3

enter image description here

package com.keshav.hideactionbarandfooterexample; 

import android.os.Bundle; 
import android.support.v7.app.AppCompatActivity; 
import android.support.v7.widget.LinearLayoutManager; 
import android.support.v7.widget.RecyclerView; 
import android.support.v7.widget.Toolbar; 
import android.util.Log; 
import android.view.View; 
import android.view.animation.AccelerateInterpolator; 
import android.view.animation.DecelerateInterpolator; 
import android.widget.FrameLayout; 
import android.widget.ImageButton; 

import java.util.ArrayList; 
import java.util.List; 

import adapters.RecyclerAdapter; 
import listners.HidingScrollListener; 

public class MainActivity extends AppCompatActivity { 

    private Toolbar mToolbar; 
    private Toolbar toolbar_bottom; 
    private ImageButton mFabButton; 

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

     Log.e("keshav", "MainActivity called"); 

     initToolbar(); 
     mFabButton = (ImageButton) findViewById(R.id.fabButton); 
     initRecyclerView(); 
    } 

    private void initToolbar() { 
     mToolbar = (Toolbar) findViewById(R.id.toolbar); 
     toolbar_bottom = (Toolbar) findViewById(R.id.toolbar_bottom); 
     setSupportActionBar(mToolbar); 
     setSupportActionBar(toolbar_bottom); 
     setTitle(getString(R.string.app_name)); 
     mToolbar.setTitleTextColor(getResources().getColor(android.R.color.white)); 
     toolbar_bottom.setTitleTextColor(getResources().getColor(android.R.color.white)); 


     toolbar_bottom.setVisibility(View.GONE); 
    } 

    private void initRecyclerView() { 
     RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recyclerView); 
     recyclerView.setLayoutManager(new LinearLayoutManager(this)); 
     RecyclerAdapter recyclerAdapter = new RecyclerAdapter(createItemList()); 
     recyclerView.setAdapter(recyclerAdapter); 

     recyclerView.addOnScrollListener(new HidingScrollListener() { 
      @Override 
      public void onHide() { 
       hideViews(); 
      } 

      @Override 
      public void onShow() { 
       showViews(); 
      } 
     }); 
    } 

    private void hideViews() { 
     // TODO (-mToolbar) plus means 2 view above ho jaye or not visible to user 
     mToolbar.animate().translationY(-mToolbar.getHeight()).setInterpolator(new AccelerateInterpolator(2)); 

     // TODO uncomment this Hide Footer in android when Scrolling 
     // TODO (+mToolbar) plus means 2 view forward ho jaye or not visible to user 
     toolbar_bottom.animate().translationY(+toolbar_bottom.getHeight()).setInterpolator(new AccelerateInterpolator(2)); 

     // TODO keshav Hide Also Floatng Button In Android 
     FrameLayout.LayoutParams lp = (FrameLayout.LayoutParams) mFabButton.getLayoutParams(); 
     int fabBottomMargin = lp.bottomMargin; 
     mFabButton.animate().translationY(mFabButton.getHeight() + fabBottomMargin).setInterpolator(new AccelerateInterpolator(2)).start(); 
     // TODO keshav Hide Also Floatng Button In Android 
    } 

    private void showViews() { 
     mToolbar.animate().translationY(0).setInterpolator(new DecelerateInterpolator(2)); 

     // TODO uncomment this Hide Footer in android when Scrolling 
     toolbar_bottom.animate().translationY(0).setInterpolator(new DecelerateInterpolator(2)); 
     mFabButton.animate().translationY(0).setInterpolator(new DecelerateInterpolator(2)).start(); 
    } 

    private List<String> createItemList() { 
     List<String> itemList = new ArrayList<>(); 
     for (int i = 0; i < 20; i++) { 
      itemList.add("Item " + i); 
     } 
     return itemList; 
    } 
} 

============================================= 
      RecyclerAdapter 
============================================= 
package adapters; 

import android.content.Context; 
import android.support.v7.widget.RecyclerView; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 

import com.keshav.hideactionbarandfooterexample.R; 

import java.util.List; 

/* 
* RecyclerView Adapter that allows to add a header view. 
* */ 
public class RecyclerAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> { 

    private static final int TYPE_HEADER = 2; 
    private static final int TYPE_ITEM = 1; 
    private List<String> mItemList; 

    public RecyclerAdapter(List<String> itemList) { 
     mItemList = itemList; 
    } 

    @Override 
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { 
     Context context = parent.getContext(); 
     if (viewType == TYPE_ITEM) { 
      final View view = LayoutInflater.from(context).inflate(R.layout.recycler_item, parent, false); 
      return RecyclerItemViewHolder.newInstance(view); 
     } else if (viewType == TYPE_HEADER) { 
      final View view = LayoutInflater.from(context).inflate(R.layout.recycler_header, parent, false); 
      return new RecyclerHeaderViewHolder(view); 
     } 
     throw new RuntimeException("There is no type that matches the type " + viewType + " + make sure your using types correctly"); 
    } 

    @Override 
    public void onBindViewHolder(RecyclerView.ViewHolder viewHolder, int position) { 
     if (!isPositionHeader(position)) { 
      RecyclerItemViewHolder holder = (RecyclerItemViewHolder) viewHolder; 
      String itemText = mItemList.get(position - 1); // header 
      holder.setItemText(itemText); 
     } 
    } 

    public int getBasicItemCount() { 
     return mItemList == null ? 0 : mItemList.size(); 
    } 


    @Override 
    public int getItemViewType(int position) { 
     if (isPositionHeader(position)) { 
      return TYPE_HEADER; 
     } 

     return TYPE_ITEM; 
    } 

    @Override 
    public int getItemCount() { 
     return getBasicItemCount() + 1; // header 
    } 

    private boolean isPositionHeader(int position) { 
     return position == 0; 
    } 

} 

===================================================== 
     RecyclerHeaderViewHolder 
===================================================== 
package adapters; 

import android.support.v7.widget.RecyclerView; 
import android.view.View; 

public class RecyclerHeaderViewHolder extends RecyclerView.ViewHolder { 
    public RecyclerHeaderViewHolder(View itemView) { 
     super(itemView); 
    } 
} 

===================================================== 
       RecyclerItemViewHolder 
===================================================== 

package adapters; 

import android.support.v7.widget.RecyclerView; 
import android.view.View; 
import android.widget.TextView; 

import com.keshav.hideactionbarandfooterexample.R; 


public class RecyclerItemViewHolder extends RecyclerView.ViewHolder { 

    private final TextView mItemTextView; 

    public RecyclerItemViewHolder(final View parent, TextView itemTextView) { 
     super(parent); 
     mItemTextView = itemTextView; 
    } 

    public static RecyclerItemViewHolder newInstance(View parent) { 
     TextView itemTextView = (TextView) parent.findViewById(R.id.itemTextView); 
     return new RecyclerItemViewHolder(parent, itemTextView); 
    } 

    public void setItemText(CharSequence text) { 
     mItemTextView.setText(text); 
    } 

} 

=================================================== 
      activity_main.xml 
=================================================== 

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent"> 

    <android.support.v7.widget.RecyclerView 
      android:id="@+id/recyclerView" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent"/> 

    <android.support.v7.widget.Toolbar 
      android:id="@+id/toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      android:background="?attr/colorPrimary"/> 

    <ImageButton 
      android:id="@+id/fabButton" 
      android:layout_width="56dp" 
      android:layout_height="56dp" 
      android:layout_gravity="bottom|right" 
      android:layout_marginBottom="16dp" 
      android:layout_marginRight="16dp" 
      android:background="@drawable/fab_bcg" 
      android:src="@drawable/ic_favorite_outline_white_24dp" 
      android:contentDescription="@string/fab_description"/> 


    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 

    <android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar_bottom" 
     android:layout_width="match_parent" 
     android:layout_alignParentBottom="true" 
     android:layout_height="?attr/actionBarSize" 
     android:background="?attr/colorPrimary"/> 

    </RelativeLayout> 

</FrameLayout> 


================================================== 
    recycle_header.xml in layout folder 
================================================== 

<?xml version="1.0" encoding="utf-8"?> 
<View xmlns:android="http://schemas.android.com/apk/res/android" 
     android:layout_width="match_parent" 
     android:layout_height="?attr/actionBarSize"/> 

================================================== 
    recycle_item.xml in layout folder 
================================================== 
<?xml version="1.0" encoding="utf-8"?> 
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_gravity="center" 
    android:layout_margin="8dp" 
    card_view:cardCornerRadius="4dp"> 
    <TextView 
     android:id="@+id/itemTextView" 
     android:layout_width="match_parent" 
     android:layout_height="?attr/listPreferredItemHeight" 
     android:gravity="center_vertical" 
     android:padding="8dp" 
     style="@style/Base.TextAppearance.AppCompat.Body2"/> 
</android.support.v7.widget.CardView> 


================================================= 
         styles.xml 
================================================= 
<resources> 

    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> 
    </style> 

    <style name="AppThemeRed" parent="AppTheme"> 
     <item name="colorPrimary">@color/color_primary_red</item> 
     <item name="colorPrimaryDark">@color/color_primary_red_dark</item> 
    </style> 

    <style name="AppThemeGreen" parent="AppTheme"> 
     <item name="colorPrimary">@color/color_primary_green</item> 
     <item name="colorPrimaryDark">@color/color_primary_green_dark</item> 
    </style> 

    <style name="AppThemeBlue" parent="AppTheme"> 
     <item name="colorPrimary">@color/color_primary_blue</item> 
     <item name="colorPrimaryDark">@color/color_primary_blue_dark</item> 
     <item name="colorAccent">@color/color_accent_pink</item> 
    </style> 

</resources> 

build.gradle Abhängigkeit

compile 'com.android.support:appcompat-v7:25.3.1' 
    compile 'com.android.support:recyclerview-v7:25.3.1' 
    compile 'com.android.support:cardview-v7:25.3.1' 
    compile 'com.android.support:design:25.3.1' 
+1

https://drive.google.com/file/d/0BzBKpZ4nzUcEhqMk9pSHVBdkU/view –

+0

https://drive.google.com/open?id=0BzBKpZ4nzNzuVi0xeU1UMjZHeFE Ganzes –