Ocultar / Mostrar la barra de herramientas cuando se desplaza el fragmento en las pestañas
He añadido la nueva Toolbar , Tablayout y Viewpager en mi aplicación Android. He proporcionado Fragmentos para mis 3 pestañas y su trabajo bien. Pero el problema es que cuando se desplaza hacia arriba mi barra de herramientas no ocultar. Quiero que cuando me desplace mi fragmento que debe ocultar. Y una cosa más, estoy usando Webview en el fragmento. Mis códigos se dan a continuación.
MainActivity.Java
- SaveState de Webview no maneja WebViewClient personalizado
- Android: la aplicación Web funciona en Chrome, pero no en Webview
- Android: la vista web se corta
- Responder sitio web mostrar en la vista Web fuera de ancho móvil (no sensible) de otra manera en Chrome se ve bien
- Enlaces que no funcionan dentro de un WebView debido a 'X-Frame-Options' establecido en 'SAMEORIGIN'
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 esconde y cuando me desplaza hacia abajo la barra de herramientas debe volver tan pronto como sea posible.
- Android y Jsoup
- Configuración correcta de AppCache para Android WebView
- Rotación de 90 grados en la vista web de FrameLayout en Android
- Llamar a métodos Android desde JavaScript
- Viewport ajusta el ancho de la pantalla y las grandes imágenes
- Android WebView con incrustaciones iframe no se muestra en 4.2.2 ni en la parte inferior
- Pantalla en blanco de Android en onBack en un archivo loadDataWithBaseURL
- Webview no muestra la fuente Gujarati
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>
En primer lugar, debe mover su vista web en 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 de AppBarLayout. Por lo tanto, su main.xml debe 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á sólo si tienen la app flag: layout_scrollFlags
Más información sobre la implementación de la biblioteca de diseño de soporte técnico aquí:
https://android-developers.googleblog.com/2015/05/android-design-support-library.html
Debería mover su ViewPager fuera de AppBarLayout y añadir comportamiento a la app:layout_behavior="@string/appbar_scrolling_view_behavior"
¡Escribí un ejemplo completo! https://github.com/erikcaffrey/AndroidDesignSupportLibrary
Espero que te ayude!
Mira esto
- ¿Cómo ocultar y mostrar correctamente la barra de acciones con la nueva API de la biblioteca de diseño?
- Android-ObservableScrollView
Lo siento por mi inglés
Te mostraré cómo he hecho eso para mi aplicación (min sdk: 14, target sdk: 22). No utilizo fragmentos, solo tengo una sola vista web en mi actividad, pero el manejador es el mismo. El probles es cuando usted hace el desplazamiento dentro de una webview, Android no maneja eso como un acontecimiento del desplazamiento, el webview maneja sus propios acontecimientos.
Primero defino la carpeta styles.xml en res. Utilizo una ActionBar transparente y superpuesta, eso es mejor cuando quieres ocultarte 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 el ActionBar en la sección de la aplicación:
<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, debe controlar los gestos en la vista web. Debe implementar View.OnTouchListener y Handler.Callback. Al tocar en la vista web, debe comparar el evento de inicio y el evento de fin:
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.
Simplemente agregue esta línea en su barra de herramientas o en el botón FAB.
app:layout_scrollFlags="scroll|enterAlways"
La app:layout_scrollFlags="scroll|enterAlways" línea hará que nuestra Toolbar se desplaza de la pantalla cuando el usuario desplaza hacia abajo la lista y tan pronto como comienza a desplazarse hasta la Toolbar se mostrará de nuevo. Limpio y simple, que es el poder de CoordinatorLayout !
Por favor, eche un vistazo a 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
Para ocultar el menú de 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); }
- Ordenar arraylist de cadena en android
- Android DrawerLayout no muestra el icono del indicador derecho