如何在SlidingTabLayout中处理片段布局的滚动

时间:2016-01-12 09:53:12

标签: android-fragments android-viewpager scrollview android-tabs

如果我必须在ViewPager中有2个标签,并且每个标签都有它自己的片段与它相关联。如果相应标签的片段将ScrollView作为MainView。如果我滚动第一个标签的布局并移动到第二个标签选项卡再次向后滑动到第一个它处于与我离开时相同的滚动状态。

那么当我点击或滑动到标签时,如何将自动滚动到顶部。

我试过Scrollview.fullScroll(View.FOCUS_UP);和Scrollview.scrollTo(0,0);

ViewPagerAdapter.java

 public class ViewPagerAdapter extends FragmentStatePagerAdapter {

    private CharSequence Titles[]; // This will Store the Titles of the Tabs which are Going to be passed when ViewPagerAdapter is created
    private int NumbOfTabs; // Store the number of tabs, this will also be passed when the ViewPagerAdapter is created

    public ViewPagerAdapter (FragmentManager fm, CharSequence mTitles[], int mNumbOfTabsumb) {
        super(fm);
        this.Titles = mTitles;
        this.NumbOfTabs = mNumbOfTabsumb;
    }


    @Override
    public Fragment getItem(int position) {
        if(position == 0) // if the position is 0 we are returning the First tab
        {
            Tab_1 tab1 = new Tab_1();
            return tab1;
        }
        else             // As we are having 2 tabs if the position is now 0 it must be 1 so we are returning second tab
        {
            Tab_2 tab2 = new Tab_2();
            return tab2;
        }

    }

    @Override
    public CharSequence getPageTitle(int position)
    {
        return Titles[position];
    }

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

SlidingTabLayout.java

public class SlidingTabLayout extends HorizontalScrollView {

    public interface TabColorizer {

        int getIndicatorColor(int position);

    }

    public interface TabIconProvider {
        int getPageIconResId(int position);
    }

    private static final int TITLE_OFFSET_DIPS = 24;
    private static final int TAB_VIEW_PADDING_DIPS = 16;
    private static final int TAB_VIEW_TEXT_SIZE_SP = 12;

    private int mTitleOffset;

    private int mTabViewLayoutId;
    private int mTabViewTextViewId;
    private boolean mDistributeEvenly;

    private ViewPager mViewPager;

    private SparseArray<String> mContentDescriptions = new SparseArray<String>();

    private ViewPager.OnPageChangeListener mViewPagerPageChangeListener;

    private final SlidingTabStrip mTabStrip;

    public SlidingTabLayout(Context context) {
        this(context, null);
    }

    public SlidingTabLayout(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public SlidingTabLayout(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);

        // Disable the Scroll Bar
        setHorizontalScrollBarEnabled(false);
        // Make sure that the Tab Strips fills this View
        setFillViewport(true);

        mTitleOffset = (int) (TITLE_OFFSET_DIPS * getResources().getDisplayMetrics().density);

        mTabStrip = new SlidingTabStrip(context);
        addView(mTabStrip, LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
    }

    /**
     * Set the custom {@link //com.google.samples.apps.iosched.ui.widget.SlidingTabLayout.TabColorizer} to be used.
     *
     * If you only require simple custmisation then you can use
     * {@link #setSelectedIndicatorColors(int...)} to achieve
     * similar effects.
     */
    public void setCustomTabColorizer(TabColorizer tabColorizer) {
        mTabStrip.setCustomTabColorizer(tabColorizer);
    }

    public void setDistributeEvenly(boolean distributeEvenly) {
        mDistributeEvenly = distributeEvenly;
    }

    /**
     * Sets the colors to be used for indicating the selected tab. These colors are treated as a
     * circular array. Providing one color will mean that all tabs are indicated with the same color.
     */

    public void setSelectedIndicatorColors(int... colors) {
        mTabStrip.setSelectedIndicatorColors(colors);
    }

    public void setTitleTextColor(int color) {
        for (int i = 0; i < mTabStrip.getChildCount(); i++) {
            if (mTabStrip.getChildAt(i) != null && TextView.class.isInstance(mTabStrip.getChildAt(i))) {
                ((TextView) mTabStrip.getChildAt(i)).setTextColor(color);
            }
        }
    }

    /**
     * Set the {@link ViewPager.OnPageChangeListener}. When using {@link //com.google.samples.apps.iosched.ui.widget.SlidingTabLayout} you are
     * required to set any {@link ViewPager.OnPageChangeListener} through this method. This is so
     * that the layout can update it's scroll position correctly.
     *
     * @see ViewPager#setOnPageChangeListener(ViewPager.OnPageChangeListener)
     */
    public void setOnPageChangeListener(ViewPager.OnPageChangeListener listener) {
        mViewPagerPageChangeListener = listener;
    }

    /**
     * Set the custom layout to be inflated for the tab views.
     *
     * @param layoutResId Layout id to be inflated
     * @param textViewId id of the {@link TextView} in the inflated view
     */
    public void setCustomTabView(int layoutResId, int textViewId) {
        mTabViewLayoutId = layoutResId;
        mTabViewTextViewId = textViewId;
    }

    /**
     * Sets the associated view pager. Note that the assumption here is that the pager content
     * (number of tabs and tab titles) does not change after this call has been made.
     */
    public void setViewPager(ViewPager viewPager) {
        mTabStrip.removeAllViews();

        mViewPager = viewPager;
        if (viewPager != null) {
            viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
                private int mScrollState;
                @Override
                public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                    int tabStripChildCount = mTabStrip.getChildCount();
                    if ((tabStripChildCount == 0) || (position < 0) || (position >= tabStripChildCount)) {
                        return;
                    }
                    mTabStrip.onViewPagerPageChanged(position, positionOffset);

                    View selectedTitle = mTabStrip.getChildAt(position);
                    int extraOffset = (selectedTitle != null)
                            ? (int) (positionOffset * selectedTitle.getWidth())
                            : 0;
                    scrollToTab(position, extraOffset);

                    if (mViewPagerPageChangeListener != null) {
                        mViewPagerPageChangeListener.onPageScrolled(position, positionOffset,
                                positionOffsetPixels);
                    }
                }

                @Override
                public void onPageSelected(int position) {
                    if (mScrollState == ViewPager.SCROLL_STATE_IDLE) {
                        mTabStrip.onViewPagerPageChanged(position, 0f);
                        scrollToTab(position, 0);
                    }
                    for (int i = 0; i < mTabStrip.getChildCount(); i++) {
                        mTabStrip.getChildAt(i).setSelected(position == i);
                    }
                    if (mViewPagerPageChangeListener != null) {
                        mViewPagerPageChangeListener.onPageSelected(position);
                    }
                }

                @Override
                public void onPageScrollStateChanged(int state) {
                    mScrollState = state;

                    if (mViewPagerPageChangeListener != null) {
                        mViewPagerPageChangeListener.onPageScrollStateChanged(state);
                    }
                }
            });;
            populateTabStrip();
        }
    }

    /**
     * Create a default view to be used for tabs. This is called if a custom tab view is not set via
     * {@link #setCustomTabView(int, int)}.
     */
    protected TextView createDefaultTabView(Context context) {
        TextView textView = new TextView(context);
        textView.setGravity(Gravity.CENTER);
        textView.setTextSize(TypedValue.COMPLEX_UNIT_SP, TAB_VIEW_TEXT_SIZE_SP);
        textView.setTypeface(Typeface.DEFAULT_BOLD);
        textView.setLayoutParams(new LinearLayout.LayoutParams(
                ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));

        TypedValue outValue = new TypedValue();
        getContext().getTheme().resolveAttribute(android.R.attr.selectableItemBackground,
                outValue, true);
        textView.setBackgroundResource(outValue.resourceId);
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.ICE_CREAM_SANDWICH) {
            textView.setAllCaps(true);
        }

        int padding = (int) (TAB_VIEW_PADDING_DIPS * getResources().getDisplayMetrics().density);
        textView.setPadding(padding, padding, padding, padding);

        return textView;
    }

    private void populateTabStrip()
    {
        final PagerAdapter adapter = mViewPager.getAdapter();

        final OnClickListener tabClickListener = new TabClickListener();

        for (int i = 0; i < adapter.getCount(); i++) {
            View tabView = null;
            TextView tabTitleView = null;

            if (mTabViewLayoutId != 0) {
                // If there is a custom tab view layout id set, try and inflate it
                tabView = LayoutInflater.from(getContext()).inflate(mTabViewLayoutId, mTabStrip,
                        false);
                tabTitleView = (TextView) tabView.findViewById(mTabViewTextViewId);
            }

            if (tabView == null) {
                tabView = createDefaultTabView(getContext());
            }

            if (tabTitleView == null && TextView.class.isInstance(tabView)) {
                tabTitleView = (TextView) tabView;
            }

            if (mDistributeEvenly) {
                LinearLayout.LayoutParams lp = (LinearLayout.LayoutParams) tabView.getLayoutParams();
                lp.width = 0;
                lp.weight = 1;
            }

            tabTitleView.setText(adapter.getPageTitle(i));
            tabView.setOnClickListener(tabClickListener);
            String desc = mContentDescriptions.get(i, null);
            if (desc != null) {
                tabView.setContentDescription(desc);
            }

            mTabStrip.addView(tabView);
            if (i == mViewPager.getCurrentItem()) {
                tabView.setSelected(true);
            }

            tabTitleView.setTextColor(getResources().getColorStateList(R.color.colorAccent));
            tabTitleView.setTextSize(14);
        }
    }

    public void setContentDescription(int i, String desc) {
        mContentDescriptions.put(i, desc);
    }

    @Override
    protected void onAttachedToWindow() {
        super.onAttachedToWindow();

        if (mViewPager != null) {
            scrollToTab(mViewPager.getCurrentItem(), 0);
        }
    }

    private void scrollToTab(int tabIndex, int positionOffset) {
        final int tabStripChildCount = mTabStrip.getChildCount();
        if (tabStripChildCount == 0 || tabIndex < 0 || tabIndex >= tabStripChildCount) {
            return;
        }

        View selectedChild = mTabStrip.getChildAt(tabIndex);
        if (selectedChild != null) {
            int targetScrollX = selectedChild.getLeft() + positionOffset;

            if (tabIndex > 0 || positionOffset > 0) {
                // If we're not at the first child and are mid-scroll, make sure we obey the offset
                targetScrollX -= mTitleOffset;
            }

            scrollTo(targetScrollX, 0);
        }
    }



    private class InternalViewPagerListener implements ViewPager.OnPageChangeListener {
        private int mScrollState;

        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
            int tabStripChildCount = mTabStrip.getChildCount();
            if ((tabStripChildCount == 0) || (position < 0) || (position >= tabStripChildCount)) {
                return;
            }

            mTabStrip.onViewPagerPageChanged(position, positionOffset);

            View selectedTitle = mTabStrip.getChildAt(position);
            int extraOffset = (selectedTitle != null)
                    ? (int) (positionOffset * selectedTitle.getWidth())
                    : 0;
            scrollToTab(position, extraOffset);

            if (mViewPagerPageChangeListener != null) {
                mViewPagerPageChangeListener.onPageScrolled(position, positionOffset,
                        positionOffsetPixels);
            }
        }

        @Override
        public void onPageScrollStateChanged(int state) {
            mScrollState = state;

            if (mViewPagerPageChangeListener != null) {
                mViewPagerPageChangeListener.onPageScrollStateChanged(state);
            }
        }

        @Override
        public void onPageSelected(int position) {
            if (mScrollState == ViewPager.SCROLL_STATE_IDLE) {
                mTabStrip.onViewPagerPageChanged(position, 0f);
                scrollToTab(position, 0);
            }
            for (int i = 0; i < mTabStrip.getChildCount(); i++) {
                mTabStrip.getChildAt(i).setSelected(position == i);
            }
            if (mViewPagerPageChangeListener != null) {
                mViewPagerPageChangeListener.onPageSelected(position);
            }
        }

    }

    private class TabClickListener implements OnClickListener {
        @Override
        public void onClick(View v) {
            for (int i = 0; i < mTabStrip.getChildCount(); i++) {
                if (v == mTabStrip.getChildAt(i)) {
                    mViewPager.setCurrentItem(i);
                    return;
                }
            }
        }
    }

}

