android - MVVM : Fragment overlapping issue in view pager with navigation view?

Question

当我在导航 View 的菜单之间切换时，我遇到了 fragment 重叠的问题。最初我的应用程序具有带有多个选项的导航 View 。在该主页选项 fragment 中，具有包含两个选项卡的 View 寻呼机。当我在 View 之间切换时寻呼机标签效果很好..

问题是当我从“设置”之类的导航切换菜单时，相应的 fragment 加载良好，然后我重新加载主页 fragment ， View 寻呼机加载选项卡，但旧 fragment (设置)显示在背景中

此外，当我多次加载 home 选项时， fragment 会重叠多次而不是替换 fragment

我的代码如下

Activity 类:DashboardActivity.java

/**
 *   DashboardActivity.java
 */

public class DashboardActivity extends AppCompatActivity
        implements NavigationView.OnNavigationItemSelectedListener, FragmentManager.OnBackStackChangedListener,
        ViewPageListener {

    /**
     * Used as initializing the layout as data binding.
     */
    private ActivityDashboardBinding activityDashboardBinding;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        activityDashboardBinding = DataBindingUtil.setContentView(this, R.layout.activity_dashboard);
        activityDashboardBinding.setOnClickController(new DashboardController());
        setSupportActionBar(activityDashboardBinding.toolbar);
        getSupportActionBar().setDisplayShowTitleEnabled(false);
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
                this, activityDashboardBinding.drawerLayout, activityDashboardBinding.toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
        activityDashboardBinding.drawerLayout.addDrawerListener(toggle);
        activityDashboardBinding.navigationView.setNavigationItemSelectedListener(this);
        toggle.syncState();
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setDefaultDisplayHomeAsUpEnabled(false);
        toggle.setDrawerIndicatorEnabled(false);
        toggle.setHomeAsUpIndicator(R.drawable.ic_menu_hamburger);
        toggle.setToolbarNavigationClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                if (activityDashboardBinding.drawerLayout.isDrawerOpen(GravityCompat.START)) {
                    activityDashboardBinding.drawerLayout.closeDrawer(GravityCompat.START);
                } else {
                    activityDashboardBinding.drawerLayout.openDrawer(GravityCompat.START);
                }
            }
        });
        displaySelectedScreen(R.id.nav_home);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_dashboard, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();
        if (id == R.id.action_notification) {
            startActivity(new Intent(this, NotificationActivity.class));
            return true;
        }
        return super.onOptionsItemSelected(item);
    }

    @SuppressWarnings("StatementWithEmptyBody")
    @Override
    public boolean onNavigationItemSelected(@NonNull MenuItem item) {
        // Handle navigation view item clicks here.
        displaySelectedScreen(item.getItemId());
        return true;
    }

    /**
     * Method used as navigation selection option.
     *
     * @param itemId Selected  id.
     */
    private void displaySelectedScreen(int itemId) {
        Fragment fragment = null;
        String fragmentName = null;
        if (itemId == R.id.nav_home) {
            activityDashboardBinding.toolBarTitle.setText(R.string.toolbar_name_dashboard);
            activityDashboardBinding.addNewRide.show();
            fragment = new HomePageFragment();
            fragmentName = Constants.NAME_NAVIGATION_DASHBOARD;
        } else if (itemId == R.id.nav_rides) {
        } else if (itemId == R.id.nav_profile) {
            activityDashboardBinding.toolBarTitle.setText(R.string.toolbar_name_my_profile);
            activityDashboardBinding.addNewRide.hide();
            fragment = new UserProfileFragment();
            fragmentName = Constants.NAME_NAVIGATION_MY_PROFILE;
        } else if (itemId == R.id.nav_settings) {
            activityDashboardBinding.toolBarTitle.setText(R.string.toolbar_name_settings);
            fragment = new SettingsFragment();
            activityDashboardBinding.addNewRide.hide();
            fragmentName = Constants.NAME_NAVIGATION_SETTINGS;
        } else if (itemId == R.id.nav_logout) {
            Intent logoutIntent = new Intent(getApplicationContext(), LoginActivity.class);
            logoutIntent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK | Intent.FLAG_ACTIVITY_CLEAR_TASK);
            startActivity(logoutIntent);
        }

        if (fragment != null) {
            FragmentManager fragmentManager = getSupportFragmentManager();
            fragmentManager.addOnBackStackChangedListener(this);
            fragmentManager.beginTransaction().add(R.id.container, fragment)
                    .addToBackStack(fragmentName).commit();
        }
        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        drawer.closeDrawer(GravityCompat.START);
    }

    @Override
    public void onBackPressed() {
        if (activityDashboardBinding.drawerLayout.isDrawerOpen(GravityCompat.START)) {
            activityDashboardBinding.drawerLayout.closeDrawer(GravityCompat.START);
        } else if (getFragmentName().equals(Constants.NAME_NAVIGATION_DASHBOARD)) {
            finish();
        } else {
            // Let super handle the back press
            super.onBackPressed();
        }
    }

    @Override
    public void onBackStackChanged() {
        if (getFragmentName().equals(Constants.NAME_NAVIGATION_DASHBOARD)) {
            activityDashboardBinding.toolBarTitle.setText(R.string.toolbar_name_dashboard);
            activityDashboardBinding.addNewRide.show();
        } else if (getFragmentName().equals(Constants.NAME_NAVIGATION_MY_PROFILE)) {
            activityDashboardBinding.toolBarTitle.setText(R.string.toolbar_name_my_profile);
            activityDashboardBinding.addNewRide.hide();
        } else {
            activityDashboardBinding.toolBarTitle.setText(R.string.toolbar_name_settings);
            activityDashboardBinding.addNewRide.hide();
        }
    }

    /**
     * Method used to get the fragment transaction name to identify the fragment.
     *
     * @return the fragment name.
     */
    private String getFragmentName() {
        FragmentManager fm = getSupportFragmentManager();
        return fm.getBackStackEntryAt(fm.getBackStackEntryCount() - 1).getName();
    }

    @Override
    public void onViewPageListener() {
        activityDashboardBinding.addNewRide.animate().translationY(0).setInterpolator(new LinearInterpolator()).start();
    }
}

