Design a HorizontalScrollView inside of ViewPager or use fragments:(在 ViewPager 内设计一个 HorizontalScrollView 或使用片段:)
问题描述
我需要设计以下屏幕,我需要你的建议:
说明:
标题是静态的/固定的,我不需要对它做任何事情.
黄色:这是有趣的部分,我需要设计一个类似 ViewPager
的屏幕,它能够左右滚动最多 4 个屏幕.
红色:我需要在每个屏幕中添加一个表格/网格,如果它不适合屏幕大小,它也可以滚动.
绿色:可以使用屏幕底部的绿色按钮或滚动ViewPager
来完成页面切换.
问题是:这种行为可以使用 ViewPager
实现还是应该使用 Fragments
?如果 Fragment 是要走的路,那么我将如何使用滑动手势实现页面切换?如果是 ViewPager
那么如何添加内部滚动以及如何使用底部的按钮来控制它?
任何帮助将不胜感激,谢谢.
我认为这应该通过 Non Swipeable ViewPager
来解决.视图分页器 和 底层 Fragment
无法响应滑动手势.在 ViewPager
中覆盖以禁用滑动的方法是:
- .抱歉,我自己没有使用过.
I need to design the following screen, and I need your advice:
Explanation:
The title is static/fixed and I don't need to do anything with it.
Yellow: this is the interesting part, I need to design a
ViewPager
like screen that has the capability to scroll left/right for Max 4 screens.Red: In every screen I need to add a Table/Grid that can be scrollable as well if it's not fits screen size.
Green: The page switching can be done using the green buttons in the bottom of the screen or by scrolling the
ViewPager
.The Question Is: Can this behavior be achieve using a
ViewPager
or should I useFragments
? If Fragment is the way to go, then how would I implement the page switching using the sliding gesture? if it's aViewPager
then how to add the inside scrolling and how to control it using the buttons at the bottom?Any help would be appreciated, Thanks.
解决方案I think this should be tackled with a Non Swipeable
ViewPager
. There is no way the view pager and the underlyingFragment
s should respond to the swiping gesture. The methods to override to disable swiping within theViewPager
are:onTouchEvent()
- returnsfalse
.onInterceptTouchEvent()
- returnsfalse
.
Refer to this SO question for more information on how to achieve this.
Next up you want to be using
Fragment
s within each of your pager holders. So we're building the following layout:Within the parent activity a
FragmentPagerAdapter
is instantiated and your tabs added with a tag:Activity changes
@Override protected void onCreate(final Bundle saveInstanceState) { final FragmentPagerAdapter myTabAdapter = new MyFragmentPagerAdapter( <Your ViewPager View>, <Your activity context, this>); myTabAdapter.addTab(getActionBar().newTab(), "YOUR TAG", "Your Title"); // etc... }
So this gives us the frame of the diagram above. A hosting activity, containing a
ViewPager
and the underlying tabs. Next up is getting theFragment
s (containing your tables) into each of the respective tabs. This is handled by theFragmentPagerAdapter
implementation:Fragment adapter (inner class to activity):
private class MyFragmentPagerAdapter extends FragmentPagerAdapter implements ActionBar.TabListener, ViewPager.OnPageChangeListener { /** * Constructs a pager adapter to back a {@link ViewPager}. * * @param pager * The {@link ViewPager} widget. * @param activityContext * The context the widget is being added under. */ public SpotMenuFragmentPagerAdapter(final ViewPager pager, final Context activityContext) { super(getFragmentManager()); pager.setAdapter(this); this.context = activityContext; } /** * Adds a tab to the hosting activity action bar. * * @param newTab * The tab to add. * @param tag * The tab tag for id purposes. * @param label * The label of the tab displayed to the user. */ public void addTab(final ActionBar.Tab newTab, final String tag, final String label) { newTab.setTag(tag); newTab.setText(label); newTab.setTabListener(this); getSupportActionBar().addTab(newTab); } /** * This is where you do the work of building the correct fragment based * on the tab currently selected. * * @see FragmentPagerAdapter#getItem(int) */ @Override public Fragment getItem(final int position) { final Tab tab = getActionBar().getTabAt(position); if ("MY TAG".equals(tab.getTag().toString()) { // instantiate the fragment (table) for "MY TAG" } else { // instantiate something else... } } /** * One fragment per tab. * * @see android.support.v4.view.PagerAdapter#getCount() */ @Override public int getCount() { return getSupportActionBar().getTabCount(); } /** * @see ViewPager.OnPageChangeListener#onPageScrollStateChanged(int) */ @Override public void onPageScrollStateChanged(final int arg0) { // No-op. } /** * @see ViewPager.OnPageChangeListener#onPageScrolled(int, float, int) */ @Override public void onPageScrolled(final int arg0, final float arg1, final int arg2) { // No-op. } /** * @see ViewPager.OnPageChangeListener#onPageSelected(int) */ @Override public void onPageSelected(final int position) { getSupportActionBar().setSelectedNavigationItem(position); } /** * @see TabListener#onTabSelected(app.ActionBar.Tab, * app.FragmentTransaction) */ @Override public void onTabSelected(final Tab tab, final FragmentTransaction ft) { viewPager.setCurrentItem(tab.getPosition()); } /** * @see TabListener#onTabUnselected(ActionBar.Tab, * app.FragmentTransaction) */ @Override public void onTabUnselected(final Tab tab, final FragmentTransaction ft) { // No-op. } /** * @see TabListener#onTabReselected(ActionBar.Tab,app.FragmentTransaction) */ @Override public void onTabReselected(final Tab tab, final FragmentTransaction ft) { // No-op. } }
So hopefully by this point we have an activity hosting a 'non-swipeable' view pager and a mechanism for switching tabs in the form of the tab bar underneath the title (or alongside depending on the screen size). From this point I am sure you could customise to replace the tab bar with some navigational arrows.
Note: A lot of that was written from memory but hopefully I've conveyed the gist of where I would go with this.
Update
In response to the updated question: you can set the tab to be any old view. Set the TabSpec accordingly. Apologies I haven't used this myself.
这篇关于在 ViewPager 内设计一个 HorizontalScrollView 或使用片段:的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:在 ViewPager 内设计一个 HorizontalScrollView 或使用片段:
基础教程推荐
- 当从同一个组件调用时,两个 IBAction 触发的顺序是什么? 2022-01-01
- android 应用程序已发布,但在 google play 中找不到 2022-01-01
- 如何在没有IB的情况下将2个按钮添加到右侧的UINavigationbar? 2022-01-01
- UIWebView 委托方法 shouldStartLoadWithRequest:在 WKWebView 中等效? 2022-01-01
- 如何在 UIImageView 中异步加载图像? 2022-01-01
- Kivy Buildozer 无法构建 apk,命令失败:./distribute.sh -m “kivy"d 2022-01-01
- Android:对话框关闭而不调用关闭 2022-01-01
- 如何在 iPhone 上显示来自 API 的 HTML 文本? 2022-01-01
- 如何让对象对 Cocos2D 中的触摸做出反应? 2022-01-01
- 在 gmail 中为 ios 应用程序检索朋友的朋友 2022-01-01