水平滚动网格视图

Question

我知道在Android中不可能水平滚动网格视图。但是我正在像这样动态添加图像按钮到水平滚动视图中：

public class HorizontalScroller extends Activity {
    static int l=0;
     private Rect mTempRect = new Rect();

    static int r1=0;
    static int t=0;
    static int b=0;
    static int x=0;
    static int y=0;
 //Button[]  b1 = new Button[100];
    ImageButton btn[][] = new ImageButton[10][10];

 //ImageButton b1 = new ImageButton(this);
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        LinearLayout rl = (LinearLayout)findViewById(R.id.widget92);

        LinearLayout.LayoutParams params1 = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);

        for(int i=0;i<4;i++)
        {
            for(int j=0;j<10;j++)
            {System.out.println("helo");
        /*      l=l+100;
                r1=r1+100;
                t=t+100;
                b=b+100;*/
            //button();
       //ImageButton btn=new ImageButton(this);
   /*    Rect r = mTempRect;
           r.left=10;
           r.top=10;
           r.right=10;
           r.bottom=10;
       btn[i][j].getDrawingRect(r);*/

            //btn[i][j].setId(j);

              Rect r = mTempRect;
              r.set(0,0,0,0);
              Rect r2 = mTempRect;
              r2.set(0,20,0,20);

                btn[i][j]=new ImageButton(this);
                btn[i][j]. setBackgroundResource(R.drawable.icon);
                btn[i][j].setMinimumWidth(20);
                btn[i][j].setMinimumHeight(20);
                params1.setMargins(5, 5, 5,5); 
                rl.addView(btn[i][j],params1); 

               System.out.println("1="+btn[i][j].getTop());
               System.out.println("2="+btn[i][j].getLeft());
               System.out.println("3="+btn[i][j].getRight());
               System.out.println("4="+btn[i][j].getBottom());
            }
        }
    }
}

但是我把所有图像按钮都放在一行了。我该如何实现它们的网格结构？

- Piyush

Answer 1

实现水平滚动的GridView需要将一些Android源代码类（AdapterView、AbsListView、GridView、ScrollBarDrawable）复制到您的代码库中，并添加处理水平代码的代码。这主要涉及复制一些代码并将顶部更改为左侧，底部更改为右侧等。之所以不是通过继承来实现，是因为这些类的最终性质。

我曾经实现了一个水平滚动的GridView，最近终于把它推送到了Github上： https://github.com/jess-anders/two-way-gridview

- Jess Anders

---

非常酷，但图像质量很差。我有什么办法可以解决它...非常感谢... :) - ram

图像质量取决于放入网格视图中的图像本身，而网格视图不会改变其质量。 - Jess Anders

这是正确的做法。点赞。 - AngraX

非常好用，有没有办法同时使用水平和垂直滚动？我需要将其用作可以在两个方向上滚动的大型图像网格。 - Asaf

不好意思，它不是为此而构建的。 - Jess Anders

Answer 2

你可以

• 在HorizontalScrollView内使用TableLayout，或者
• 保持你的水平LinearLayout方法，但是添加垂直的LinearLayout，而不是直接添加图片。例如，在纵向上每个垂直的LinearLayout中添加三到四张图片，在横向上仅添加两张图片。

我建议先尝试使用TableLayout方法。

PS1：下次请尝试删除所有非相关代码（代码越少，理解所做的事情就越容易）。

PS2：请记住，System.out通常会重定向到/dev/null并因此丢失，所以我强烈建议您使用Log.d代替。

完整示例

将其适应于onCreate()方法或任何需要它的地方：

public void horizontalScrollGalleryLayout () {
    HorizontalScrollView sv = new HorizontalScrollView(this);
    LinearLayout llh = new LinearLayout(this);
    llh.setOrientation(LinearLayout.HORIZONTAL);
    LinearLayout.LayoutParams layoutParamsTV = new LinearLayout.LayoutParams(40, 40);
    LinearLayout.LayoutParams layoutParamsLL = new LinearLayout.LayoutParams(
            LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
    for (int i=0; i<20; i++) {
        LinearLayout llv = new LinearLayout(this);
        llv.setOrientation(LinearLayout.VERTICAL);
        TestView testView1 = new TestView(this, Color.rgb(i*12, 0, 0));
        TestView testView2 = new TestView(this, true, Color.rgb(i*12, i*12, 0));
        TestView testView3 = new TestView(this, true, Color.rgb(0, i*12, 0));
        llv.addView(testView1, layoutParamsTV);
        llv.addView(testView2, layoutParamsTV);
        llv.addView(testView3, layoutParamsTV);
        llh.addView(llv, layoutParamsLL);
    }
    sv.addView(llh, layoutParamsLL);
    setContentView(sv);
}

我将使用一个非常简单的View作为示例：

public class TestView extends View {
Context context;
int color;

public TestView(Context context, int color) {
    super(context);
    this.context = context;
    this.color = color;
}

@Override
public void onDraw (Canvas canvas) {
    super.onDraw(canvas);
    this.setBackgroundColor(Color.LTGRAY);
    Paint paint = new Paint (Paint.ANTI_ALIAS_FLAG);
    paint.setColor(color);
    canvas.drawCircle(20, 20, 20, paint);
}
}

- Aleadam

---

一个带有水平滚动条的单行。 - Piyush

谢谢，伙计，这真的很有帮助...非常感谢。 - Piyush

好的。请考虑将答案标记为已接受。如果您觉得它非常有帮助，也可以点赞。我在您的个人资料中看到您还没有投票。干杯 :) - Aleadam