DashboardViewAdapter.java

/**
 * The class that contains the list of fragments and list of title. We can use the fragments using
 * view pager from here.
 *
 * @version 1.0
 */
public class DashboardViewAdapter extends FragmentStatePagerAdapter {
    /**
     * Title of the fragment list.
     */
    private String[] mTitle;
    /**
     * Fragment list Which contains the fragments on the adapter.
     */
    private List<Fragment> fragmentList;
    /**
     * Instantiates a new adapter dashboard view.
     *
     * @param fm the Instance of the FragmentManager.
     */
    public DashboardViewAdapter(FragmentManager fm) {
        super(fm);
    }
    /**
     * Set the list of title from the activity.
     *
     * @param titles Title list.
     */
    public void setTitle(String[] titles) {
        this.mTitle = titles;
    }
    /**
     * Set the fragment list for the particular view pager using FragmentStatePagerAdapter.
     *
     * @param fragmentList List of fragment.
     */
    public void setFragmentList(List<Fragment> fragmentList) {
        this.fragmentList = fragmentList;
    }
    @Override
    public Fragment getItem(int position) {
        return fragmentList.get(position);
    }
    @Override
    public int getCount() {
        return mTitle.length;
    }
    @Override
    public CharSequence getPageTitle(int position) {
        return mTitle[position];
    }
}

HomePageFragment.java

/**
 * Fragment used as home page to display the ride offered and my rides details.
 *
 * @version 1.0
 */
public class HomePageFragment extends Fragment implements ViewPager.OnPageChangeListener {

    /**
     * Binding the fragment.
     */
    private FragmentHomePageBinding homePageBinding;

