同时具有水平和垂直滚动条的 Android GridView

Posted

技术标签:

【中文标题】同时具有水平和垂直滚动条的 Android GridView【英文标题】:Android GridView with Both Horizontal and Vertical Scrolbars at the same time 【发布时间】:2013-04-24 08:35:36 【问题描述】:

我是 android 新手,必须将 Windows Mobile 应用程序移植到 Android 应用程序。

问题: 我需要 Android 中的 GridView,类似于 .net GridView,它能够同时在水平和垂直方向上滚动。

因为我的数据中有很多行和很多列。因此,由于移动设备上的屏幕宽度很小,因此不会显示所有列。启用垂直滚动时显示多行。我想要的是这个 GridView 以某种方式可以同时在两个方向上滚动。这样用户就可以以表格形式查看数据。

我在 TableLayout 和 SimpleAdapter 的帮助下在 Android 中使用 GridView。以下是我的代码:

主要活动布局:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_
    android:layout_
    android:orientation="vertical" >

<!-- This Table Layout is header followed by the gridview -->
<TableLayout
    android:layout_
    android:layout_
    android:layout_marginLeft="5dp" >

    <TableRow android:layout_ >

        <TextView
            android:id="@+id/schemeTitle"
            android:layout_
            android:layout_
            android:text="Scheme"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/nameTitle"
            android:layout_
            android:layout_
            android:text="Name"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/productTitle"
            android:layout_
            android:layout_
            android:text="Product"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/channelTitle"
            android:layout_
            android:layout_
            android:text="Channel"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/typeTitle"
            android:layout_
            android:layout_
            android:text="Type"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/customerSelectionTitle"
            android:layout_
            android:layout_
            android:text="Customer Selection"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/brandTitle"
            android:layout_
            android:layout_
            android:text="Brand"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/wsTitle"
            android:layout_
            android:layout_
            android:text="W/S"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/startDateTitle"
            android:layout_
            android:layout_
            android:text="Start Date"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/endDateTitle"
            android:layout_
            android:layout_
            android:text="End Date"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/codeTitle"
            android:layout_
            android:layout_
            android:text="Code"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/tsidTitle"
            android:layout_
            android:layout_
            android:text="TSID"
            android:textStyle="bold" />
    </TableRow>
</TableLayout>

<GridView
    android:id="@+id/schemeGridView"
    android:layout_
    android:layout_
    android:clickable="true"
    android:numColumns="1"
    android:columnWidth="900dp" >
</GridView>

</LinearLayout>

网格布局:

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_
    android:layout_ >

<TableRow android:layout_ >

    <TextView
        android:id="@+id/scheme"
        android:layout_
        android:layout_ />

    <TextView
        android:id="@+id/name"
        android:layout_
        android:layout_ />

    <TextView
        android:id="@+id/product"
        android:layout_
        android:layout_ />

    <TextView
        android:id="@+id/channel"
        android:layout_
        android:layout_ />

    <TextView
        android:id="@+id/type"
        android:layout_
        android:layout_ />

    <TextView
        android:id="@+id/customerSelection"
        android:layout_
        android:layout_ />

    <TextView
        android:id="@+id/brand"
        android:layout_
        android:layout_ />

    <TextView
        android:id="@+id/ws"
        android:layout_
        android:layout_ />

    <TextView
        android:id="@+id/startDate"
        android:layout_
        android:layout_ />

    <TextView
        android:id="@+id/endDate"
        android:layout_
        android:layout_ />

    <TextView
        android:id="@+id/code"
        android:layout_
        android:layout_ />

    <TextView
        android:id="@+id/tsid"
        android:layout_
        android:layout_ />
</TableRow>

</TableLayout>

源代码:

public class Schemes extends BaseMainActivity 

private String obID = "";
private String obName = "";
ArrayList<HashMap<String, Object>> dtSchemes = null;
GridView schemeGridView = null;
Activity thisAct = this;

@Override
protected void onCreate(Bundle savedInstanceState) 
    super.onCreate(savedInstanceState);
    setContentView(R.layout.schemes);

    ProgressDialog d = ProgressDialog.show(this, "Inventory",
            "Loading Inventory...");

    OrderBookingDAL dl = new OrderBookingDAL();
    obID = dl.getConfigValue("OBID");
    obName = dl.getConfigValue("OBName");
    dtSchemes = dl.getHHTSchemes(obID, obName, dtSchemes);

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

    SimpleAdapter sa = new SimpleAdapter(this, dtSchemes,
            R.layout.schemes_grid, new String[]  "Scheme", "Name",
                    "Product", "Channel", "Type", "CustomerSelection",
                    "Brand", "[W/S Approved]", "[Start Date]",
                    "[End Date]", "Code", "TSID" , new int[] 
                    R.id.scheme, R.id.name, R.id.product, R.id.channel,
                    R.id.type, R.id.customerSelection, R.id.brand, R.id.ws,
                    R.id.startDate, R.id.endDate, R.id.code, R.id.tsid );
    schemeGridView.setAdapter(sa);
    schemeGridView.setOnItemClickListener(new OnItemClickListener() 
        @Override
        public void onItemClick(AdapterView<?> parent, View view,
                int position, long id) 
            Log.d("Grid Item Click", "Clicked pos:"+position);
            TextView txt = (TextView) view.findViewById(R.id.tsid);
            if (txt != null && txt.getText() != null) 
                String tsid = txt.getText().toString();
                Intent intent = new Intent(thisAct,SchemeDetails.class); 
                intent.putExtra(TSID_PARAM, tsid);
                thisAct.startActivity(intent);
            
        
    );
    d.dismiss();


