android组件:GridView网格布局基本实现

在Android程序设计中GridView跟ListView都是比较常用的多控件布局,GridView的用法很多,主要凸显的是那种网格式布局,既有横向也有纵向的数据显示。

基本用法

效果图

实现思路是

1、初始化控件

2、定义图片资源mThumbIds

3、定义ImageAdapter

创建item布局

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >

    <ImageView
        android:id="@+id/iv_head"
        android:layout_width="90dp"
        android:layout_height="90dp"
        android:layout_centerInParent="true"
        android:scaleType="centerCrop"
        />

</RelativeLayout>

创建activity布局

扫描二维码关注公众号,回复: 9811991 查看本文章
<LinearLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

<GridView 
        android:id="@+id/gview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:numColumns="auto_fit"    
        android:columnWidth="80dp"
        android:stretchMode="columnWidth"
        ></GridView>

</LinearLayout>

Activity代码

public class GridViewTestActivity extends ActionBarActivity implements OnItemClickListener {

    private GridView gridView;
    private Context mContext;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_gridview);
        mContext = GridViewTestActivity.this;

        gridView = (GridView) this.findViewById(R.id.gridView);
        gridView.setAdapter(new ImageAdapter(this));
    }



    // references to our images
    private Integer[] mThumbIds = {
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7,
            R.drawable.sample_0, R.drawable.sample_1,
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drwable.sample_7,
            R.drawable.sample_0, R.drawable.sample_1,
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7
    };

    @Override
    public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
        // TODO: 点击列表跳转到其他页面
    }

}

适配器 

private class ImageAdapter extends BaseAdapter {

        private Context mContext;

        public ImageAdapter(Context context) {
            this.mContext = context;
        }

        @Override
        public int getCount() {
            return mThumbIds.length;
        }

        @Override
        public Object getItem(int position) {
            return null;
        }


        @Override
        public long getItemId(int position) {
            return position;
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            ViewHolder viewHolder = null;
            if (convertView == null) {
                convertView = LayoutInflater.from(mContext).inflate(R.layout.layout_grid_item, parent, false);
                viewHolder = new ViewHolder();
                viewHolder.itemImg = (ImageView) convertView.findViewById(R.id.iv_head);
                convertView.setTag(viewHolder);
            } else {
                viewHolder = (ViewHolder) convertView.getTag();
            }
            viewHolder.itemImg.setImageResource(mThumbIds[position]);
            return convertView;
        }

        class ViewHolder {
            ImageView itemImg;
        }

    }

缺少的资源,大家可以自行配置,图片的话,百度图片搜索就能下载解决

常用api

  • android:numColumns=”auto_fit” //GridView的列数设置为自动

  • android:columnWidth=”90dp " //每列的宽度,也就是Item的宽度

  • android:stretchMode=”columnWidth"//缩放与列宽大小同步

  • android:verticalSpacing=”10dp” //两行之间的边距

  • android:horizontalSpacing=”10dp” //两列之间的边距

  • android:cacheColorHint="#00000000" //去除拖动时默认的黑色背景

  • android:listSelector="#00000000" //去除选中时的黄色底色

  • android:scrollbars="none" //隐藏GridView的滚动条

  • android:fadeScrollbars="true" //设置为true就可以实现滚动条的自动隐藏和显示

  • android:fastScrollEnabled="true" //GridView出现快速滚动的按钮(至少滚动4页才会显示)

  • android:fadingEdge="none" //GridView衰落(褪去)边缘颜色为空,缺省值是vertical。(可以理解为上下边缘的提示色)

  • android:fadingEdgeLength="10dip" //定义的衰落(褪去)边缘的长度

  • android:stackFromBottom="true" //设置为true时,你做好的列表就会显示你列表的最下面

场景解决方案

九宫格实现

实现思路是

1,设置属性android:numColumns="3",android:stretchMode=”columnWidth",android:columnWidth属性不要设置

2,数据最多准备9个

3,android:verticalSpacing和android:horizontalSpacing行和列间隔按照需求美化调整即可

结语

网格布局还是非常简单的,使用起来很方便只需要适配器设置好就可以了,想要熟练还是得多多练习,同样大家有什么问题也可以评论留言,我会及时回复的。

发布了58 篇原创文章 · 获赞 10 · 访问量 3万+

猜你喜欢

转载自blog.csdn.net/qq_34203714/article/details/101174552
今日推荐