Schede Android in frammento con barra degli strumenti di collasso

Ho una Toolbar degli Toolbar collisione nella mia applicazione. Utilizzo un NavigationDrawer e commutare tra gli elementi con diversi frammenti, sostituendo una FrameLayout e lasciando la barra degli strumenti in tutta l'applicazione.

Uno dei frammenti ha un layout di tabulazione.
Quando mostro che il frammento viene visualizzato sotto la Toolbar degli Toolbar , con l'ombra della barra degli strumenti si sovrappone.
Voglio che sia allo stesso livello con la barra degli strumenti, e cercare e agire come se fosse nello stesso AppBarLayout .
Inoltre, voglio rendere le tabs trasparenti quando la barra degli strumenti viene espansa.

  • Buon modo per get la posizione dell'utente in Android
  • Test GPS in Android
  • Cosa utilizzare invece di "addPreferencesFromResource" in una PreferenceActivity?
  • Come conoscere il codice di area di localizzazione e l'ID di cella nel telefono android
  • "RecyclerView: Nessun adattatore collegato; skipping layout "per recyclerview in frammento
  • Progetto Eclipse Android, come fare riferimento alla libreria all'interno dell'area di lavoro?
  • Come riorganizzare i miei layout in modo che questo funziona?

    Ecco il mio Xml:

    Principale Xml:

     <android.support.v4.widget.DrawerLayout 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" android:layout_gravity="right" android:clickable="true" android:layoutDirection="rtl" android:fitsSystemWindows="true" android:id="@+id/drawer_layout"> <android.support.design.widget.CoordinatorLayout android:id="@+id/mainCoordinatorLayout" android:layout_width="match_parent" android:layout_height="match_parent" android:layoutDirection="rtl" android:background="#EEEEEE" android:clickable="true"> <android.support.design.widget.AppBarLayout android:layout_height="wrap_content" android:layout_width="match_parent" android:id="@+id/toolbar_layout"> <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/collapsing_toolbar" android:layout_width="match_parent" android:layout_height="250dp" app:collapsedTitleGravity="right" android:fitsSystemWindows="true" app:layout_scrollFlags="scroll|exitUntilCollapsed" app:contentScrim="?attr/colorPrimary" app:collapsedTitleTextAppearance="@style/CollapsedTitleTextAppearance" app:expandedTitleTextAppearance="@style/ExpandedTitleTextAppearance" app:expandedTitleMarginEnd="64dp" app:expandedTitleMarginStart="48dp"> <ImageView android:id="@+id/headerImage" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" android:scaleType="centerCrop" app:layout_collapseMode="parallax" android:src="@drawable/soldier" /> <View android:layout_width="match_parent" android:layout_height="88dp" android:background="@drawable/scrim_top" app:layout_collapseMode="pin" /> <View android:layout_width="match_parent" android:layout_height="88dp" android:layout_gravity="bottom" android:layout_alignBottom="@+id/headerImage" android:background="@drawable/scrim_bottom" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:theme="@style/WhiteTitle" app:layout_scrollFlags="scroll|enterAlways" app:titleTextColor="@color/White" android:fitsSystemWindows="true" android:layout_gravity="right" android:layoutDirection="rtl" app:layout_collapseMode="pin" /> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <FrameLayout android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/content_frame" android:animateLayoutChanges="true" app:layout_behavior="@string/appbar_scrolling_view_behavior"> <android.support.v4.widget.NestedScrollView android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior" android:fillViewport="true" /> </FrameLayout> <android.support.design.widget.FloatingActionButton android:id="@+id/mainFab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:layout_gravity="bottom|end" android:layout_marginLeft="16dp" android:layout_marginBottom="16dp" android:layout_marginTop="5dp" android:elevation="8dp" app:pressedTranslationZ="12dp" app:backgroundTint="?android:colorAccent" android:src="@drawable/ic_perm_phone_msg_white_24px" /> <LinearLayout android:id="@+id/miniFabFrame" android:orientation="vertical" android:layout_width="wrap_content" android:layout_height="wrap_content" android:visibility="invisible" android:layout_alignParentLeft="true" android:layout_gravity="bottom|end" android:layout_marginLeft="20dp" android:layout_marginBottom="80dp" android:padding="0dp"> <android.support.design.widget.FloatingActionButton android:id="@+id/messageFab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:elevation="8dp" android:layout_marginTop="5dp" android:layout_marginRight="0dp" android:layout_marginBottom="5dp" android:layout_marginLeft="5dp" app:pressedTranslationZ="12dp" app:backgroundTint="?android:colorPrimary" app:fabSize="mini" android:src="@drawable/ic_textSMS_white_24px" /> <android.support.design.widget.FloatingActionButton android:id="@+id/callFab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:layout_marginTop="5dp" android:layout_marginRight="0dp" android:layout_marginBottom="5dp" android:layout_marginLeft="5dp" android:elevation="8dp" app:pressedTranslationZ="12dp" app:backgroundTint="?android:colorPrimary" app:fabSize="mini" android:src="@drawable/ic_call_white_24px" /> </LinearLayout> </android.support.design.widget.CoordinatorLayout> <android.support.design.widget.NavigationView android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="right" android:id="@+id/nav_view" android:layoutDirection="rtl" app:headerLayout="@layout/header" app:menu="@menu/nav_menu" /> 

    Frammento con layout tabs:

     <LinearLayout 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:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" android:fitsSystemWindows="true" android:id="@+id/halachot_layout" android:layoutDirection="ltr" android:animateLayoutChanges="true"> <android.support.design.widget.AppBarLayout android:layout_height="wrap_content" android:layout_width="match_parent" android:elevation="0dp" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> <com.refractored.PagerSlidingTabStrip android:id="@+id/halachotTabs" android:layout_below="@id/halachot_layout" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="@android:color/transparent" android:fitsSystemWindows="true" pstsPaddingMiddle="false" app:pstsShouldExpand="true" /> </android.support.design.widget.AppBarLayout> <android.support.v4.view.ViewPager android:id="@+id/halachotPager" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" /> </LinearLayout> 

    Qualsiasi guida sarà apprezzata.

    Grazie.

  • Rileva finitura di animation nel recyclerView di Android
  • Separatore decimale con virgola (',') con numeroInput di dati in EditText
  • Accesso al firebase e logging con nome utente
  • Invia dati utilizzando Tcp / Udp
  • Come fare il button Drag & Drop in Android
  • JSON Parser exception: Valore .. non può essere convertito in JSONObject
  • 5 Solutions collect form web for “Schede Android in frammento con barra degli strumenti di collasso”

    Dovresti fare una struttura così

     <?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: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="256dp" 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" app:layout_scrollFlags="scroll|exitUntilCollapsed"> <android.support.design.widget.TabLayout android:id="@+id/tabs" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:layout_gravity="bottom" app:tabMode="scrollable" app:tabContentStart="72dp" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="?attr/colorPrimary" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" app:layout_collapseMode="parallax" /> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior" /> <android.support.design.widget.FloatingActionButton android:id="@+id/fab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="end|bottom" android:layout_margin="8dp" android:src="@drawable/ic_done" app:layout_anchor="@id/tabs" app:layout_anchorGravity="center|left|start" app:fabSize="mini" app:layout_behavior="com.support.android.designlibdemo.ScrollAwareFABBehavior" app:borderWidth="0dp" /> </android.support.design.widget.CoordinatorLayout> 

    Prese da qui

    Vedi anche questa risposta che ha spiegato bene lì.

    Se desideri ulteriori spiegazioni, legga questi blog

    http://blog.grafixartist.com/parallax-scrolling-tabs-design-support-library

    http://blog.nkdroidsolutions.com/collapsing-toolbar-with-tabs-android-example

    https://lab.getbase.com/nested-scrolling-with-coordinatorlayout-on-android/

    Ho avuto un problema simile. Ho risolto la rimozione elevation dell'ActionBar mostrando il frammento con l'ombra indesiderata.

    Ho aggiunto questi due methods nell'attività:

     public void setToolbarElevation(){ if (Build.VERSION.SDK_INT >= 21){ if (toolbar!=null) { toolbar.setElevation(getResources().getDimensionPixelSize(R.dimen.actionbar_elevation)); } } } public void removeToolbarElevation(){ if (Build.VERSION.SDK_INT >= 21){ if (toolbar!=null) { toolbar.setElevation(0); } } } 

    Così quando chiamate il frammento con le tabs, chiamate il removeToolbarElevation() nell'attività e l'ombra dovrebbe sparire.

    Fammi sapere se funziona per te.

    Quando mostro che il frammento viene visualizzato sotto la barra degli strumenti, con l'ombra della barra degli strumenti si sovrappone. Voglio che sia allo stesso livello con la barra degli strumenti, e cercare e agire come se fosse nello stesso AppBarLayout.

    per questo dare la stessa altezza alla tabulazione come per le linee guida di progettazione del materiale descritto qui l' elevazione di default è di 4 dp. quindi provate a dare l'elevazione del layout della scheda

    Inoltre, voglio rendere le tabs trasparenti quando la barra degli strumenti viene espansa.

    per aggiungere una class come questa

     public abstract class AppBarStateChangeListener implements AppBarLayout.OnOffsetChangedListener { public enum State { EXPANDED, COLLAPSED, IDLE } private State mCurrentState = State.IDLE; @Override public final void onOffsetChanged(AppBarLayout appBarLayout, int i) { if (i == 0) { if (mCurrentState != State.EXPANDED) { onStateChanged(appBarLayout, State.EXPANDED); } mCurrentState = State.EXPANDED; } else if (Math.abs(i) >= appBarLayout.getTotalScrollRange()) { if (mCurrentState != State.COLLAPSED) { onStateChanged(appBarLayout, State.COLLAPSED); } mCurrentState = State.COLLAPSED; } else { if (mCurrentState != State.IDLE) { onStateChanged(appBarLayout, State.IDLE); } mCurrentState = State.IDLE; } } public abstract void onStateChanged(AppBarLayout appBarLayout, State state); } 

    quindi nella sua attività lo usa come

     appBarLayout.addOnOffsetChangedListener(new AppBarStateChangeListener() { @Override public void onStateChanged(AppBarLayout appBarLayout, State state) { Log.d("STATE", state.name()); //if state is expanded then set your tab layout background to transparent } }); 

    Hai attraversato questo. Come mi riferisco a questo blog .

    È combinazione di quello che hai richiesto significa la combinazione di DrawerLayout + Fragments + CollapsingToolbarLayout .

    activity_main.xml

     <?xml version="1.0" encoding="utf-8"?> <android.support.v4.widget.DrawerLayout 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:id="@+id/drawer_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" tools:openDrawer="start"> <include layout="@layout/app_bar_main" android:layout_width="match_parent" android:layout_height="match_parent" /> <android.support.design.widget.NavigationView android:id="@+id/nav_view" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="start" android:fitsSystemWindows="true" app:headerLayout="@layout/nav_header_main" app:menu="@menu/activity_main_drawer" /> </android.support.v4.widget.DrawerLayout> 

    app_bar_main.xml

     <?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" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="192dp" android:theme="@style/AppTheme.AppBarOverlay"> <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/toolbar_layout" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_scrollFlags="scroll|exitUntilCollapsed"> <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_collapseMode="pin" app:layout_scrollFlags="scroll|enterAlways" app:popupTheme="@style/AppTheme.PopupOverlay" /> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <include layout="@layout/content_main" /> <android.support.design.widget.FloatingActionButton android:id="@+id/fab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom|end" android:layout_margin="@dimen/fab_margin" android:src="@android:drawable/ic_dialog_email" /> </android.support.design.widget.CoordinatorLayout> 

    content_main.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" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" app:layout_behavior="@string/appbar_scrolling_view_behavior" tools:context=".MainActivity" tools:showIn="@layout/app_bar_main"> <FrameLayout android:id="@+id/content_main_frame" android:layout_width="match_parent" android:layout_height="match_parent" /> </android.support.v4.widget.NestedScrollView> 

    Produzione :

    immettere qui la descrizione dell'immagine

    Grazie a tutti per tutto l'input.
    Quello che ho finito per fare, è questo:

    Principale Xml:

     <android.support.v4.widget.DrawerLayout 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" android:layout_gravity="right" android:clickable="true" android:layoutDirection="rtl" android:fitsSystemWindows="true" android:id="@+id/drawer_layout"> <android.support.design.widget.CoordinatorLayout android:id="@+id/mainCoordinatorLayout" android:layout_width="match_parent" android:layout_height="match_parent" android:layoutDirection="rtl" android:background="#EEEEEE" android:clickable="true"> <android.support.design.widget.AppBarLayout android:layout_height="wrap_content" android:layout_width="match_parent" android:id="@+id/toolbar_layout"> <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/collapsing_toolbar" android:layout_width="match_parent" android:layout_height="256dp" android:fitsSystemWindows="true" app:layout_scrollFlags="scroll|exitUntilCollapsed" app:contentScrim="?attr/colorPrimary" app:collapsedTitleGravity="right" app:expandedTitleGravity="bottom|right" app:expandedTitleMarginBottom="50dp" app:collapsedTitleTextAppearance="@style/CollapsedTitleTextAppearance" app:expandedTitleTextAppearance="@style/ExpandedTitleTextAppearance" app:expandedTitleMarginEnd="64dp" app:expandedTitleMarginStart="48dp"> <ImageView android:id="@+id/headerImage" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" android:scaleType="centerCrop" app:layout_collapseMode="parallax" android:background="@drawable/soldier" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:gravity="top" app:titleTextColor="@color/White" android:fitsSystemWindows="true" android:layout_gravity="right" android:layoutDirection="rtl" app:layout_collapseMode="pin" android:minHeight="?attr/actionBarSize" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" app:titleMarginTop="15dp" /> </android.support.design.widget.CollapsingToolbarLayout> <android.support.design.widget.TabLayout android:id="@+id/tabs" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:layout_gravity="bottom" app:tabIndicatorHeight="3dp" android:layoutDirection="ltr" app:tabIndicatorColor="@android:color/white" app:tabSelectedTextColor="@color/White" app:tabTextColor="@color/Black" app:tabMode="fixed" app:tabGravity="fill" /> </android.support.design.widget.AppBarLayout> <FrameLayout android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/content_frame" android:animateLayoutChanges="true" app:layout_behavior="@string/appbar_scrolling_view_behavior"> <android.support.v4.widget.NestedScrollView android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior" android:fillViewport="true" /> </FrameLayout> </android.support.design.widget.CoordinatorLayout> <android.support.design.widget.NavigationView android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="right" android:id="@+id/nav_view" android:layoutDirection="rtl" app:headerLayout="@layout/header" app:menu="@menu/nav_menu" /> </android.support.v4.widget.DrawerLayout> 

    Poi, quando commuto i frammenti, mostro le tabs solo sul frammento che li voglio e nascondi quando non voglio che mostri:

     toolbar_layout.SetExpanded(true); tabs.Visibility = ViewStates.Gone; 

    E quando voglio mostrargli:

     toolbar_layout.SetExpanded(false,false); tabs.Visibility = ViewStates.Visible; 

    Anche se non li rendo trasparenti, ma ho deciso di crollare la barra degli strumenti quando li mostro e disabilitare l'espansione del frammento con le tabs.
    Forse non la soluzione migliore, ma funziona abbastanza bene per me.

    Questi link mi hanno veramente aiutato:
    http://blog.iamsuleiman.com/parallax-scrolling-tabs-design-support-library/
    http://blog.iamsuleiman.com/material-design-tabs-with-android-design-support-library/
    – Come utilizzare un TabLayout con la barra degli strumenti all'interno di CollapsingToolbarLayout?
    http://manishkpr.webheavens.com/android-material-design-tabs-collapsible-example/
    – Distriggers la scorrimento nel bambino Recyclerview android – Come distriggersre l'espansione della barra degli strumenti sul frammento con le tabs (che contiene anche un recyclerview).

    Scopri come apparire qui: https://youtu.be/y2xLVSQ_NGM

    Può non essere la soluzione migliore, ma ho voluto un modo più pulito che sembra buono.
    Grazie a tutti per il vostro aiuto!

    L'Android è un fan Android di Google, tutto su telefoni Android, Android Wear, Android Dev e applicazioni Android Games e così via.