Android应用开发中使用GridView网格布局的代码示例

前端技术 2023/09/03 Android

基本布局演示
1. 定义包含GridView 的 main.xmk

<?xml version=\"1.0\" encoding=\"utf-8\"?>
<LinearLayout xmlns:android=\"http://schemas.android.com/apk/res/android\"
  android:orientation=\"vertical\"
  android:layout_width=\"fill_parent\"
  android:layout_height=\"fill_parent\"
  >
<GridView 
  android:id=\"@+id/gride\"
  android:layout_width=\"fill_parent\"
  android:layout_height=\"wrap_content\"
<strong>  android:numColumns=\"3\"</strong>
  android:verticalSpacing=\"5dip\"
  />
</LinearLayout>

这行应该注意一下:

android:numColumns=\"3\"

用来设定GridView每行显示的View数目 如果没有这行 会默认每行显示一个View 和ListView 的一样

2. 自定义 class ImageList extends BaseAdapter 其中主要是:

View getView(int position, View convertView, ViewGroup parent)

用于显示目标ImageView

public class ImageList extends BaseAdapter {
    Activity activity;
     
    //construct
    public ImageList(Activity a ) {
      activity = a;
    }
     
    @Override
    public int getCount() {
      // TODO Auto-generated method stub
      return image.length;
    }
 
    @Override
    public Object getItem(int position) {
      // TODO Auto-generated method stub
      return image[position];
    }
 
    @Override
    public long getItemId(int position) {
      // TODO Auto-generated method stub
      return position;
    }
 
    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
      // TODO Auto-generated method stub
      ImageView iv = new ImageView(activity);
      iv.setImageResource(image[position]);
      return iv;
    }
  }

3. 给GridView指定Adapter

GridView gv = (GridView) findViewById(R.id.gride);
ImageList adapter = new ImageList(this);
gv.setAdapter(adapter);

所以最后效果图是这样的 


巧妙地添加GridView的 网格线
ListView 中设置分隔线的加如下参数即可:

android:divider=\"@color/gray\"
android:dividerHeight=\"1dp\"

GridView网格布局,默认情况下是没有网格线的
查找网上资料,找到了一种为GridView添加网格线的小技巧
实际上,该网格线是通过设置GridView各子项的间隔,并分别设置GridView背景色与子项背景色实现的。
实现方法:
(1)设置GridView背景色,设置水平间方向间隔属性值android:horizontalSpacing和竖直方向间隔属性值

android:verticalSpacing

(2)设置GridView子项背景色
示例代码:
1.main.xml

 <GridView
    android:id=\"@+id/gv_words\"
    android:visibility=\"gone\"
    android:background=\"@color/gray\"
    android:columnWidth=\"60dp\" 
    android:numColumns=\"5\"
    android:listSelector=\"@null\" 
    android:verticalSpacing=\"1.0px\" 
    android:horizontalSpacing=\"1.0px\"
    android:soundEffectsEnabled=\"true\"
    android:smoothScrollbar=\"true\" 
    android:stretchMode=\"columnWidth\" 
    android:layout_width=\"fill_parent\"
    android:layout_height=\"fill_parent\"
    android:layout_above=\"@+id/llayout2\"
    android:layout_below=\"@+id/llayout1\"/>

2.GrivViewItem布局

<?xml version=\"1.0\" encoding=\"utf-8\"?>
<LinearLayout xmlns:android=\"http://schemas.android.com/apk/res/android\"
  android:layout_width=\"match_parent\"
  android:layout_height=\"wrap_content\"
  android:background=\"@color/white\" >
  <RelativeLayout
    android:layout_width=\"50dp\"
    android:layout_height=\"50dp\"
    android:layout_margin=\"5dp\">

     <TextView
      android:id=\"@+id/gv_bushou_TextView1\"
      android:layout_width=\"wrap_content\"
      android:layout_height=\"wrap_content\"
      android:layout_below=\"@+id/ItemImage\"
      android:layout_margin=\"1dp\"
      android:layout_alignParentTop=\"true\"
      android:layout_alignParentLeft=\"true\"
      android:layout_above=\"@+id/gv_bushou_TextView2\"
      android:layout_toLeftOf=\"@+id/gv_bushou_TextView2\"
      android:textSize=\"25dp\"
      android:textColor=\"@color/blue\"
      android:text=\"难\" >
    </TextView>
  
    <TextView
      android:id=\"@+id/gv_bushou_TextView2\"
      android:layout_width=\"wrap_content\"
      android:layout_height=\"wrap_content\"
      android:layout_below=\"@+id/ItemImage\"
      android:layout_alignParentBottom=\"true\"
      android:layout_alignParentRight=\"true\"
      android:textColor=\"@color/gray\"
      android:textSize=\"10dp\"
      android:text=\"1笔\" >
    </TextView>
  </RelativeLayout>
</LinearLayout>

3.运行截图

本文地址:https://www.stayed.cn/item/6669

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见,何事秋风悲画扇。