android - sacar - Ocultar/Mostrar la barra de herramientas cuando se desplaza el fragmento en las pestañas

mostrar barra de herramientas google chrome

Question

Tablayout la nueva Toolbar , Tablayout y Viewpager en mi aplicación de Android. Proporcioné Fragmentos para mis 3 Pestañas y está funcionando bien. Pero el problema es que cuando me desplazo hacia arriba mi barra de herramientas no se oculta. Quiero que cuando me desplace mi fragmento se esconda. Y una cosa más, estoy usando Webview en el fragmento. Mis códigos se dan a continuación.

MainActivity.Java

public class MainActivity extends AppCompatActivity {
    TabLayout tabLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

        setupToolbar();
        setupTablayout();
    }

private void setupToolbar() {
    // TODO Auto-generated method stub
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbarsdfs);
    if (toolbar != null) {
        setSupportActionBar(toolbar);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);}
}

private void setupTablayout() {
    // TODO Auto-generated method stub
    tabLayout = (TabLayout) findViewById(R.id.tabLayout);
    tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
    tabLayout.addTab(tabLayout.newTab().setText("Tab 1"));
    tabLayout.addTab(tabLayout.newTab().setText("Tab 2"));
    final ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
    final PagerAdapter adapter = new PagerAdapter
            (getSupportFragmentManager(), tabLayout.getTabCount());
    viewPager.setAdapter(adapter);
    viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
    tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
        @Override
        public void onTabSelected(TabLayout.Tab tab) {
            viewPager.setCurrentItem(tab.getPosition());
        }

        @Override
        public void onTabUnselected(TabLayout.Tab tab) {

        }

        @Override
        public void onTabReselected(TabLayout.Tab tab) {

        }
    });
}
}

main.xml

<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/coordinatorLayout"
    android:layout_height="match_parent"
    android:layout_width="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/toolbarsdfs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="?attr/actionBarSize"
    android:background="?attr/colorPrimaryDark"
    android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
    app:layout_scrollFlags="scroll|enterAlways"/>

<android.support.design.widget.TabLayout
            android:id="@+id/tabLayout"
            android:scrollbars="horizontal"
            android:layout_below="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?attr/colorPrimary" />

<android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        android:layout_below="@+id/tablayout"/>

</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>

PagerAdapter.Java

public class PagerAdapter extends FragmentStatePagerAdapter {
    int mNumOfTabs;

    public PagerAdapter(FragmentManager fm, int NumOfTabs) {
        super(fm);
        this.mNumOfTabs = NumOfTabs;
    }

    @Override
    public Fragment getItem(int position) {

        switch (position) {
            case 0:
                Fragment_Feeds tab1 = new Fragment_Feeds();
                return tab1;
            case 1:
                Fragment_Facts tab2 = new Fragment_Facts();
                return tab2;
            default:
                return null;
        }
    }

    @Override
    public int getCount() {
        return mNumOfTabs;
    }
}

Fragment_Feeds.java

public class Fragment_Feeds extends Fragment {
    SwipeRefreshLayout swipeView;
    WebView myWebView;
    ProgressBar progressBar;
    final static String myBlogAddr = "http://myblog.com";
    String myUrl;
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragmentfeeds, container, false);
        swipeView = (SwipeRefreshLayout) view.findViewById(R.id.swipe);

        myWebView = (WebView) view.findViewById(R.id.webview);
        progressBar = (ProgressBar) view.findViewById(R.id.progressBar);
        myWebView.setWebViewClient(new MyWebViewClient()); 
        WebSettings webSettings = myWebView.getSettings();
        webSettings.setJavaScriptEnabled(true);
        myWebView.setOverScrollMode(View.OVER_SCROLL_NEVER);
        myWebView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
        myWebView.setHorizontalScrollBarEnabled(false);
        myWebView.loadUrl("http://myblog.com");
        swipeView.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener()    
        {
            @Override
            public void onRefresh() 
            {
                  myWebView.loadUrl("http://myblog.com");

            }});
        return view;
    }
    private class MyWebViewClient extends WebViewClient {
        @Override
        public void onPageFinished(WebView view, String url) {
            swipeView.setRefreshing(false);
        }
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
         myUrl = url;
            view.loadUrl(url);
            return true;
        }
        @Override
        public void onReceivedError(WebView view, int errorCod,String description, String failingUrl) {
            myWebView.loadUrl("file:///android_asset/error_page.html");
        }
    }
    @Override
    public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) {
        inflater.inflate(R.menu.main, menu);
        super.onCreateOptionsMenu(menu, inflater);
    }
}

fragmentfeeds.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#FFFFFF" >
    <ProgressBar
        android:id="@+id/progressBar"
        style="?android:attr/progressBarStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <android.support.v4.widget.SwipeRefreshLayout
      xmlns:android="http://schemas.android.com/apk/res/android"
      android:id="@+id/swipe"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:background="#FFFFFF">s

    <WebView
      android:id="@+id/webview"
      android:layout_width="match_parent"
      android:layout_height="fill_parent"
      android:numColumns="1"
      android:scrollbars="none"
      android:focusableInTouchMode="false"
      android:focusable="false"
      android:background="#FFFFFF" />
   </android.support.v4.widget.SwipeRefreshLayout>

