Ich verwende die FAB-Taste zusammen mit RecyclerView in einem Fragment. Dieses Fragment ist eine Instanz eines TabViewPagers. Ich habe ein Problem mit der FAB-Taste. Ich habe die RecyclerView- und die Fab-Schaltfläche in einem FrameLayout platziert, wobei der FAB-Button unten rechts positioniert ist. Jetzt ist das Problem, mit dem ich konfrontiert bin, der FAB-Button ist nicht vollständig sichtbar. Die Hälfte des Teils ist wie in der Abbildung unten ausgeblendet. Kann mir jemand helfen, dieses Problem zu lösen. Danke im Voraus.
Hinweis: Das FAB wird nach dem Scrollen korrekt ausgerichtet. Das Problem tritt nur dann auf, wenn es ideal ist (vor dem Scrollen).
fragment.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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.v7.widget.RecyclerView
Android:id="@+id/recyclerView"
Android:layout_width="match_parent"
Android:layout_height="match_parent"/>
<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="10dp"
app:backgroundTint="@color/red"
Android:src="@drawable/ic_done"/>
</FrameLayout>
tabviewpagerlayout.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"
Android:id="@+id/main_content"
Android:layout_width="match_parent"
Android:layout_height="match_parent">
<Android.support.design.widget.AppBarLayout
Android:id="@+id/appBarLayout"
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:popupTheme="@style/ThemeOverlay.AppCompat.Light"
app:layout_scrollFlags="scroll|enterAlways" />
<Android.support.design.widget.TabLayout
Android:id="@+id/tabs"
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"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</Android.support.design.widget.CoordinatorLayout>
Sie sollten Ihre FAB in die CoordinatorLayout
..__ verschieben. Etwas wie folgt:
<Android.support.design.widget.CoordinatorLayout>
<Android.support.design.widget.AppBarLayout>
<Android.support.v7.widget.Toolbar
app:layout_scrollFlags="scroll|enterAlways" />
<Android.support.design.widget.TabLayout/>
</Android.support.design.widget.AppBarLayout>
<Android.support.v4.view.ViewPager
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
<Android.support.design.widget.FloatingActionButton
Android:id="@+id/fab"
Android:layout_gravity="end|bottom"/>
</Android.support.design.widget.CoordinatorLayout>
Dann können Sie die RecyclerView auf folgende Weise im viewPager hinzufügen:
Adapter adapter = new Adapter(getSupportFragmentManager());
adapter.addFragment(new RecyclerViewFragment(), "Tab1");
viewPager.setAdapter(adapter);
wo sich das RecyclerViewFragment-Layout befindet:
<Android.support.v7.widget.RecyclerView
xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:id="@+id/recyclerView"
Android:layout_width="match_parent"
Android:layout_height="match_parent"/>
Es ist keine akzeptable Lösung, die FAB anzeigen oder ausblenden zu müssen, egal welche Registerkarte ausgewählt ist. Ich habe alle Layoutkombinationen ausprobiert, aber das Verschieben des FAB auf das Aktivitätslayout war die einzige Lösung, die funktionierte. Was aber, wenn Sie die Schaltfläche nur in einer Registerkarte benötigen? Dies ist der einzige Weg, der jetzt funktioniert, aber ich erwarte ein Update der Designbibliothek, da diese Version zu fehlerhaft ist. Im Endeffekt muss das FAB ein direkter Nachkomme des CoordinatorLayout sein, damit es nicht durch die zusammenklappende Symbolleiste nach unten gedrückt wird.
app:layout_scrollFlags="scroll|enterAlways"
entfernt wurde. Danksagungen an JDev unter Wie vermeide ich das Ausblenden der Registerkarten beim Scrollen nach unten?Ich bin gerade auf das gleiche Problem gestoßen. Leider habe ich keine Antwort für Sie, aber einen Zusatzpunkt.
Es ist nicht so, dass der Knopf nach unten gedrückt wird, sondern das gesamte Fragment wurde nach unten gedrückt. Ich habe es bisher noch nicht getestet, aber ich stelle mir vor, wenn es einen Weg gibt, mit dem Sie die Größe der Fragmentseite erkennen können, werden Sie feststellen, dass sie nicht am unteren Bildschirmrand endet, wie es sein sollte.
für eine mögliche Lösung denke ich darüber nach, eine Auffüllung der Größe "attr/actionBarSize" unten hinzuzufügen.
Ich teste das und poste es, wenn ich fertig bin
update: Da ich eine Grenze von 80 dp verwendet habe, bekomme ich einen Screenshot (Ich habe nicht den Ruf, einen Screenshot zu posten, wth)
Workaround:
<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/rootLayout"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
>
<Android.support.design.widget.AppBarLayout
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<include
layout="@layout/toolbar"/>
</Android.support.design.widget.AppBarLayout>
<FrameLayout
Android:id="@+id/fragment_root"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:background="@drawable/border"
Android:layout_marginTop="?attr/actionBarSize"
>
<!--Android:paddingBottom="?attr/actionBarSize"-->
<!--app:layout_behavior="@string/appbar_scrolling_view_behavior"-->
<LinearLayout
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:background="@drawable/border"></LinearLayout>
<fragment
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:name="com.derek.hianthy.mydiary.ui.BaseFragment"
tools:layout="@layout/layout"
Android:background="@drawable/border"
/>
</FrameLayout>
<Android.support.design.widget.FloatingActionButton
Android:id="@+id/fabBtn"
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:layout_gravity="bottom|right"
Android:layout_marginBottom="@dimen/fab_margin_bottom"
Android:layout_marginRight="@dimen/fab_margin_right"
Android:src="@drawable/ic_action_add"
app:borderWidth="0dp"
app:fabSize="normal"
Android:layout_alignParentBottom="true"
Android:layout_alignParentRight="true"
Android:layout_alignParentTop="false"
Android:layout_alignParentLeft="false" />
</Android.support.design.widget.CoordinatorLayout>
notic app: layout_behavior = "@ string/appbar_scrolling_view_behavior" wurde herausgenommen . result
Ich tat irgendwie, was Gabriele vorschlug, als er die FAB in die untergeordnete Aktivität verlegte. Außerdem müssen Sie die Farbe/den clickListener der FAB in onTabSelected aktualisieren:
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;
}
}
...
}
und dann in der Setup-Funktion einfach die Farbe einstellen und auf Listener klicken:
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();
}
});
}
Notieren Sie sich den Aufruf von setCurrentItem
oben. Es ist jetzt erforderlich, dass Sie TabLayout.OnTabSelectedListener
implementieren.
Es könnte etwas spät sein, aber für mich schien es die beste Option zu sein, ein anderes Fragment zu erstellen, das das Fragment mit Ihrem Inhalt und der schwebenden Schaltfläche enthält. Dieser Code funktioniert sehr gut in meiner Anwendung:
<FrameLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:tools="http://schemas.Android.com/tools"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
tools:context="domain.ItemsFragment">
<fragment
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:name="com.lucyapp.client.ItemFragment"
Android:id="@+id/fragment"
tools:layout="@layout/fragment_item_list" />
<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" />
</FrameLayout>
Diese Lösung hat für mich funktioniert. Erstellen Sie eine neue Klasse namens CustomBehavior mit dem folgenden Code:
public class CustomBehavior extends CoordinatorLayout.Behavior<ViewPager> {
private int mActionBarHeight;
public CustomBehavior(Context context, AttributeSet attributeSet) {
super(context, attributeSet);
init(context);
}
public CustomBehavior(Context context) {
init(context);
}
private void init(Context context) {
TypedValue tv = new TypedValue();
if (context.getTheme().resolveAttribute(Android.R.attr.actionBarSize, tv, true)) {
mActionBarHeight = TypedValue.complexToDimensionPixelSize(tv.data, context.getResources().getDisplayMetrics());
}
}
@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);
}
}
}
}
}
Weisen Sie nun dem Viewpager-Widget in der XML-Datei die benutzerdefinierte Verhaltensklasse zu
<Android.support.v4.view.ViewPager
Android:id="@+id/viewpager"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
app:layout_behavior="yourpackage.CustomBehavior"
/>
Ich habe die gleichen Probleme mit View-Pager 1. Fragment FAB-Schaltflächen werden unter dem Bildschirm und beim Scrollen der Anzeige angezeigt .. __ Nach einigen Befunden habe ich festgestellt, dass ich geschrieben habe
app:layout_behavior="@string/appbar_scrolling_view_behavior"
in ViewPager in CoordinatorLayout. Nach dem Entfernen dieses Bildlaufverhaltens werden Probleme mit der FAB-Position behoben.
Bitte überprüfen Sie, ob meine Implementierung korrekt funktioniert:
<?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="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/AppTheme.PopupOverlay">
<LinearLayout
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:orientation="vertical">
<TextView
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:gravity="center_horizontal"
Android:text="@string/app_name"
Android:textColor="@color/textPrimary"
Android:textSize="18sp" />
<TextView
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:gravity="center_horizontal"
Android:text="@string/str_toolbar_subtittle"
Android:textColor="@color/textPrimary"
Android:textSize="14sp" />
</LinearLayout>
</Android.support.v7.widget.Toolbar>
<Android.support.design.widget.TabLayout
Android:id="@+id/tabs"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:layout_gravity="bottom"
Android:background="?attr/colorPrimary"
app:tabGravity="fill"
app:tabIndicatorColor="@color/colorAccent"
app:tabSelectedTextColor="@color/errorColor"
app:tabTextColor="@color/white" />
</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:layout_below="@+id/app_bar" />
</Android.support.design.widget.CoordinatorLayout>
Ich hatte das gleiche Problem, bei dem die Anforderung bestand, FAB in einem Fragment darzustellen. Was ich getan habe, ist nur die Linie aus der Symbolleiste entfernt
app:layout_scrollFlags="scroll|enterAlways"
Sie können mein Layout überprüfen
<?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:id="@+id/main_content"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:fitsSystemWindows="true"
tools:context=".MainActivity">
<Android.support.design.widget.AppBarLayout
Android:id="@+id/appbar"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:paddingTop="@dimen/appbar_padding_top"
Android:background="@color/white"
app:elevation="0dp"
Android:elevation="0dp"
>
<Android.support.v7.widget.Toolbar
Android:id="@+id/toolbar_main"
Android:layout_width="match_parent"
Android:layout_height="?attr/actionBarSize"
Android:layout_weight="1"
Android:background="@color/white"
app:title="@string/app_name">
</Android.support.v7.widget.Toolbar>
<Android.support.design.widget.TabLayout
Android:id="@+id/tabs_main"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
>
</Android.support.design.widget.TabLayout>
</Android.support.design.widget.AppBarLayout>
<Android.support.v4.view.ViewPager
Android:id="@+id/container"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</Android.support.design.widget.CoordinatorLayout>