Android - 手风琴小工具

Question

我正在寻找创建Accordion风格小部件的最佳方式,例如在此页面上.有没有办法使用标准的Android工具包实现相同的效果,还是我需要构建自定义小部件？如果是的话 - 如果有的话,你会推荐哪一个？

Answer 1

如果你仍然想知道 - 这可以通过堆叠在线性布局内的按钮/布局来完成.伪代码如下

<LinearLayout android:orientation="vertical">
    <Button android:text="Panel 1"/>
    <SomeKindOfLayout android:id="@+id/panel1">
            <!-- widgets in first panel go here -->
    </SomeKindOfLayout>
    <Button android:text="Panel 2"/>
    <SomeKindOfLayout android:id="@+id/panel2" android:visibility="gone">
            <!-- widgets in second panel go here -->
    </SomeKindOfLayout>
    <Button android:text="Panel 3"/>
    <SomeKindOfLayout android:id="@+id/panel3" android:visibility="gone">
            <!-- widgets in third panel go here -->
    </SomeKindOfLayout>
    <Button android:text="Panel 4"/>
    <SomeKindOfLayout android:id="@+id/panel4" android:visibility="gone">
            <!-- widgets in fourth panel go here -->
    </SomeKindOfLayout></LinearLayout>

可能尝试的另一件事是将ExpandableListView-s堆叠在一起

Answer 2

我已经在github 推动了android手风琴视图项目.我们将它用于我们的客户,在2.2,2.3.x,3.2和4.0.3上进行测试.对我们来说效果很好.

在下一步中将在fold /展开时添加动画.

这是一个小截图:

Answer 3

我不得不冒着风险说@Bostone 的答案是最合适的。我将在下面给您我的代码，以便您可以看到。感谢 GitHub Maciej ?opaci?ski，但正如@SudoPlz 在评论中所说，根本没有文档。我不知道从哪里开始。我尝试使用 Eclipse 和 Android Studio 来做这件事，但在这两种情况下我都无法运行该项目来开始弄清楚它是如何工作的。此外，该项目的最后一次提交大约是 1 年前，这让我非常担心如果出现问题，我会陷入死胡同。因此，事不宜迟，这是我基于@Bostone 的解决方案：

1.- 首先，您必须创建一个 Button 和一个嵌套在 ScrollView 中的布局：

    <ScrollView 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"
        tools:context=".TasksListActivity">


            <Button
                android:id="@+id/magic_btn"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="Magic Btn"/>
            <LinearLayout
                android:id="@+id/magic_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:visibility="gone">

        </LinearLayout>
</ScrollView>

2.- 之后去你对应的JAVA，找到按钮并设置一个onClickListener，在onClickListener里面你会找到布局。

Button findMagicBtn = (Button) findViewById(R.id.magic_btn);
        findMagicBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

            }
        });

3.- 所以现在在 onClickListener 中我们会找到布局。正如您在第一步中看到的，布局默认设置为GONE，但现在我们必须将其设置为可见。问题是，我怎样才能让它再次消失，反之亦然？因此，我们将添加一个条件来获取布局的可见性，并基于此条件将其隐藏或显示：

Button findMagicBtn = (Button) findViewById(R.id.magic_btn);
        findMagicBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                LinearLayout findMagicLl = (LinearLayout) findViewById(R.id.magic_layout);
                if (findMagicLl.getVisibility() == View.VISIBLE) {
                    findMagicLl.setVisibility(View.GONE);
                } else {
                    findMagicLl.setVisibility(View.VISIBLE);
                }
            }
        });

这可以根据需要多次重叠。

所以现在如果你真的想让它看起来像手风琴，你可以拉皮条按钮。您可以在其右侧放置一个箭头，例如：

findMagicBtn.setCompoundDrawablesWithIntrinsicBounds(0, 0, R.drawable.right_arrow, 0);

您应该在 onClickListener 中执行此操作，并使用条件通过更改可绘制对象（如果消失和向下箭头，如果可见则向上箭头）来更改箭头的方向。

此外，您可以通过添加动画使其看起来更自然，如下所示：

ScaleAnimation animation = new ScaleAnimation(1f, 1f, 1f, 0f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f);
animation.setDuration(180);
animation.setFillAfter(true);
findMagicLl.startAnimation(animation);

您将不得不考虑必须在视图可见时完成上述动画。请注意，setFillAfter(true), 将永久更改容器的大小，因此如果您这样做，您可能不想再使用VIEW.GONE了。这个问题对比例动画有一个很好的解释