GridView实现方块布局

效果如下:

先创建一个BaseViewHolder

package com.example.griddemo;

import android.util.SparseArray;
import android.view.View;

public class BaseViewHolder {
    @SuppressWarnings("unchecked")
    public static <T extends View> T get(View view, int id) {
        SparseArray<View> viewHolder = (SparseArray<View>) view.getTag();
        if (viewHolder == null) {
            viewHolder = new SparseArray<View>();
            view.setTag(viewHolder);
        }
        View childView = viewHolder.get(id);
        if (childView == null) {
            childView = view.findViewById(id);
            viewHolder.put(id, childView);
        }
        return (T) childView;
    }

}

然后创建MyGridAdapter

package com.example.griddemo;

import android.content.Context;
import android.content.res.TypedArray;
import android.util.TypedValue;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;

public class MyGridAdapter extends BaseAdapter {
    private Context mContext;

    public String[] img_text = { "转账", "余额宝", "手机充值", "信用卡还款", "淘宝电影", "彩票",
            "当面付", "亲密付", "机票", };
    public int[] imgs = { R.drawable.app_transfer, R.drawable.app_fund,
            R.drawable.app_phonecharge, R.drawable.app_creditcard,
            R.drawable.app_movie, R.drawable.app_lottery,
            R.drawable.app_facepay, R.drawable.app_close, R.drawable.app_plane };

    public MyGridAdapter(Context mContext) {
        super();
        this.mContext = mContext;
    }

    @Override
    public int getCount() {
        // TODO Auto-generated method stub
        return img_text.length;
    }

    @Override
    public Object getItem(int position) {
        // TODO Auto-generated method stub
        return position;
    }

    @Override
    public long getItemId(int position) {
        // TODO Auto-generated method stub
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        if (convertView == null) {
            convertView = LayoutInflater.from(mContext).inflate(
                    R.layout.grid_item, parent, false);
        }
        TextView tv = BaseViewHolder.get(convertView, R.id.tv_item);
        ImageView iv = BaseViewHolder.get(convertView, R.id.iv_item);
        iv.setBackgroundResource(imgs[position]);

        tv.setText(img_text[position]);
        return convertView;
    }

}

创建MyGridView

package com.example.griddemo;

import android.content.Context;
import android.util.AttributeSet;
import android.widget.GridView;
/**
 * @Description:解决在scrollview中只显示第一行数据的问题
 */
public class MyGridView extends GridView {
    public MyGridView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public MyGridView(Context context) {
        super(context);
    }

    public MyGridView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    @Override
    public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int expandSpec = MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2,
                MeasureSpec.AT_MOST);
        super.onMeasure(widthMeasureSpec, expandSpec);
    }

}

MainActivity的实现如下:

package com.example.griddemo;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.Toast;

public class MainActivity extends Activity {
    private MyGridView gridview;
    private Context mContext;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        mContext = MainActivity.this;
        setContentView(R.layout.activity_main);
        initView();
    }

    private void initView() {
        gridview=(MyGridView) findViewById(R.id.gridview);
        gridview.setAdapter(new MyGridAdapter(this));

        gridview.setOnItemClickListener(new AdapterView.OnItemClickListener(){
            public void onItemClick(AdapterView<?> parent, View v, int position, long id){
                Toast.makeText(mContext,""+id,Toast.LENGTH_SHORT).show();
                //Toast.makeText(mContext, "你点击了第" + position + "项", Toast.LENGTH_SHORT).show();
            }
        });
    }
}

最后创建视图部分:

Grid_item部分如下:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_margin="0.0dip"
    android:background="@color/griditems_bg" >

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_centerInParent="true"
        android:background="@drawable/bg_gv"
        android:padding="12.0dip" >

        <ImageView
            android:id="@+id/iv_item"
            android:layout_width="58.0dip"
            android:layout_height="58.0dip"
            android:layout_centerHorizontal="true"
            android:contentDescription="@string/app_name" />

        <TextView
            android:id="@+id/tv_item"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/iv_item"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="5.0dip"
            android:maxLines="1"
            android:textColor="@color/commo_text_color"
            android:textSize="14.0sp" />
    </RelativeLayout>

</RelativeLayout>

activity_main部分如下:

<?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="match_parent"
    android:orientation="vertical" >

    <ScrollView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:fillViewport="true"
        android:scrollbars="none" >

        <com.example.griddemo.MyGridView
            android:id="@+id/gridview"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:horizontalSpacing="0.0dip"
            android:listSelector="@null"
            android:numColumns="3"
            android:scrollbars="none"
            android:stretchMode="columnWidth"
            android:verticalSpacing="0.0dip" />
    </ScrollView>

</LinearLayout>

完整代码下载

 
时间: 2024-10-12 15:18:08

GridView实现方块布局的相关文章

GridView实现九宫格布局

  //1,准备数据源 //2,新建适配器 //3.GridView加载适配器 //4.GridView配置事件监听器(OnItemClickListener) GridView三个重要属性:         android:numColumns=""               每一行显示多少列 android:horizontalSpacing=""        两列之间的间距 android:verticalSpacing=""    

7-4 基于GridView实现网格布局

网格布局 GridView.count允许我们控制,这一行显示几列.目前我们这里一行显示了两列. GridView.count来创建GridView 代码运行起来的效果 比如修改为一行显示3列 结束 原文地址:https://www.cnblogs.com/wangjunwei/p/12199317.html

Android GridView 二维布局界面

GridView用于在界面上按行.列分布的方式来显示多个组件. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools= "http://schemas.android.com/tools" android:layout_width= "match_parent" android:layout_height= "mat

Flutter 通过 GridView 实现网格布局

效果图: 实现代码: import 'package:flutter/material.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar( title: Text('Flutter Row'), ),

FrameLayout之GridView的item布局

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

android中九宫格布局与gridview

纵观现在的应用程序,九宫格是非常常见的一种布局方式.很多优秀的手机应用程序都采用了这一布局.下面就android中九宫格布局方式的实现和大家做一个简单的介绍. 首先在youxi.xml的布局 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" androi

Flutter 布局(八)- Stack、IndexedStack、GridView详解

本文主要介绍Flutter布局中的Stack.IndexedStack.GridView控件,详细介绍了其布局行为以及使用场景,并对源码进行了分析. 1. Stack A widget that positions its children relative to the edges of its box. 1.1 简介 Stack可以类比web中的absolute,绝对布局.绝对布局一般在移动端开发中用的较少,但是在某些场景下,还是有其作用.当然,能用Stack绝对布局完成的,用其他控件组合也

Android的GridView和ScrollView的嵌套

来源于回答频道答题,因此内容都是基于回答频道的原题布局进行 1.布局文件如下 文件名:testxm.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" andr

Android商城开发系列(十三)—— 首页热卖商品布局实现

热卖商品布局效果如下图: 这个布局跟我们上节做的推荐是一样的,也是用LinearLayout和GridView去实现的,新建一个hot_item.xml,代码如下所示: 1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout 3 xmlns:android="http://schemas.android.com/apk/res/android" 4 android:ori