MainActivity.java

public class MainActivityextends AppCompatActivity {

private ViewPager pager;
private ViewPagerAdapter adapter;
private SlidingTabLayout tabs;
private CharSequence Titles[]={"Tab_1","Tab_2"};
private int Numboftabs =2;

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

    // Creating The ViewPagerAdapter and Passing Fragment Manager, Titles fot the Tabs and Number Of Tabs.
    adapter =  new ViewPagerAdapter(getSupportFragmentManager(),Titles,Numboftabs);

    // Assigning ViewPager View and setting the adapter
    pager = (ViewPager) findViewById(R.id.pager);
    pager.setAdapter(adapter);

    // Assiging the Sliding Tab Layout View
    tabs = (SlidingTabLayout) findViewById(R.id.tabs);
    tabs.setDistributeEvenly(true); // To make the Tabs Fixed set this true, This makes the tabs Space Evenly in Available width

    // Setting Custom Color for the Scroll bar indicator of the Tab View
    tabs.setCustomTabColorizer(new SlidingTabLayout.TabColorizer() {
        @Override
        public int getIndicatorColor(int position) {
            return getResources().getColor(R.color.tabsScrollColor);
        }
    });

    // Setting the ViewPager For the SlidingTabsLayout
    tabs.setViewPager(pager);
}}