</LinearLayout>

¿Lo que quiero?

Lo que quiero es que cuando desplazo la vista web hacia arriba, la barra de herramientas también debe desplazarse hacia arriba y se oculta, y cuando vuelvo hacia abajo, la barra de herramientas debería volver tan pronto como sea posible.

Answer 1

Cambiar las propiedades de la barra de herramientas.

app: layout_scrollFlags = "scroll | exitUntilCollapsed"

Answer 2

Debe mover su ViewPager fuera del AppBarLayout y agregar comportamiento a la app:layout_behavior="@string/appbar_scrolling_view_behavior"

¡Escribí un ejemplo completo! https://github.com/erikcaffrey/AndroidDesignSupportLibrary

Espero que te ayude!

Answer 3

En primer lugar, debe mover su vista web a NestedScrollView y establecer la propiedad ''android: isScrollContainer'' en el valor ''false''. https://developer.android.com/reference/android/support/v4/widget/NestedScrollView.html

En segundo lugar, debe mover su ViewPager fuera del AppBarLayout. Entonces, tu main.xml debería ser así:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout   
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/main_content"
android:background="#FFF"
android:clickable="true"
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">

    <!-- your app bar stuff here -->
    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="240dp"
        app:layout_scrollFlags="scroll|enterAlways">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="fitXY"
            android:id="@+id/image_header"/>

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

    </FrameLayout>

    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        android:background="#FFF"
        app:tabTextColor="#a3a3a3"
        app:tabSelectedTextColor="#a3a3a3"
        app:tabIndicatorColor="#0042ab"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />

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

<android.support.v4.view.ViewPager
    android:id="@+id/viewpager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:visibility="gone"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    android:background="#eaeaea"/>

AppBarLayout childern se ocultará solo si tienen la aplicación flag: layout_scrollFlags

Lea más sobre la implementación de la biblioteca de diseño de soporte aquí:
https://android-developers.googleblog.com/2015/05/android-design-support-library.html

Answer 4

Lo siento por mi inglés.

Te mostraré cómo lo he hecho para mi aplicación (min sdk: 14, target sdk: 22). No uso fragmentos, solo tengo una única vista web en mi actividad, pero el controlador es el mismo. El problema es que cuando haces scroll dentro de una vista web, Android no maneja eso como un evento scroll, la vista web maneja sus propios eventos.

Primero defino el styles.xml en la carpeta res. Utilizo un ActionBar transparente y superpuesto, eso es mejor cuando quiere ocultar y mostrar que:

res / styles.xml

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="@android:style/Theme.Holo">
        <!-- Customize your theme here. -->
        <item name="android:windowActionBarOverlay">true</item>
        <item name="android:actionBarStyle">@style/MyActionBar</item>

    </style>

    <!-- ACTION BAR STYLES -->
    <style name="MyActionBar" parent="@android:style/Widget.Holo.ActionBar">
        <item name="android:background">@color/actionbar_background</item>

    </style>

</resources>

Luego, en el manifiesto, defino los estilos para la aplicación y la barra de acción en la sección de aplicaciones:

<application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity
            android:name=".MainActivity"
            android:label="@string/app_name" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

    </application>

finalmente en MainActivity, debes controlar los gestos en la vista web. Debe implementar View.OnTouchListener y Handler.Callback. Cuando toca la vista web, debe comparar el evento de inicio y el evento de finalización:

MainActivity.Java

public class MainActivity extends Activity implements View.OnTouchListener, Handler.Callback {

    private float x1,x2,y1,y2; //x1, y1 is the start of the event, x2, y2 is the end.
    static final int MIN_DISTANCE = 150; //min distance for a scroll up event

    private static final int CLICK_ON_WEBVIEW = 1;
    private static final int CLICK_ON_URL = 2;
    private static final int UP_ON_WEBVIEW = 3;


    private final Handler handler = new Handler(this);

    public WebView webView;
    private WebViewClient client;
    private WebAppInterface webAppInt = new WebAppInterface(this);


    @Override
    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        webView = (WebView)findViewById(R.id.myWebView);
        webView.setOnTouchListener(this);

        client = new WebViewClient();
        webView.setWebViewClient(client);        
        webView.loadDataWithBaseURL("file:///android_asset/", "myweb.html", "text/html", "UTF-8", "");

    }

