7

我有一个 GridView,每行有 3 个元素,当我单击一个项目时,行下方会出现一个新视图。它有点像 iOS 上的文件夹应用程序。我没有在 SO 或 Google 上找到任何答案。也许你可以给我一些提示。

在此处输入图像描述

4

3 回答 3

5

您可以使用GridLayout但不能轻松地做到这一点GridView

要在放置项目并设置列数之前找出网格的可用宽度,请设置 a ViewTreeObserver.OnGlobalLayoutListener(然后可以放置项目)或扩展 GridLayout 并覆盖onMeasure (int widthMeasureSpec, int heightMeasureSpec)

在每行内容后插入一行,并将其可见性Visibility.GONE设置columnSpecGridLayout. 当用户点击一个项目时,您可以获得它的信息,填充它下面的视图并展开或动画它的可见性切换。

最后,对于指示器,我只需将其添加为隐藏行的子项,当用户点击该项目时,计算所述项目的水平中心并将该视图的中心准确地放置在 X 轴上的该坐标上(边距将可以的)。

请注意,对于非常大的项目列表,不建议这样做,因为您必须实例化每个项目以立即显示,无论它们是否都适合屏幕。不像GridViewGridLayout不是孩子的AbsListView

于 2013-07-12T13:52:59.513 回答
0

虽然很明显这里没有原生组件来完成你想要做的事情,但是有几种方法可以通过结合其他方法来获得你想要的效果。

我能想到的一种方法是创建您自己的适配器并添加功能以在单击的行下方插入另外 3 个元素并标记为某种枚举,这样您就可以将其与常规视图区分开来,当然是在适配器的 getView 方法中,您必须进行验证才能知道要膨胀并返回哪个视图,刷新视图后,这 3 个元素将插入到单击的元素下方,当然您可以通过修改适配器显示的列表来摆脱它们。(这种方法需要对自定义适配器有很好的了解,我已经做过类似的事情,并且是一种干净而好的方法)。

解决此问题的另一种方法不如第一种方法好,但绝对可以解决问题,方法是创建一种您想要获得的效果的“模板”(就像您拥有的图片中的那个),保持该模板作为网格视图顶部活动的一部分不可见,一旦有人点击元素,根据您要显示的信息填充模板,使网格不可见并使“模板”在网格顶部可见,如果您要显示的信息已正确填充,用户不会注意到更改,当您想返回网格视图时,只需删除此“模板”视图,它就会产生网格的效果原来的样子。

希望这可以帮助。

问候!

于 2013-07-10T17:35:43.087 回答
0

我使用 TableLayout.addView 添加一个 ImageView,它可能需要另一个变量来删除视图,目前我只是删除它并在单击按钮时添加另一个变量。

我通过他们的位置更改 imageView,您可以根据该位置更改背景,以便用户认为它与他们单击的那个相关

ImageView imag; 
boolean imageOn = false;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    imag = new ImageView(this); 
    final TableLayout table = (TableLayout) findViewById( R.id.tableLayoutCategoryButtons );
    int buttonsInRow = 3;
    String[] itemNames = getResources().getStringArray(R.array.categories_array);

    int numRows=(itemNames.length/buttonsInRow);
    if (itemNames.length%buttonsInRow!=0)
        numRows++;

    Button[] buttons = new Button[itemNames.length];
    LinearLayout[] tablerowLayout = new LinearLayout[numRows];
    tablerowLayout[0] = new LinearLayout(table.getContext());
    int rowcount=0;
    for (int i=0; i<itemNames.length; i++){
        buttons[i]= new Button(table.getContext(), null, android.R.attr.buttonStyleSmall);
        buttons[i].setText(itemNames[i]);
        buttons[i].setId(i);
        buttons[i].setTextColor(Color.BLACK);
        buttons[i].setVisibility(View.VISIBLE);
        buttons[i].setOnClickListener(new OnClickListener(){

            @Override
            public void onClick(View v) {
                if(imageOn){
                    table.removeView(imag);
                    imageOn = false;
                }
                int index = v.getId()/buttonsInRow+1;
                if(v.getId()%buttonsInRow==1)
                    imag.setImageResource(R.drawable.reta);
                else if(v.getId()%buttonsInRow==2)
                    imag.setImageResource(R.drawable.reta2);
                else
                    imag.setImageResource(R.drawable.reta3);

                imageOn = true;
                table.addView(imag, index);

            }});

        LinearLayout.LayoutParams buttonLayoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
        tablerowLayout[rowcount].addView(buttons[i], buttonLayoutParams);

        if (((i+1)%buttonsInRow==0)&&(i!=0)){

            table.addView(tablerowLayout[rowcount++]);
            if(rowcount<numRows)
                tablerowLayout[rowcount] = new LinearLayout(table.getContext());
        }
    }
    if(rowcount<numRows)
        table.addView(tablerowLayout[rowcount]);

基于代码的模拟

于 2013-07-11T02:16:39.543 回答