您的位置：首页 > 产品设计 > UI/UE

Android开发教程24：UI之网格视图:GridView

2012-09-21 10:36 405 查看
Android的GridView一般翻译为网格视图，GridView的排列方式与矩阵类似，用于在界面上按行、列分布的方式来显示多个组件。通过查看GridView类的继承关系，我们发现GridView与ListView有相同的父类：AbsListView，所以GridView与ListView用法有一定的相似性。我们知道ListView只是在一个方面上的分布，而GridView则会在两个方向上分布。同样，GridView也需要通过Adapter知配器来提供显示的数据，我们既可通过SimpleAdapter来为GridView提供数据，也可以通过继续BaseAdapter来为GridView提供数据。

GridView常用的XMl属性如下：


android:columnWidth:设置列的宽度

android:horizontalSpacing:设置各元素之间的水平间距

android:numColumns:设置列数

android:verticalSpacing:设置各元素之间的垂直间距。


下面的这个例子中我们只是简单的演示了GridView的使用，通过SimpleAdapter使用GridView简单的显示一组图片。由于代码都比较熟悉，没有过多的注释。

GridViewDemoActivity.java:

1
package
com.liuzhichao.gridview;
2
3
import
java.util.ArrayList;
4
import
java.util.HashMap;
5
import
java.util.List;
6
import
java.util.Map;
7
8
import
android.app.Activity;
9
import
android.os.Bundle;
10
import
android.widget.GridView;
11
import
android.widget.SimpleAdapter;
12
13
public
class
GridViewDemoActivity
extends
Activity{
14
15
GridViewgridView;
16
//图片资源数组
17
static
final
int
[]imgs=
new
int
[]{R.drawable.ringvibrosoundicon,R.drawable.brightnessicon,
18
R.drawable.lockpattern,R.drawable.wifiicon,
19
R.drawable.gpsicon,R.drawable.bluetoothicon,
20
R.drawable.autosync,R.drawable.autorotate,
21
R.drawable.screentimeouticon,R.drawable.airplaneicon,
22
R.drawable.wirelessicon,R.drawable.net2g3gicon};
23
List<Map<String,Object>>listItems;
24
SimpleAdapteradapter;
25
@Override
26
public
void
onCreate(BundlesavedInstanceState){
27
super
.onCreate(savedInstanceState);
28
setContentView(R.layout.main);
29
gridView=(GridView)findViewById(R.id.gridView1);
30
31
32
listItems=
new
ArrayList<Map<String,Object>>();
33
for
(
int
i=
0
;i<imgs.length;i++){
34
Map<String,Object>map=
new
HashMap<String,Object>();
35
map.put(
"img"
,imgs[i]);
36
listItems.add(map);
37
}
38
39
adapter=
new
SimpleAdapter(
this
,listItems,R.layout.image,
new
String[]{
"img"
},
new
int
[]{});
40
gridView.setAdapter(adapter);
41
}
42
}
使用到的image.xml布局文件：

<?
xml
version
=
"1.0"
encoding
=
"utf-8"
?>
<
LinearLayout
xmlns:android
=
"http://schemas.android.com/apk/res/android"
android:layout_width
=
"fill_parent"
android:layout_height
=
"fill_parent"
android:orientation
=
"vertical"
>
<
ImageView
android:gravity
=
"center"
android:layout_width
=
"wrap_content"
android:layout_height
=
"wrap_content"
>
</
ImageView
>
</
LinearLayout
>
主布局文件main.xml:

1
<?
xml
version
=
"1.0"
encoding
=
"utf-8"
?>
2
<
LinearLayout
xmlns:android
=
"http://schemas.android.com/apk/res/android"
3
android:layout_width
=
"fill_parent"
4
android:layout_height
=
"fill_parent"
5
android:orientation
=
"vertical"
>
6
7
<
GridView
8
android:id
=
"@+id/gridView1"
9
android:numColumns
=
"auto_fit"
10
android:gravity
=
"center"
11
android:columnWidth
=
"100dp"
12
android:stretchMode
=
"columnWidth"
13
android:layout_width
=
"fill_parent"
14
android:layout_height
=
"fill_parent"
>
15
16
</
GridView
>
17
18
</
LinearLayout
>
运行效果：


                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航