1. 创建一个activity，命名为：GridViewActivity，如下：
public class GridViewActivity extends AppCompatActivity {
private static final String TAG = "GridViewActivity";
private GridView gv_planet;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_grid_view);
ArrayList<Planet> planetList = Planet.getDefaultList();
PlanetGridAdapter adapter = new PlanetGridAdapter(this, planetList);
gv_planet = findViewById(R.id.gv_planet);
gv_planet.setAdapter(adapter);
gv_planet.setOnItemClickListener(adapter);
gv_planet.setOnItemLongClickListener(adapter);
initDividerSpinner();
}
private void initDividerSpinner() {
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, R.layout.item_select, dividerArr);
Spinner sp = findViewById(R.id.sp_grid);
sp.setPrompt("请选择分割线显示方式");
sp.setAdapter(adapter);
sp.setOnItemSelectedListener(new DividerSelectedListener());
}
private String[] dividerArr = {
"不显示分隔线",
"只显示内部分隔线(NO_STRETCH)",
"只显示内部分隔线(COLUMN_WIDTH)",
"只显示内部分隔线(STRETCH_SPACING)",
"只显示内部分隔线(SPACING_UNIFORM)",
"显示全部分隔线(看我用padding大法)"
};
class DividerSelectedListener implements AdapterView.OnItemSelectedListener {
@Override
public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
int dividerPad = Utils.dip2px(GridViewActivity.this, 5);
gv_planet.setBackgroundColor(Color.RED);
gv_planet.setHorizontalSpacing(dividerPad);
gv_planet.setVerticalSpacing(dividerPad);
gv_planet.setStretchMode(GridView.STRETCH_COLUMN_WIDTH);
gv_planet.setColumnWidth(Utils.dip2px(GridViewActivity.this, 120)); // 设置每列宽度为120dp
gv_planet.setPadding(0, 0, 0, 0);
switch (position) {
case 0: {
gv_planet.setBackgroundColor(Color.WHITE);
gv_planet.setHorizontalSpacing(0);
gv_planet.setVerticalSpacing(0);
}
break;
case 1:
gv_planet.setStretchMode(GridView.NO_STRETCH); // 不拉伸
break;
case 2:
gv_planet.setStretchMode(GridView.STRETCH_COLUMN_WIDTH); // 有剩余空间，拉伸列宽
break;
case 3:
gv_planet.setStretchMode(GridView.STRETCH_SPACING); // 有剩余空间，列宽不变，空间给每列间的空隙
break;
case 4:
gv_planet.setStretchMode(GridView.STRETCH_SPACING_UNIFORM); // 有剩余空间，列宽不变，空间给每列左右的空隙
break;
case 5:
gv_planet.setPadding(dividerPad, dividerPad, dividerPad, dividerPad);
break;
}
}
@Override
public void onNothingSelected(AdapterView<?> parent) {
}
}
}
2. GridViewActivity对应的布局文件为：activity_grid_view，如下：
<?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:padding="10dp"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="40dp">
<TextView
android:id="@+id/tv_type"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="分割线显示"
android:textColor="@color/black"
android:textSize="17sp" />
<Spinner
android:id="@+id/sp_grid"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:spinnerMode="dialog"
android:layout_toRightOf="@id/tv_type" />
</RelativeLayout>
<GridView
android:id="@+id/gv_planet"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:horizontalSpacing="5dp"
android:verticalSpacing="5dp"
android:numColumns="2"
android:stretchMode="columnWidth"
android:background="@color/orange"/>
</LinearLayout>
3. 创建一个适配器命名为PlanetGridAdapter ，继承于 BaseAdapter，如下：
public class PlanetGridAdapter extends BaseAdapter implements AdapterView.OnItemLongClickListener, AdapterView.OnItemClickListener {
private Context mContext;
private ArrayList<Planet> mPlanetList;
public PlanetGridAdapter(Context context, ArrayList<Planet> arrayList) {
mContext = context;
mPlanetList = arrayList;
}
@Override
public int getCount() {
return mPlanetList.size();
}
@Override
public Object getItem(int position) {
return mPlanetList.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder;
if (convertView == null) {
holder = new ViewHolder();
convertView = LayoutInflater.from(mContext).inflate(R.layout.item_grid, null);
holder.tv_name = convertView.findViewById(R.id.tv_name);
holder.iv_icon = convertView.findViewById(R.id.iv_icon);
holder.tv_desc = convertView.findViewById(R.id.tv_desc);
convertView.setTag(holder);
} else {
holder = (ViewHolder)convertView.getTag();
}
setModel(holder, mPlanetList.get(position));
return convertView;
}
private void setModel(ViewHolder holder, Planet info) {
holder.tv_name.setText(info.name);
holder.iv_icon.setImageResource(info.image);
holder.tv_desc.setText(info.desc);
}
@Override
public boolean onItemLongClick(AdapterView<?> parent, View view, int position, long id) {
ToastUtil.showToast(mContext, String.format("您长按了第%d个行星，她的名字是%s",position + 1,mPlanetList.get(position).name));
return true;
}
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
ToastUtil.showToast(mContext, String.format("您点击了第%d个行星，她的名字是%s",position + 1,mPlanetList.get(position).name));
}
final class ViewHolder {
TextView tv_name;
ImageView iv_icon;
TextView tv_desc;
}
}
4. PlanetGridAdapter 中用到的布局文件为：item_grid，如下：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:background="@color/white"
android:layout_height="match_parent">
<TextView
android:id="@+id/tv_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="水星"
android:gravity="center"
android:textSize="20sp"
android:textColor="@color/black" />
<ImageView
android:id="@+id/iv_icon"
android:layout_width="match_parent"
android:layout_height="100dp"
android:src="@drawable/shuixing"
android:scaleType="fitCenter" />
<TextView
android:id="@+id/tv_desc"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="我是一个小水星"
android:textColor="@color/contentGray"
android:textSize="13sp" />
</LinearLayout>
5. PlanetGridAdapter 中用到的模型为Planet，如下：
public class Planet {
public int image;
public String name;
public String desc;
public Planet(int image, String name, String desc) {
this.image = image;
this.name = name;
this.desc = desc;
}
private static int[] iconArray = {R.drawable.shuixing, R.drawable.jinxing, R.drawable.diqiu,
R.drawable.huoxing, R.drawable.muxing, R.drawable.tuxing};
private static String[] nameArray = {"水星", "金星", "地球", "火星", "木星", "土星"};
private static String[] descArray = {
"水星是太阳系八大行星最内侧也是最小的一颗行星，也是离太阳最近的行星",
"金星是太阳系八大行星之一，排行第二，距离太阳0.725天文单位",
"地球是太阳系八大行星之一，排行第三，也是太阳系中直径、质量和密度最大的类地行星，距离太阳1.5亿公里",
"火星是太阳系八大行星之一，排行第四，属于类地行星，直径约为地球的53%",
"木星是太阳系八大行星中体积最大、自转最快的行星，排行第五。它的质量为太阳的千分之一，但为太阳系中其它七大行星质量总和的2.5倍",
"土星为太阳系八大行星之一，排行第六，体积仅次于木星"
};
public static ArrayList<Planet> getDefaultList() {
ArrayList<Planet> planetList = new ArrayList<Planet>();
for (int i = 0; i < nameArray.length; i++) {
planetList.add(new Planet(iconArray[i], nameArray[i], descArray[i]));
}
return planetList;
}
}
6. 效果如下：
- 第一张图是：不显示分隔线
- 第二张图是：只显示内部分隔线(NO_STRETCH)
- 第三张图是：只显示内部分隔线(COLUMN_WIDTH)
![]()
- 第一张图是：只显示内部分隔线(STRETCH_SPACING)
- 第二张图是：只显示内部分隔线(SPACING_UNIFORM)
- 第三张图是：显示全部分隔线(看我用padding大法)
![]()
