小贝子编程

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



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

问题:我需要GridView在Android类似于。net GridView能够滚动在水平和垂直方向在同一时间。

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

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

主活动布局: 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical" >
<!-- This Table Layout is header followed by the gridview -->
<TableLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="5dp" >
    <TableRow android:layout_width="wrap_content" >
        <TextView
            android:id="@+id/schemeTitle"
            android:layout_width="80dp"
            android:layout_height="wrap_content"
            android:text="Scheme"
            android:textStyle="bold" />
        <TextView
            android:id="@+id/nameTitle"
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:text="Name"
            android:textStyle="bold" />
        <TextView
            android:id="@+id/productTitle"
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:text="Product"
            android:textStyle="bold" />
        <TextView
            android:id="@+id/channelTitle"
            android:layout_width="80dp"
            android:layout_height="wrap_content"
            android:text="Channel"
            android:textStyle="bold" />
        <TextView
            android:id="@+id/typeTitle"
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:text="Type"
            android:textStyle="bold" />
        <TextView
            android:id="@+id/customerSelectionTitle"
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:text="Customer Selection"
            android:textStyle="bold" />
        <TextView
            android:id="@+id/brandTitle"
            android:layout_width="80dp"
            android:layout_height="wrap_content"
            android:text="Brand"
            android:textStyle="bold" />
        <TextView
            android:id="@+id/wsTitle"
            android:layout_width="50dp"
            android:layout_height="wrap_content"
            android:text="W/S"
            android:textStyle="bold" />
        <TextView
            android:id="@+id/startDateTitle"
            android:layout_width="80dp"
            android:layout_height="wrap_content"
            android:text="Start Date"
            android:textStyle="bold" />
        <TextView
            android:id="@+id/endDateTitle"
            android:layout_width="80dp"
            android:layout_height="wrap_content"
            android:text="End Date"
            android:textStyle="bold" />
        <TextView
            android:id="@+id/codeTitle"
            android:layout_width="80dp"
            android:layout_height="wrap_content"
            android:text="Code"
            android:textStyle="bold" />
        <TextView
            android:id="@+id/tsidTitle"
            android:layout_width="50dp"
            android:layout_height="wrap_content"
            android:text="TSID"
            android:textStyle="bold" />
    </TableRow>
</TableLayout>
<GridView
    android:id="@+id/schemeGridView"
    android:layout_width="wrap_content"
    android:layout_height="fill_parent"
    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_width="wrap_content"
    android:layout_height="fill_parent" >
<TableRow android:layout_width="wrap_content" >
    <TextView
        android:id="@+id/scheme"
        android:layout_width="80dp"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/name"
        android:layout_width="200dp"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/product"
        android:layout_width="200dp"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/channel"
        android:layout_width="80dp"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/type"
        android:layout_width="100dp"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/customerSelection"
        android:layout_width="150dp"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/brand"
        android:layout_width="80dp"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/ws"
        android:layout_width="50dp"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/startDate"
        android:layout_width="80dp"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/endDate"
        android:layout_width="80dp"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/code"
        android:layout_width="80dp"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/tsid"
        android:layout_width="50dp"
        android:layout_height="wrap_content" />
</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();
}
}

我修改了一些代码，最终可以获得表格视图。

解决方案:我添加了HorizontalScrollView，现在我的LinearLayout是它的孩子。我还添加了android:stretchColumns="*"在TableLayout。与此同时，我不得不改变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_width="wrap_content"
android:layout_height="wrap_content" >
<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical" >
    <!-- This Table Layout is header followed by the gridview -->
    <TableLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5dp"
        android:stretchColumns="*" >
        <TableRow android:layout_width="wrap_content" >
            <TextView
                android:id="@+id/schemeTitle"
                android:layout_width="80dp"
                android:layout_height="wrap_content"
                android:text="Scheme"
                android:textStyle="bold" />
            <TextView
                android:id="@+id/nameTitle"
                android:layout_width="200dp"
                android:layout_height="wrap_content"
                android:text="Name"
                android:textStyle="bold" />
            <TextView
                android:id="@+id/productTitle"
                android:layout_width="200dp"
                android:layout_height="wrap_content"
                android:text="Product"
                android:textStyle="bold" />
            <TextView
                android:id="@+id/channelTitle"
                android:layout_width="80dp"
                android:layout_height="wrap_content"
                android:text="Channel"
                android:textStyle="bold" />
            <TextView
                android:id="@+id/typeTitle"
                android:layout_width="100dp"
                android:layout_height="wrap_content"
                android:text="Type"
                android:textStyle="bold" />
            <TextView
                android:id="@+id/customerSelectionTitle"
                android:layout_width="150dp"
                android:layout_height="wrap_content"
                android:text="Customer Selection"
                android:textStyle="bold" />
            <TextView
                android:id="@+id/brandTitle"
                android:layout_width="80dp"
                android:layout_height="wrap_content"
                android:text="Brand"
                android:textStyle="bold" />
            <TextView
                android:id="@+id/wsTitle"
                android:layout_width="50dp"
                android:layout_height="wrap_content"
                android:text="W/S"
                android:textStyle="bold" />
            <TextView
                android:id="@+id/startDateTitle"
                android:layout_width="80dp"
                android:layout_height="wrap_content"
                android:text="Start Date"
                android:textStyle="bold" />
            <TextView
                android:id="@+id/endDateTitle"
                android:layout_width="80dp"
                android:layout_height="wrap_content"
                android:text="End Date"
                android:textStyle="bold" />
            <TextView
                android:id="@+id/codeTitle"
                android:layout_width="80dp"
                android:layout_height="wrap_content"
                android:text="Code"
                android:textStyle="bold" />
            <TextView
                android:id="@+id/tsidTitle"
                android:layout_width="50dp"
                android:layout_height="wrap_content"
                android:text="TSID"
                android:textStyle="bold" />
        </TableRow>
    </TableLayout>
    <GridView
        android:id="@+id/schemeGridView"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        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_width="wrap_content"
android:layout_height="wrap_content" 
android:stretchColumns="*">

源代码:

Java代码没有变化。

我的想法从:我怎么能使我的布局滚动水平和垂直?以及如何把一个很长的表布局内的水平滚动视图在正确的方式?

最简单的解决方法是

  1. 使用一个水平滚动视图来包含GridView
  2. 然后根据GridView
    3. 设置的列数动态调整GridView宽度的大小

  3. 最后，将列数与每个列的宽度相乘

    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

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

你也可以看看这里，如何使一个二维图库与水平和垂直滚动?

相关内容

最新更新


热门标签：

javascript python java c# php android html jquery c++ css ios sql mysql arrays asp.net json python-3.x ruby-on-rails .net sql-server django objective-c excel regex ruby linux ajax iphone xml vba spring asp.net-mvc database wordpress string postgresql wpf windows xcode bash git oracle list vb.net multithreading eclipse algorithm macos powershell visual-studio image forms numpy scala function api selenium