activity_main.xml中

  <LinearLayout 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"
    android:orientation="vertical"
    tools:context="com.AndroidApp.ActivityPackage.MainActivity">

     <com.AndroidApp.SlidingTab.SlidingTabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/tabColor"
        android:elevation="2dp" />

     <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_height="0dp"
        android:layout_width="match_parent"
        android:layout_weight="1" />
     </LinearLayout>

tab_1.xml

<?xml version="1.0" encoding="utf-8"?>
<ScrollView
    android:id="@+id/srlview"
    android:layout_height="match_parent"
    android:layout_width="match_parent">
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal"
        android:orientation="vertical"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingTop="@dimen/activity_vertical_margin">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">
            <EditText
                android:id="@+id/edt_empnum"
                android:inputType="number"
                android:layout_gravity="center"
                android:hint="Enter Employee Number"
                style="@style/spinner_style"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:padding="5dp" />

            <EditText
                android:id="@+id/edt_empname"
                style="@style/spinner_style"
                android:layout_gravity="center"
                android:hint="Enter Name"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:padding="5dp" />

            <EditText
                android:id="@+id/edt_empdob"
                android:inputType="date"
                style="@style/spinner_style"
                android:layout_gravity="center"
                android:hint="Enter Birthdate"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:padding="5dp" />
            <Spinner
                android:id="@+id/spinner_empType"
                android:layout_gravity="center"
                style="@style/spinner_style"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:padding="5dp"/>
            <EditText
                android:id="@+id/edt_empQuery"
                style="@style/spinner_style"
                android:inputType="textMultiLine"
                android:lines="3"
                android:minLines="3"
                android:maxLines="8"
                android:gravity="top|start"
                android:layout_height="wrap_content"
                android:layout_width="fill_parent"
                android:hint="Enter Query"
                android:scrollbars="vertical"
                android:layout_margin="5dp"
                android:padding="5dp"/>


            <EditText
                android:id="@+id/edt_empcontact"
                style="@style/spinner_style"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:layout_gravity="center"
                android:inputType="number"
                android:hint="Enter Contact Number"
                android:padding="5dp" />
            <EditText
                android:id="@+id/edt_empemailid"
                style="@style/spinner_style"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:layout_gravity="center"
                android:inputType="number"
                android:hint="Enter Email Id"
                android:padding="5dp" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:orientation="horizontal"
            android:layout_gravity="center_horizontal"
            android:padding="5dp"
            android:gravity="center">
            <Button android:id="@+id/btn__emp_postQuery"
                style="?android:textAppearanceSmall"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:text="SUBMIT"
                android:textStyle="bold"
                android:textColor="#FFFFFF"
                android:background="@color/colorPrimary"
                android:layout_marginRight="10dp" />
            <Button android:id="@+id/btn_corpempquery_emp_resetQuery"
                style="?android:textAppearanceSmall"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:text="RESET"
                android:textStyle="bold"
                android:textColor="#FFFFFF"
                android:background="@color/colorPrimary"
                android:layout_marginLeft="10dp" />
        </LinearLayout>
    </LinearLayout>
</ScrollView>

Tab_1.java

public class Tab_1 extends Fragment {

    private View rootView;
    public Tab_1()
    {

    }

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }

    @TargetApi(Build.VERSION_CODES.JELLY_BEAN)
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

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

        return rootView;
    }
}

Tab_2.java和tab_2.xml分别与Tab_1和tab_1完全相同。

请帮忙。谢谢。

0 个答案:

没有答案