Pływający przycisk akcji nie pokazuje w pełni fragmentu

Używam przycisku FAB wraz z RecyclerView we fragmencie. Ten Fragment jest instancją TabViewPager. Mam problem z przyciskiem FAB. Umieściłem RecyclerView i przycisk fab wewnątrz FrameLayout, gdzie Fab buttton jest umieszczony na dole po prawej stronie. Teraz problem, z którym się borykam, to przycisk FAB nie jest w pełni widoczny. Jego połowa części jest ukryta, jak pokazano na poniższym zrzucie ekranu. Czy ktoś może mi pomóc rozwiązać ten problem. Z góry dzięki.

FAB z RecyclerView wewnątrz FrameLayout

Uwaga: FAB wyrównuje się prawidłowo po przewinięciu. Problem pojawia się tylko wtedy, gdy jest idealny(przed wykonaniem przewijania).

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>
Author: Chandru, 2015-06-09

8 answers

Należy przenieść swój FAB wewnątrz CoordinatorLayout. Coś takiego:

<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>

Następnie możesz dodać RecyclerView wewnątrz viewpagera w ten sposób:

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

Gdzie układ RecyclerViewFragment to:

 <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"/>
 10
Author: Gabriele Mariotti,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-06-10 06:41:39

Nie jest akceptowalnym rozwiązaniem Pokazywanie/ukrywanie zakładki FAB whatever tab is selected. Wypróbowałem każdą kombinację układu, ale przeniesienie bajek do układu aktywności było jedynym rozwiązaniem, które zadziałało. Ale co, jeśli potrzebujesz przycisku tylko w jednej zakładce? To jedyny sposób, który teraz działa, ale spodziewam się aktualizacji biblioteki projektowej, ponieważ ta wersja jest zbyt błędna. W każdym razie, najważniejsze jest to, że FAB musi być bezpośrednim potomkiem koordynatora, więc nie zostanie zepchnięty w dół przez zwijający się pasek narzędzi...

 16
Author: Bojan Ilievski,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-07-06 13:38:54
  1. miałem ten sam problem, że Pływający przycisk był całkowicie niewidoczny i był poza ekranem na dole. Kiedy przewijam w dół, pojawia się w górę.
  2. również karty były coraz ukryte podczas przewijania w dół, ale chciałem, aby były zawsze widoczne, więc naprawiłem to usuwając app:layout_scrollFlags="scroll|enterAlways". Credits to JDev at Jak uniknąć ukrywania kart po przewinięciu w dół?
    To rozwiązało również problem FloatingActionButton, który jest teraz widoczny.
 6
Author: cgr,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-23 11:46:53

Zrobiłem to, co Gabriele zasugerowała, przenosząc FAB do aktywności zawierającej. Ponadto będziesz musiał zaktualizować FAB ' s color / clickListener w 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;
        }
    }

    ...

}

A następnie w funkcji setup Ustaw kolor i kliknij listener:

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();
        }
    });
}

Zanotuj wezwanie do setCurrentItem powyżej. Jest to wymagane teraz, gdy wdrażasz TabLayout.OnTabSelectedListener.

 4
Author: Adam Johns,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-07-06 18:00:56

Właśnie natknąłem się na ten sam problem. Niestety nie mam dla Ciebie odpowiedzi, ale jakiś dodatek.

Nie jest tak, że przycisk jest wciśnięty w dół, tylko cały fragment został wciśnięty w dół. Nie testowałem go do tej pory, ale wyobrażam sobie, że jeśli istnieje sposób, który pozwala zobaczyć rozmiar strony fragmentu, zobaczysz, że nie kończy się na dole ekranu tak, jak powinno być.

Dla możliwego rozwiązania, myślę o dodaniu wyściółki o rozmiarze"?attr/actionBarSize " w dno.

Przetestuję to, i po zakończeniu

Aktualizacja: Jak użyłem granicy 80 dp, uzyskaj screen shot (nie mam reputacji 10, aby opublikować screen shot, wth)

Obejście:

<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 " został usunięty. wynik

 4
Author: Derek Zhu,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-07-13 05:16:29

Może być trochę późno, ale dla mnie najlepszą opcją wydawało się stworzenie kolejnego fragmentu, który zawiera fragment z Twoją treścią i pływającym przyciskiem. Ten kod działa bardzo dobrze w mojej aplikacji:

<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>
 3
Author: speedingdeer,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-01-23 21:22:26

Mam do czynienia z tymi samymi problemami z view pager 1st Fragment FAB przyciski pokazuje poniżej ekranu i na przewijanie jego Pokaż. Ale po kilku ustaleniach okazało się, że napisałem

app:layout_behavior="@string/appbar_scrolling_view_behavior"

W ViewPager w CoordinatorLayout. Tak więc po usunięciu tego zachowania przewijania problemy z pozycją FAB są rozwiązywane.

Proszę sprawdzić, czy moja implementacja działa poprawnie:

<?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>
 2
Author: Nikhil Jogdand,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-02-11 17:48:26

To rozwiązanie zadziałało. Utwórz nową klasę o nazwie CustomBehavior o następującym kodzie:

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);
            }
        }
    }
}

}

Teraz Przypisz klasę custom behavior do widżetu viewpager w pliku xml

<android.support.v4.view.ViewPager
    android:id="@+id/viewpager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="yourpackage.CustomBehavior"
    />
 1
Author: ignacio_gs,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-04-28 10:03:32