我明白了，现在可以设置图像了。但是有没有可能在位图图像上设置点击事件？ - Piyush

使用此方法时要谨慎。布局不处理视图的回收。如果将太多项放入布局中，则可能会遇到内存错误。相反，你应该寻找一个正确实现的水平列表/网格视图（使用适配器类）。 - AngraX

Answer 3

有一个非常简单的技巧。

1. 将网格视图旋转270度，并将列数设置为2。
2. 将每个项目旋转90度（以使项目显示为原始方向）。

这对某些人可能会很有用！！

- abhi

---

我已经为ListView做了同样的事情（列表旋转-90度，项目90度）。效果很棒。感谢您的想法！ - resource8218

如果我将其旋转-90度，一半的元素就会丢失 :/ - David

@David 你可以改变行/列的数量，以使所有元素可见。 你可以展示你的代码，也许我/其他人可以帮忙！ :) - abhi

Answer 4

I have done this way:

activity_main.xml:

<HorizontalScrollView
   android:layout_width="match_parent"
   android:layout_height="wrap_content">

      <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:orientation="horizontal">

          <GridView
             android:id="@+id/gridView"
             android:layout_width="match_parent"
             android:layout_height="wrap_content">
          </GridView>

      </LinearLayout>

</HorizontalScrollView>

MainActivity.java:

GridView gridView = (GridView) findViewById(R.id.gridView);

gridView.setNumColumns(arrayList.size());

GridViewAdapter gridViewAdapter = new GridViewAdapter(mContext, arrayList);
gridView.setAdapter(gridViewAdapter); 

// Set dynamic width of Gridview
setDynamicWidth(gridView);

添加以下方法：

private void setDynamicWidth(GridView gridView) {
        ListAdapter gridViewAdapter = gridView.getAdapter();
        if (gridViewAdapter == null) {
            return;
        }
        int totalWidth;
        int items = gridViewAdapter.getCount();
        View listItem = gridViewAdapter.getView(0, null, gridView);
        listItem.measure(0, 0);
        totalWidth = listItem.getMeasuredWidth();
        totalWidth = totalWidth*items;
        ViewGroup.LayoutParams params = gridView.getLayoutParams();
        params.width = totalWidth;
        gridView.setLayoutParams(params);
 }

希望这能对您有所帮助。

- Hiren Patel

---

谢谢，真的帮了我很多！顺便说一下，我需要将LinearLayout的layout_width更改为wrap_content，并且在setDynamicWidth()中，getMeasuredWidth()给出了错误的结果，所以我只是在这个方法中使用硬编码值来设置一个项目的宽度。 - Anton Malmygin

Answer 5

我已经在这里回答过了，但两个问题是相同的...

---

现在 Android 有一个不错的解决方案：HorizontalGridView。

1. Gradle依赖

dependencies {
    compile 'com.android.support:leanback-v17:23.1.0'
}

2. 将其添加到您的布局中

your_activity.xml

<!-- your stuff before... -->
        <android.support.v17.leanback.widget.HorizontalGridView
            android:layout_width="wrap_content"
            android:layout_height="80dp"
            android:id="@+id/gridView"
            />
<!-- your stuff after... -->

---

3. 布局网格元素

为您的网格元素（grid_element.xml）创建一个布局。我已经创建了一个只包含一个按钮的简单布局。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button" />
</LinearLayout>

---

4. 创建适配器

灵感来自于这个链接：https://gist.github.com/gabrielemariotti/4c189fb1124df4556058

public class GridElementAdapter extends RecyclerView.Adapter<GridElementAdapter.SimpleViewHolder>{

    private Context context;
    private List<String> elements;

    public GridElementAdapter(Context context){
        this.context = context;
        this.elements = new ArrayList<String>();
        // Fill dummy list
        for(int i = 0; i < 40 ; i++){
            this.elements.add(i, "Position : " + i);
        }
    }

    public static class SimpleViewHolder extends RecyclerView.ViewHolder {
        public final Button button;

        public SimpleViewHolder(View view) {
            super(view);
            button = (Button) view.findViewById(R.id.button);
        }
    }

    @Override
    public SimpleViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        final View view = LayoutInflater.from(this.context).inflate(R.layout.grid_element, parent, false);
        return new SimpleViewHolder(view);
    }

    @Override
    public void onBindViewHolder(SimpleViewHolder holder, final int position) {
        holder.button.setText(elements.get(position));
        holder.button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(context, "Position =" + position, Toast.LENGTH_SHORT).show();
            }
        });
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public int getItemCount() {
        return this.elements.size();
    }
}

5. 在您的活动中进行初始化：

private HorizontalGridView horizontalGridView;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.your_activity);
    horizontalGridView = (HorizontalGridView) findViewById(R.id.gridView);
    GridElementAdapter adapter = new GridElementAdapter(this);

    horizontalGridView.setAdapter(adapter);
}

- kmas

---

请注意，这需要API级别17+。 - Tommie

Answer 6

使用RecyclerView，将其GridLayout设置为布局管理器，并将其设置为水平滚动。

your recycle view.setLayoutManager(new GridLayoutManager(getActivity(),2, LinearLayoutManager.HORIZONTAL, false))

这里的2是网格的列跨度

- charan ghumman