Android 高级UI组件（一）GridView与ListView

1、GridView

1.GridView学习

GridView和ListView都是比较常用的多控件布局，而GridView更是实现九宫图的首选

main.xml:

<?xml version="1.0"  encoding="utf-8"?>
<GridView xmlns:....
android:id="@+id/gridview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontanSpacing="10dp"
android:columWidth="90dp"
android:stretchMode="columnWidth"
android:gravity="center"
/>

android:numColumns="auto_fit"

GridView的列数设置为自动，也可以指定具体数字，设置为自动之后系统会根据屏幕宽度、列宽来自动决定一行放置几行

 

android:columnWdith="90dp"

每列的宽度，也就是Item的宽度

 

android:stretchMode="columnWidth"

缩放与列宽大小同步

 

android:verticalSpacing="10dp"

两行之间的边距为10dp

 

android:horizontalSpacing="10dp"

两列之间的边距

 

android:listSelector="#00000000"

设置选中时item的背景颜色

 

android:scrollbars="none"

隐藏GridView的滚动条

 

android:fadeScrollbars="true"

设置为ture就可以实现滚动条的自动隐藏和显示。如果是ture则会自动隐藏与显示，若为false则一直会显示，默认是true

 

main_item.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
         xmlns:android="http://schemas.android.com/apk/res/android"
         android:layout_height="wrap_content"
         android:paddingBottom="4dip" android:layout_width="fill_parent">
         <ImageView
               android:layout_height="wrap_content"
               android:id="@+id/ItemImage"
               android:layout_width="wrap_content"
               android:layout_centerHorizontal="true">
         </ImageView>
         <TextView
               android:layout_width="wrap_content"
               android:layout_below="@+id/ItemImage"
               android:layout_height="wrap_content"
               android:text="TextView01"
               android:layout_centerHorizontal="true"
               android:id="@+id/ItemText">
         </TextView>
</RelativeLayout>  

 MainActivity.java

public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
GridView gridView=(GridView) findViewById(R.id.gridview);

//生成动态数组，并且转入数据
ArrayList<HashMap<String,Object>> lsImageItem =new ArrayList<HashMap<String,Object>>();
for(int i=0;i<10;i++){
HashMap<String,Object> map=new HashMap<String,Object>();
map.put("ItemImage", R.drawable.icon);//添加图像资源的ID
map.put("ItemText","NO."+Stirng.valueOf(i);//按序号做ItemText
lsImageItem.add(map);
}
//生成适配器的ImageItem与动态数组一一对应
SimpleAdapter saImageItems new SimpleAdapter( this , lsImageItem , R.layout.main_item , new Strign[] {"ItemImage" ,"ItemText"}, new int[] {R.id.ItemImage ,R.id.ItemText});

gridVeiw.setAdapter(saImageItems);//添加并显示
//添加消息处理
gridView.setOnItemClickListener(new ItemClickListener);
}

class ItemClickListener implements OnItemClickListener{
public void onItemClick(AdapterView<?> arg0,View arg1, int arg2, long arg3){
//在本例中arg2=arg3
HashMap<String, Object> item=(HashMap<String ,Object> arg0.getItemAtPosition(arg2);
//显示所选Item的ItemText
setTitle((String)item.get("ItemText"));
}
}

2、ListView

解决ScrollView中嵌套ListView，ListView只显示一行问题

在工作中，会遇到在ScrollView中嵌套ListView的需求，如果直接嵌套，可能会出现ListView只显示一行，但可以滑动的现象。

解决方法：

定义一个ListView基类，重写其中一个方法，然后再xml中引用

WListView.java

public class WListView extends ListView {
    public WListView(Context context) {
        super(context);
    }

    public WListView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public WListView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        //根据模式据算每个child的高度和宽度
        int expandSpec = MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2, MeasureSpec.AT_MOST);
        super.onMeasure(widthMeasureSpec, expandSpec);
    }
}

xml

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.example.chm.list.WListView
        android:id="@+id/lv"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    </com.example.chm.list.WListView>
</ScrollView>

这样就可以使用了