首先,感谢我的公司,让我可以有空闲的时间去学习。
最近加了一个交流群,看到很多人在讨论下面界面的实现,最后哥们实在不行就自己用布局写出来了,我觉得完全可以用GridView来实现,就趁着空闲,自己也就尝试写了一下。
这是我是实现的效果
这是我自定义的AlmightyGridView——万能的GridView,哈哈有点夸大了,但我以后会努力更加完善它的。
public class AlmightyGridView extends GridView { private boolean isShowBottomLine=false; //是否显示底部线 private boolean isShowMoreLine=false; //是否显示空白View的线 private int transverseLineColor =0; //横线的颜色 private int verticaLineColor =0; //竖线的颜色 private int transverseLineWidth; //横线宽度 private int verticaLineWidth; //竖线宽度 public AlmightyGridView(Context context) { this(context, null); } public AlmightyGridView(Context context, AttributeSet attrs) { this(context, attrs,0); } public AlmightyGridView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); TypedArray a = context.getTheme().obtainStyledAttributes(attrs, R.styleable.AlmightyGridView, defStyle, 0); int n = a.getIndexCount(); for (int i = 0; i < n; i++) { int attr = a.getIndex(i); switch (attr) { case R.styleable.AlmightyGridView_isShowBottomLine: isShowBottomLine = a.getBoolean(attr,false); break; case R.styleable.AlmightyGridView_isShowMoreLine: isShowMoreLine = a.getBoolean(attr,false); break; case R.styleable.AlmightyGridView_transverseLineColor: transverseLineColor = a.getColor(attr, Color.GRAY); break; case R.styleable.AlmightyGridView_verticaLineColor: verticaLineColor = a.getColor(attr,Color.GREEN); break; case R.styleable.AlmightyGridView_transverseLineWidth: transverseLineWidth = a.getDimensionPixelSize(attr, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 2, getResources().getDisplayMetrics())); break; case R.styleable.AlmightyGridView_verticaLineWidth: verticaLineWidth = a.getDimensionPixelSize(attr, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 2, getResources().getDisplayMetrics())); break; } } a.recycle(); //如果布局中没有设置transverseLineColor和verticaLineColor的时候给他一个默认值 if (transverseLineColor==0){ transverseLineColor=Color.BLACK; } if (verticaLineColor==0){ verticaLineColor=Color.BLACK; } //如果布局中没有设置transverseLineWidth和verticaLineWidth的时候给他一个默认值 if (transverseLineWidth==0){ transverseLineWidth=2; } if (verticaLineWidth==0){ verticaLineWidth=2; } } protected void dispatchDraw(Canvas canvas) { super.dispatchDraw(canvas); if(getChildAt(0)!=null){ View localView1 = getChildAt(0); int column = getWidth() / localView1.getWidth(); int childCount = getChildCount(); int row=0; if(childCount%column==0){ row=childCount/column; }else{ row=childCount/column+1; } int endAllcolumn=(row-1)*column; Paint localPaint,localPaint2; localPaint = new Paint(); //画竖线的笔 localPaint2=new Paint(); //划横线的笔 localPaint.setStyle(Paint.Style.STROKE); localPaint2.setStyle(Paint.Style.STROKE); localPaint.setStrokeWidth(verticaLineWidth); localPaint2.setStrokeWidth(transverseLineWidth); localPaint.setColor(verticaLineColor); localPaint2.setColor(transverseLineColor); for(int i = 0;i < childCount;i++){ View cellView = getChildAt(i); if((i + 1) % column != 0){ canvas.drawLine(cellView.getRight()+1, cellView.getTop(), cellView.getRight()+1, cellView.getBottom()-transverseLineWidth/2, localPaint); } if (isShowBottomLine) { canvas.drawLine(cellView.getLeft(), cellView.getBottom()-(transverseLineWidth/2), cellView.getRight(), cellView.getBottom()-(transverseLineWidth/2), localPaint2); }else { if((i+1)<=endAllcolumn){ //canvas.drawLine(cellView.getLeft(), cellView.getBottom(), cellView.getRight(), cellView.getBottom(), localPaint); canvas.drawLine(cellView.getLeft(), cellView.getBottom()-(transverseLineWidth/2), cellView.getRight(), cellView.getBottom()-(transverseLineWidth/2), localPaint2); } } } if (isShowMoreLine) { if(childCount % column != 0){ for(int j = 0 ;j < (column-childCount % column) ; j++){ View lastView = getChildAt(childCount - 1); canvas.drawLine(lastView.getRight() + lastView.getWidth() * j+1, lastView.getTop(), lastView.getRight() + lastView.getWidth()* j+1, lastView.getBottom()-transverseLineWidth/2, localPaint); } if (isShowBottomLine) { for(int j = 0 ;j <= (column-childCount % column) ; j++){ View lastView = getChildAt(childCount - 1); canvas.drawLine(lastView.getLeft() + lastView.getWidth() * j+1, lastView.getBottom()-(transverseLineWidth/2), lastView.getRight() + lastView.getWidth()* j+1, lastView.getBottom()-(transverseLineWidth/2), localPaint2); } } } } } } }
这是默认实现的效果,不显示底部线,不显示空白内容线
这是显示空白内容线效果
这是既现实空白线又显示底部线效果
至于颜色效果你们就自己测试吧。对了千万别忘了这个事,就是你的横线设置宽度的时候,一定记得在GridView的条目布局itemLayout布局中使用这个参数,大小等于你设置的横线的宽度就好
android:layout_marginBottom="10dp"因为横线我是在网格内部画的,如果不设置这个参数,线条会把内容遮挡住。
看完了,觉得有用的话,别忘了帮我点个赞!!欢迎大家提出宝贵意见,我们一起成长!