【问题讨论】:

您应该创建一个最小的示例,而不是直接从您的项目中复制几个文件 【参考方案1】:

我更改了一些代码,终于能够获得表格视图。

解决方案:我添加了 Horizo​​ntalScrollView,现在我的 LinearLayout 是它的孩子。我还在 TableLayout 中添加了 android:stretchColumns="*"。除此之外,我还必须通过以下方式更改不同控件的 android:layout_width 和 android:layout_height。

更新代码如下:

主要活动布局:

<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_
android:layout_ >

<LinearLayout
    android:layout_
    android:layout_
    android:orientation="vertical" >

    <!-- This Table Layout is header followed by the gridview -->
    <TableLayout
        android:layout_
        android:layout_
        android:layout_marginLeft="5dp"
        android:stretchColumns="*" >

        <TableRow android:layout_ >

            <TextView
                android:id="@+id/schemeTitle"
                android:layout_
                android:layout_
                android:text="Scheme"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/nameTitle"
                android:layout_
                android:layout_
                android:text="Name"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/productTitle"
                android:layout_
                android:layout_
                android:text="Product"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/channelTitle"
                android:layout_
                android:layout_
                android:text="Channel"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/typeTitle"
                android:layout_
                android:layout_
                android:text="Type"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/customerSelectionTitle"
                android:layout_
                android:layout_
                android:text="Customer Selection"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/brandTitle"
                android:layout_
                android:layout_
                android:text="Brand"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/wsTitle"
                android:layout_
                android:layout_
                android:text="W/S"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/startDateTitle"
                android:layout_
                android:layout_
                android:text="Start Date"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/endDateTitle"
                android:layout_
                android:layout_
                android:text="End Date"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/codeTitle"
                android:layout_
                android:layout_
                android:text="Code"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/tsidTitle"
                android:layout_
                android:layout_
                android:text="TSID"
                android:textStyle="bold" />
        </TableRow>
    </TableLayout>

    <GridView
        android:id="@+id/schemeGridView"
        android:layout_
        android:layout_
        android:clickable="true"
        android:numColumns="1" >
    </GridView>
</LinearLayout>

</HorizontalScrollView>

网格布局:

只改变以下标签:

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_
android:layout_ 
android:stretchColumns="*">

源代码:

Java 代码没有变化。

我的想法来自:How can I make my layout scroll both horizontally and vertically? 和 How to put a very long table layout inside the horizontal Scroll view in the CORRECT way?

【讨论】:

嗨,我很久以前研究过那个代码,所以不记得了。此外,这是一个客户特定的代码。因此,不能共享。我没有。我相信问题中提供的代码适用于这些配置。【参考方案2】:

最简单的解决方案是

    使用水平滚动视图来包含 GridView 然后根据您为 GridView 设置的列数动态调整 GridView 的宽度

    最后,将列数乘以每列的宽度

    GridView gridView = (GridView) findViewById(R.id.grid_view);
    int numberOfColumns = 3;
    int sizeOfWidthPerColumn = 20;
    gridView.setNumColumns(numberOfColumns);
    ViewGroup.LayoutParams layoutParams = gridView.getLayoutParams();
    layoutParams.width = convertDpToPixels(numberOfColumns * sizeOfWidthPerColumn, this);
    gridView.setLayoutParams(layoutParams);
    

现在您可以水平和垂直滚动 GridView。

【讨论】:

1.使用水平滚动视图来包含 GridView :对我来说,我将 GridView 放在 LinearLayout 中,将 LinearLayout 放在水平滚动中。 最好像你说的那样做,因为水平滚动视图只能包含一个子视图:)【参考方案3】:

我不确定是否可以同时在两个方向上滚动,但这里有一个库可以帮助您水平滚动 GridView。 https://github.com/jess-anders/two-way-gridview

你也可以在这里看看,How to make a 2-dimension image gallery with both horizontal and vertical scrolling?

【讨论】:

感谢 Khobaib 的回复。 two-way-gridview 不会同时提供两种滚动。它确实提供了两者,但一次提供了一个。而且我没有尝试其他链接。但是,我找到了解决方案并已发送。再次感谢:)

以上是关于同时具有水平和垂直滚动条的 Android GridView的主要内容,如果未能解决你的问题,请参考以下文章

修复了带有水平滚动条和垂直滚动条的标题表

带垂直和水平滚动条的系统度量展示程序

具有垂直和水平滚动的 Recyclerview

在不影响浏览的情况下隐藏垂直的滚动条的方法都有哪些?

MFC 控件编程之水平滚动条跟垂直滚动条

Android 布局:具有滚动行为的 Viewpager 内的垂直 Recyclerview 内的水平 Recyclerview