    /**
     * Interface to listen the view pager changes.
     */
    private ViewPageListener viewPageListener;

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        homePageBinding = DataBindingUtil.inflate(inflater, R.layout.fragment_home_page, container, false);
        setTabs();
        setHasOptionsMenu(true);
        viewPageListener = (ViewPageListener) getActivity();
        return homePageBinding.getRoot();
    }

    /**
     * Set up the Ride offers and My rides fragments in the tab
     */
    private void setTabs() {
        String[] mTitle = new String[]{"Rides offered", "My Rides"};
        FragmentManager fm = getChildFragmentManager();
        DashboardViewAdapter mAdapter = new DashboardViewAdapter(fm);
        mAdapter.setTitle(mTitle);
        mAdapter.setFragmentList(getFragmentList());
        homePageBinding.viewPager.setAdapter(mAdapter);
        homePageBinding.tabLayout.setupWithViewPager(homePageBinding.viewPager);
        homePageBinding.viewPager.addOnPageChangeListener(this);
    }

    /**
     * Get the fragment list to display the view pager tabs. Recent chat and contacts fragment will
     * be return from this.
     *
     * @return List of the fragments for the viewpager
     */
    private List<Fragment> getFragmentList() {

        /**
         * Add the fragment as a list.
         */
        List<Fragment> fragmentList = new ArrayList<>();

        /**
         The fragment contacts which contains the ride offer list.
         */
        RidesOfferedFragment ridesOfferedFragment = new RidesOfferedFragment();

        /**
         The fragment contacts which contains the ride offer list.
         */
        MyRidesFragment myRidesFragment = new MyRidesFragment();
        fragmentList.add(ridesOfferedFragment);
        fragmentList.add(myRidesFragment);
        return fragmentList;
    }

    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        viewPageListener.onViewPageListener();
    }

    @Override
    public void onPageSelected(int position) {
        //Overridden Method
    }

    @Override
    public void onPageScrollStateChanged(int state) {
        //Overridden Method
    }

    @Override
    public void onPrepareOptionsMenu(Menu menu) {
        menu.findItem(R.id.action_notification).setVisible(true);
        super.onPrepareOptionsMenu(menu);
    }
}

activity_dashboard.xml

<?xml version="1.0" encoding="utf-8"?>
<layout 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">

    <data>

        <variable
            name="onClickController"
            type="com.contus.carpooling.dashboard.homepage.viewmodel.DashboardController" />
    </data>

    <android.support.v4.widget.DrawerLayout
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        tools:openDrawer="start">

        <android.support.design.widget.CoordinatorLayout
            android:id="@+id/coordinator_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            tools:context="com.contus.carpooling.dashboard.homepage.view.DashboardActivity">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">

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

                    <TextView
                        android:id="@+id/tool_bar_title"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:text="Dashboard"
                        android:textColor="@android:color/white"
                        android:textSize="18sp" />
                </android.support.v7.widget.Toolbar>

                <FrameLayout
                    android:id="@+id/container"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    app:layout_behavior="@string/appbar_scrolling_view_behavior" />

            </LinearLayout>

            <android.support.design.widget.FloatingActionButton
                android:id="@+id/add_new_ride"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="right|bottom"
                android:layout_margin="10dp"
                android:clickable="true"
                android:onClick="@{onClickController.fabBtnOnClick()}"
                android:src="@drawable/ic_action_add"
                app:backgroundTint="@color/colorSecondaryColor"
                app:fabSize="normal"
                app:layout_behavior="com.contus.carpooling.view.ScrollAwareFABBehavior" />

        </android.support.design.widget.CoordinatorLayout>

        <android.support.design.widget.NavigationView
            android:id="@+id/navigation_view"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:background="@android:color/white"
            android:fitsSystemWindows="true"
            app:headerLayout="@layout/navigation_header"
            app:itemIconTint="@color/colorPrimary"
            app:itemTextColor="#4b4b4b"
            app:menu="@menu/activity_dashboard_drawer"
            app:theme="@style/NavigationDrawerSelected" />
    </android.support.v4.widget.DrawerLayout>
</layout>

fragment_home_page.xml

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

    <data />
<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        tools:context="com.contus.carpooling.dashboard.homepage.view.HomePageFragment">

        <android.support.design.widget.TabLayout
            android:id="@+id/tab_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/colorPrimary"
            android:minHeight="?attr/actionBarSize"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:tabIndicatorColor="@color/colorHighLightBlue"
            app:tabIndicatorHeight="4dp" />

        <android.support.v4.view.ViewPager
            android:id="@+id/view_pager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />
    </LinearLayout>

</FrameLayout>
</layout>

设置显示在仪表板背景中..重叠图像

等待回复...提前致谢

Answer 1

这里的问题是添加的 fragment 将背景设置为透明，因此将背景设置为您要添加的布局 fragment 文件例如:

    <FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorBackground"
>