5

在他们最新版本的应用程序中,谷歌实现了一种非常酷的方式来在标签之间滑动而不是点击标签标题。我想知道是否有人对如何做到这一点有更具体的想法。

以下是一些想法 - 随时批评:

我最初的想法是,这不是TabActivity托管子活动的标准。事实上,我什至不认为这是一种习俗ActivityGroup。滑动时选项卡行滚动,但不会导致活动选项卡切换。

滑动选项卡的主要内容表现出有趣的行为。我怀疑有一个 GestureListener 附加到主要内容区域。随着选项卡的滑动,来自相邻选项卡的行变得可见。这似乎表明这是一个水平可滚动的ListViews 组。它几乎就像一个水平滚动的 HTML div,所有内容都已经存在,但在滑动时会出现。我不太确定如何处理行的渲染(传统上,在向上/向下滚动列表而不是向左/向右滚动列表时会构建和显示行)。所以也许它也是一个自定义ListView实现?当不左右滚动时,它的行为与您期望的常规一样ListView,包括快速滚动和下拉时的发光效果。

选项卡的行可能是ScrollView,正如滑动到边缘时的发光效果所证明的那样。选项卡内容的行不是。

我正在尝试为组成这个非常漂亮的 UI 的不同部分构建一个心理模型。非常感谢任何见解。

4

6 回答 6

2

最有价值的信息来源如何完美地做到这一点是来自IO 2011 应用程序的来源

查看 ScheduleFragment 和 Workspace 类。

谢谢。

于 2011-07-04T09:26:57.833 回答
1

这与主屏幕具有相同的隐喻:多个页面,您可以水平滑动,每个屏幕都做它该做的事情。它具有“锁定”行为(如果您滑动得足够多,它会跳转到新标签,但如果您滑动得不够远,它会弹回已经可见的屏幕),除了底部的小点主屏幕它使用选项卡作为您所在页面的指示符。

正如你所说,标签不会滚动。此外,在滑动过程中您实际上不能垂直滚动,因此它本质上是一个类似于您可以在此处找到的简单实现。我想多点触控可以让它垂直滚动,但这真的很奇怪,而且在很大程度上是不必要的:看起来很酷,但实用性有限。除了成为标准 s 之外,ListViews 不需要做任何事情ListView。顶部可能有一个自定义的基于 Button 的选项卡小部件,并且基于滚动更新 Button 样式以突出显示右侧的选项卡。就是这样。

于 2011-06-15T07:14:30.397 回答
1

Youtube 应用程序的布局是这样的:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout ...>
    ...
    <TabRow android:id="@id/tabrow" .../>
    <Workspace android:id="@id/workspace" ...>
        <ListView android:id="@id/uploads" ... />
        <ListView android:id="@id/favorites" ... />
        <ListView android:id="@id/playlists" ... />
        <ListView android:id="@id/subscriptions" ... />
    </Workspace>
</LinearLayout>

Google 引入了 2 个同样用于音乐应用的小部件:

  • com.google.android.youtube.ui.TabRow。

    TabRow 扩展 Horizo​​ntalScrollView

  • com.google.android.youtube.ui.Workspace

    工作区扩展了 ViewGroup

关于实施,任何人都可以使用“正确的工具”进行查看。但这会给出一些粗略的代码,而且可能是不正确的。我试了一下,运气不太好。Someboby 有动力并具有 goog 技能,我认为可以做到这一点。

其他解决方案和更好的解决方案:我只希望 Google 尽快发布这些类的库或代码。这块 GUI 使用起来真的很愉快。

于 2011-07-30T08:48:27.863 回答
1

您可以将选项卡放在空框架内。

将 a 附加GestureDetector.SimpleOnGestureDetector到该框架,并覆盖该onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY)方法。

在您希望标签实际更改之前,您可以决定需要多强的弹力。e1通过使用和之间的累积距离e2

请记住在您的或触摸事件上返回falseonFling不会落到下面的视图中。

于 2011-07-30T08:54:25.397 回答
0

我相信我已经找到了您正在寻找的解决方案。这些选项卡实际上位于应用程序的操作栏中:

http://developer.android.com/guide/topics/ui/actionbar.html#Tabs

此外,Android for Programmers - An App-Driven Approach (ISBN 0132121360) 第 14 章完美地关注了此操作栏选项卡系统。

于 2012-02-26T21:16:00.903 回答
0

我认为您指的是Workspace-Pattern。不幸的是,谷歌并没有把它作为标准,所以你必须自己实现它。

为此,您应该使用ViewPagerFragmentPagerAdapter编程示例)。

于 2012-03-17T00:40:39.407 回答