//HERE START THE IMPORTANT PART
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        if (v.getId() == R.id.myWebView && event.getAction() == MotionEvent.ACTION_DOWN){
            x1 = event.getX();
            y1 = event.getY();
            handler.sendEmptyMessageDelayed(CLICK_ON_WEBVIEW, 200);
        } else if (v.getId() == R.id.myWebView && event.getAction() == MotionEvent.ACTION_UP){
            x2 = event.getX();
            y2 = event.getY();

            handler.sendEmptyMessageDelayed(UP_ON_WEBVIEW, 200);
        }

        return false;
    }

    @Override
    public boolean handleMessage(Message msg) {
        if (msg.what == CLICK_ON_URL){ //if you clic a link in the webview, thats not a scroll
            handler.removeMessages(CLICK_ON_WEBVIEW);
            handler.removeMessages(UP_ON_WEBVIEW);
            return true;
        }
        if (msg.what == CLICK_ON_WEBVIEW){

            Toast.makeText(this, "WebView clicked", Toast.LENGTH_SHORT).show();
            return true;
        }
        if (msg.what == UP_ON_WEBVIEW){
            float deltaX = x2 - x1; //horizontal move distance
            float deltaY = y2 - y1; //vertical move distance
            if ((Math.abs(deltaX) > MIN_DISTANCE) && (Math.abs(deltaX) > Math.abs(deltaY)))
            {
                // Left to Right swipe action
                if (x2 > x1)
                {
                    Toast.makeText(this, "Left to Right swipe [Next]", Toast.LENGTH_SHORT).show ();
                }

                // Right to left swipe action
                else
                {
                    Toast.makeText(this, "Right to Left swipe [Previous]", Toast.LENGTH_SHORT).show ();
                }

            }
            else if ((Math.abs(deltaY) > MIN_DISTANCE) && (Math.abs(deltaY) > Math.abs(deltaX)))
            {
                // Top to Bottom swipe action -- i SWOW MY ACTIONBAR ON SCROLLDOWN
                if (y2 > y1)
                {
                    getActionBar().show();
                    Toast.makeText(this, "Top to Bottom swipe [Show Bar]", Toast.LENGTH_SHORT).show ();
                }

                // Bottom to top swipe action -- I HIDE MY ACTIONBAR ON SCROLLUP
                else
                {
                    getActionBar().hide();
                    Toast.makeText(this, "Bottom to Top swipe [Hide Bar]", Toast.LENGTH_SHORT).show ();
                }
            }
            return true;
        }
        return false;
    }
}

Espero que eso te ayude.

Answer 5

Mira esto

• ¿Cómo ocultar y mostrar correctamente la barra de acciones con la nueva API de la biblioteca de diseño?
• Android-ObservableScrollView

Answer 6

Para ocultar el menú para un fragmento específico:

       setHasOptionsMenu(true); //Inside of onCreate in FRAGMENT:  


   @Override
   public void onPrepareOptionsMenu(Menu menu) {
       menu.findItem(R.id.action_search).setVisible(false);
   }

Answer 7

Prueba esto.

main.xml

<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/coordinatorLayout"
    android:layout_height="match_parent"
    android:layout_width="match_parent"   
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbarsdfs"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways"/>

        <android.support.design.widget.TabLayout
            android:id="@+id/tabLayout"
            android:scrollbars="horizontal"
            android:layout_below="@+id/toolbarsdfs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?attr/colorPrimary"
            app:tabTextColor="@android:color/white"
            app:tabSelectedTextColor="@android:color/white"
            app:tabIndicatorColor="@android:color/white"
            app:tabIndicatorHeight="3dp" />

    </android.support.design.widget.AppBarLayout>
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        android:layout_below="@+id/tablayout"/>
    </android.support.design.widget.CoordinatorLayout>

fragmentfeeds.xml

    <?xml version="1.0" encoding="utf-8"?>
    <android.support.v4.widget.NestedScrollView
            xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:isScrollContainer="false"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="fill_vertical"
            android:clipToPadding="false"
            app:layout_behavior="@string/appbar_scrolling_view_behavior">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">

    <ProgressBar
            android:id="@+id/progressBar"
            style="?android:attr/progressBarStyleSmall"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

        <android.support.v4.widget.SwipeRefreshLayout
          xmlns:android="http://schemas.android.com/apk/res/android"
          android:id="@+id/swipe"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:background="#FFFFFF">     

    <WebView
             android:id="@+id/webviewtool"
             android:layout_width="match_parent"
             android:layout_height="fill_parent"
             android:numColumns="1"
             android:focusableInTouchMode="false"
             android:focusable="false"
             android:background="#FFFFFF" />
</android.support.v4.widget.SwipeRefreshLayout>
             </LinearLayout>
    </android.support.v4.widget.NestedScrollView>

Answer 8

Simplemente agregue esta línea en su barra de herramientas o botón FAB.

app:layout_scrollFlags="scroll|enterAlways"

La línea de la app:layout_scrollFlags="scroll|enterAlways" hará que nuestra Toolbar se desplace de la pantalla cuando el usuario se desplace hacia abajo en la lista y, tan pronto como comience a desplazarse hacia arriba, la Toolbar volverá a aparecer. Limpio y simple, ese es el poder de CoordinatorLayout !

Por favor, lea este enlace https://mzgreen.github.io/2015/06/23/How-to-hideshow-Toolbar-when-list-is-scrolling(part3)/&re=1&ts=1453224208&sig=ALL1Aj5aKrtAlylt-Qt3Ci6uwff76BqQYw