Question

我创建了一个带有标签的滑动视图，但是当在标签之间滑动时，标签中的内容会随着手指一起滑动，之前标签的内容将与要刷过的标签重叠。

例如：

enter image description here

这是我的MainActivity.java：

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.view.ViewPager;
import android.support.v7.app.ActionBar;
import android.support.v7.app.ActionBarActivity;
import android.view.Menu;
import android.view.MenuItem;

public class MainActivity extends ActionBarActivity {
    Fragment tab1Fragment = new Tab1();
    Fragment tab2Fragment = new Tab2();
    Fragment tab3Fragment = new Tab3();

    ViewPager mViewPager;
    private TabsPagerAdapter mAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mViewPager = (ViewPager) findViewById(R.id.pager);
        mViewPager.setOnPageChangeListener(
                new ViewPager.SimpleOnPageChangeListener() {
                    @Override
                    public void onPageSelected(int position) {
                        getSupportActionBar().setSelectedNavigationItem(position);
                    }
                });

        mAdapter = new TabsPagerAdapter(getSupportFragmentManager());
        mViewPager.setAdapter(mAdapter);

        ActionBar actionBar = getSupportActionBar();
        actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

        //Instantiate the tabs.
        tab1 = actionBar.newTab();
        tab2 = actionBar.newTab();
        tab3 = actionBar.newTab();

        //Set the tabs' text.
        tab1.setText("Tab 1");
        tab2.setText("Tab 2");
        tab3.setText("Tab 3");

        //Setting up the tab listeners
        tab1.setTabListener(new MyTabListener(tab1Fragment));
        tab2.setTabListener(new MyTabListener(tab2Fragment));
        tab3.setTabListener(new MyTabListener(tab3Fragment));

        //Adding tabs to the ActionBar
        actionBar.addTab(tab1);
        actionBar.addTab(tab2);
        actionBar.addTab(tab3);

    }

    @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_main, 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();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

MyTabListener.java：

import android.support.v4.app.Fragment;

public class MyTabListener implements android.support.v7.app.ActionBar.TabListener {
    private Fragment fragment;

    public MyTabListener(Fragment fragment) {
        this.fragment = fragment;
    }

    @Override
    public void onTabSelected(android.support.v7.app.ActionBar.Tab tab, android.support.v4.app.FragmentTransaction ft) {
        ft.add(android.R.id.content, fragment);
        ft.attach(fragment);
    }

    @Override
    public void onTabUnselected(android.support.v7.app.ActionBar.Tab tab, android.support.v4.app.FragmentTransaction ft) {
        ft.remove(fragment);
    }

    @Override
    public void onTabReselected(android.support.v7.app.ActionBar.Tab tab, android.support.v4.app.FragmentTransaction ft) {

    }
}

Tab1.java（Tab2.java和Tab3.java相似）：

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class Tab1 extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {

        View rootView = inflater.inflate(R.layout.tab1_layout, container, false);

        return rootView;
    }
}

TabsPagerAdapter.java：

import android.support.v4.app.FragmentManager;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentPagerAdapter;

public class TabsPagerAdapter extends FragmentPagerAdapter {
    public TabsPagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int index) {
        switch (index) {
            case 0:
                return new Tab1();
            case 1:
                return new Tab2();
            case 2:
                return new Tab3();
        }
        return null;
    }

    @Override
    public int getCount() {
        return 3;
    }
}

activity_main.xml：

<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
                                   android:id="@+id/pager"
                                   android:layout_width="match_parent"
                                   android:layout_height="match_parent">
</android.support.v4.view.ViewPager>

tab1_layout.xml（tab2_layout.xml和tab3_layout.xml相似）：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="This is tab 1."/>
</LinearLayout>

我尝试在选项卡XML布局文件中添加背景颜色，但之后根本就没有滑动动画。我的Android版本是4.4.2，我不知道问题是否与此有关。如何解决此问题，以便选项卡滑动而不会与上一个标签重叠内容？

Answer 1

见Developer site - adding tabs with swipe view

上的解释

不要调用add（）或附加方法，但是这样做：

public void onTabSelected(ActionBar.Tab tab, FragmentTransaction ft) {
    mViewPager.setCurrentItem(tab.getPosition());
}

Answer 2

您可能需要考虑使用新的支持设计库，新的TabLayout可以更轻松地编写滑动布局，因为Google现已弃用ActionBar标签。

https://github.com/codepath/android_guides/wiki/Google-Play-Style-Tabs-using-TabLayout

Answer 3

在类MyTabListener 更改

中

android.R.id.content

由此

R.id.action_bar_activity_content

您使用的是哪个Android支持库？此问题已在 Support Library v19 ？

中修复

Here您有关于此

的更多信息

滑动没有标签内容重叠

3 个答案: