Le bouton d’action flottant ne s’affiche pas complètement à l’intérieur d’un fragment

J’utilise le bouton FAB avec RecyclerView dans un fragment. Ce fragment est une instance de TabViewPager. J’ai un problème avec le bouton FAB. J’ai placé RecyclerView et le bouton Fab dans un FrameLayout, où le bouton FAB est positionné en bas à droite. Maintenant, le problème auquel je suis confronté est que le bouton FAB n’est pas complètement visible. Sa moitié de la portion est cachée comme le montre la capture d’écran ci-dessous. Quelqu’un peut-il m’aider à résoudre ce problème. Merci d’avance.

FAB avec RecyclerView à l'intérieur de FrameLayout

Remarque: le FAB s’aligne correctement une fois qu’il est défilé. Le problème ne se pose que s’il est idéal (avant le défilement).

fragment.xml

     

tabviewpagerlayout.xml

         

Vous devriez déplacer votre FAB dans le CoordinatorLayout . Quelque chose comme ça:

         

Vous pouvez ensuite append RecyclerView à l’intérieur du viewPager de la manière suivante:

 Adapter adapter = new Adapter(getSupportFragmentManager()); adapter.addFragment(new RecyclerViewFragment(), "Tab1"); viewPager.setAdapter(adapter); 

où la disposition RecyclerViewFragment est:

   

Ce n’est pas une solution acceptable de devoir afficher / masquer l’onglet FAB, quel qu’il soit, sélectionné. J’ai essayé toutes les combinaisons de disposition, mais la seule solution qui fonctionnait était de déplacer le FAB dans la disposition des activités. Mais que se passe-t-il si vous avez besoin du bouton uniquement dans un onglet? C’est le seul moyen qui fonctionne maintenant, mais j’attends une mise à jour de la bibliothèque de conception car cette version est trop boguée. Quoi qu’il en soit, le FAB doit être un descendant direct du CoordinatorLayout, il ne sera donc pas poussé par la barre d’outils qui se réduit …

  1. J’ai eu le même problème que le FloatingActionButton était complètement invisible, et il était hors de l’écran en bas. Quand je fais défiler, ça revient.
  2. De plus, les tabs se cachaient quand ils défilaient vers le bas mais je voulais qu’ils soient toujours visibles, donc je les ai corrigés en supprimant app:layout_scrollFlags="scroll|enterAlways" . Crédits à JDev sur la façon d’éviter de cacher les tabs lorsqu’ils défilent vers le bas?
    Cela a résolu le problème FloatingActionButton également, il est maintenant visible.

J’ai en quelque sorte fait ce que Gabriele a suggéré en déplaçant le FAB dans l’activité contenant. Vous devrez également mettre à jour la couleur / clickListener de FAB dans onTabSelected:

 public class MainActivity extends AppCompatActivity implements TabLayout.OnTabSelectedListener { @Override protected void onCreate(Bundle savedInstanceState) { ... setFloatingActionButtonForImagesTab(); } ... @Override public void onTabSelected(final TabLayout.Tab tab) { switch (tab.getPosition()) { case 0: setFloatingActionButtonForImagesTab(); break; case 1: setFloatingActionButtonForMusicTab(); break; case 2: setFloatingActionButtonForVideoTab(); break; } } ... } 

puis, dans la fonction de configuration, définissez simplement la couleur et cliquez sur écouteur:

 private void setFloatingActionButtonForImagesTab() { myViewPager.setCurrentItem(0); floatingActionButton.setBackgroundTintList(getResources().getColorStateList(R.color.purple)); floatingActionButton.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Snackbar.make(coordinatorLayout, "images", Snackbar.LENGTH_LONG) .show(); } }); } 

Prenez note de l’appel à setCurrentItem ci-dessus. Il est maintenant nécessaire que vous implémentiez TabLayout.OnTabSelectedListener .

Je viens de rencontrer le même problème. Malheureusement, je n’ai pas de réponse pour vous, mais un point supplémentaire.

Ce n’est pas que le bouton est enfoncé, c’est tout le fragment qui a été poussé vers le bas. Je ne l’ai pas encore testé, mais j’imagine que s’il existe un moyen de voir la taille de la page de fragment, vous verrez qu’elle ne se termine pas au bas de l’écran comme il se doit.

pour une solution possible, je pense à append un remplissage de taille “? attr / actionBarSize” en bas.

Je vais tester cela, et poster à la fin

mise à jour: comme j’ai utilisé une bordure de 80 dp, obtenir une capture d’écran (je n’ai pas 10 réputation pour poster une capture d’écran, wth)

solution de contournement:

             

notic app: layout_behavior = “@ ssortingng / appbar_scrolling_view_behavior” a été supprimé. résultat

Il pourrait être un peu tard mais pour moi, la meilleure option semblait être de créer un autre fragment contenant le fragment avec votre contenu et le bouton flottant. Ce code fonctionne très bien dans mon application:

     

Je suis confronté aux mêmes problèmes avec les téléavertisseurs de 1ère Les boutons FAB Fragment sont affichés sous l’écran et défilent dans son émission. Mais après quelques découvertes, j’ai trouvé que j’avais écrit

 app:layout_behavior="@ssortingng/appbar_scrolling_view_behavior" 

dans ViewPager dans CoordinatorLayout. Donc, après avoir supprimé ce comportement de défilement, les problèmes de position FAB sont résolus.

Veuillez vérifier que ma mise en œuvre fonctionne correctement:

              

Cette solution a fonctionné pour moi. Créez une nouvelle classe appelée CustomBehavior avec le code suivant:

 public class CustomBehavior extends CoordinatorLayout.Behavior { private int mActionBarHeight; public CustomBehavior(Context context, AtsortingbuteSet atsortingbuteSet) { super(context, atsortingbuteSet); init(context); } public CustomBehavior(Context context) { init(context); } private void init(Context context) { TypedValue tv = new TypedValue(); if (context.getTheme().resolveAtsortingbute(android.R.attr.actionBarSize, tv, true)) { mActionBarHeight = TypedValue.complexToDimensionPixelSize(tv.data, context.getResources().getDisplayMesortingcs()); } } @Override public boolean layoutDependsOn(CoordinatorLayout parent, ViewPager child, View dependency) { return dependency instanceof AppBarLayout; } public boolean onDependentViewChanged(CoordinatorLayout parent, ViewPager child, View dependency) { offsetChildAsNeeded(parent, child, dependency); return false; } private void offsetChildAsNeeded(CoordinatorLayout parent, View child, View dependency) { if (child instanceof ViewPager) { ViewPager viewPager = (ViewPager) child; View list = viewPager.findViewById(R.id.recycler_view); if (list != null) { final CoordinatorLayout.Behavior behavior = ((CoordinatorLayout.LayoutParams) dependency.getLayoutParams()).getBehavior(); if (behavior instanceof AppBarLayout.Behavior) { final AppBarLayout.Behavior ablBehavior = (AppBarLayout.Behavior) behavior; AppBarLayout appBarLayout = (AppBarLayout) dependency; ViewCompat.setTranslationY(list, ablBehavior.getTopAndBottomOffset() + appBarLayout.getTotalScrollRange() + mActionBarHeight); } } } } 

}

Maintenant, affectez la classe de comportement personnalisé au widget viewpager dans le fichier xml