自定义微调器/下拉菜单 [英] Custom Spinners/drop down menu

问题描述

在 Astrid Tasks 应用程序中，有一个按钮.当您按下按钮时，会出现一个下拉菜单.

In the app Astrid Tasks, there is a button. When you press the button, a drop down menu comes up.

它基本上是一个微调器，但采用下拉列表形式.

It's basically a spinner but in a drop-down-list form.

有谁知道如何做类似的事情?这是我没有看到的小部件吗?

Does anyone know how to do something similar? Is this a widget I just don't see?

推荐答案

作为本文的原作者(我是 Astrid 的主要 Android 开发人员之一)，我很乐意分享 Astrid 如何做到这一点.我将在这里发布基础知识，但您可以在我们的 github 存储库中找到更多详细信息(https://github.com/todoroo/astrid).基本思想是按照 hanry 的建议扩展 GreenDroid 的 QuickActionWidget.子类看起来像:

As the original author of this (I'm one of the primary Android developers for Astrid) I'd be happy to share how Astrid does it. I'll post the basics here, but you can find more details at our github repo (https://github.com/todoroo/astrid). The basic idea is to extend GreenDroid's QuickActionWidget as hanry suggests. The subclass looks something like:

public class MenuPopover extends QuickActionWidget {

    protected DisplayMetrics metrics;
    protected LinearLayout content;

    public MenuPopover(Context context) {
        super(context);
        setContentView(R.layout.my_layout);

        content = (LinearLayout) getContentView().findViewById(R.id.content);
        metrics = context.getResources().getDisplayMetrics();

        setFocusable(true);
        setTouchable(true);
    }

    @Override
    protected void populateQuickActions(List<QuickAction> quickActions) {
        // Do nothing
    }

    @Override
    protected void onMeasureAndLayout(Rect anchorRect, View contentView) {
        contentView.setLayoutParams(new     FrameLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,     ViewGroup.LayoutParams.WRAP_CONTENT));
        contentView.measure(MeasureSpec.makeMeasureSpec(getScreenWidth(),     MeasureSpec.EXACTLY),
                ViewGroup.LayoutParams.WRAP_CONTENT);

        int rootHeight = contentView.getMeasuredHeight();

        int offsetY = getArrowOffsetY();
        int dyTop = anchorRect.top;
        int dyBottom = getScreenHeight() - anchorRect.bottom;

        boolean onTop = (dyTop > dyBottom);
        int popupY = (onTop) ? anchorRect.top - rootHeight + offsetY : anchorRect.bottom -  offsetY;

        setWidgetSpecs(popupY, onTop);
    }
}

布局文件 my_layout.xml 非常简单:

The layout file my_layout.xml is pretty simple:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="10dip">

        <LinearLayout
                android:id="@+id/content"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/gdi_arrow_up"
                android:orientation="vertical"/>

        <ImageView
            android:id="@+id/gdi_arrow_up"
            android:layout_width="27dip"
            android:layout_height="27dip"
            android:layout_marginLeft="-10dip"
            android:scaleType="fitCenter"
            android:layout_marginBottom="-8dip"
            android:src="?attr/asListArrowUp" />

        <ImageView
            android:id="@+id/gdi_arrow_down"
            android:layout_width="27dip"
            android:layout_height="27dip"
            android:scaleType="fitCenter"
            android:layout_marginBottom="-8dip"
            android:layout_below="@android:id/list"/>

        </RelativeLayout>
</FrameLayout>

然后，您可以向 popover 类添加一个简单的辅助方法，以将视图(即行，带有可选侦听器)添加到 popover 的主体:

Then, you can just add a simple helper method to the popover class to add views (i.e. rows, with optional listeners) to the main body of the popover:

public void addViewToContent(View v, OnClickListener listener) {
    content.addView(v);
    if (listener != null) {
        v.setOnClickListener(listener);
    }
}

创建弹出窗口的实例后，您可以通过调用来显示它

After creating an instance of the popup, you can show it by calling

menuPopover.show(anchorView);

这是一个稍微简化的版本——在实践中，我们将一些附加信息、侦听器等附加到这些视图中，以使它们在被点击时实际执行操作.如果您愿意，可以在 https://github.com/todoroo/astrid 查看完整代码-- 类是 com.todoroo.astrid.ui.MainMenuPopover.

This is a somewhat simplified version -- in practice, we attach some addition information, listeners, etc. to those views to make them actually do things when clicked. If you want, you can check out the full code at https://github.com/todoroo/astrid -- the class is com.todoroo.astrid.ui.MainMenuPopover.

感谢您使用 Astrid！

Thanks for using Astrid!

这篇关于自定义微调器/下拉菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！