关注finddreams:http://blog.csdn.net/finddreams/article/details/43486527 实现Android控件GridView之仿支付宝钱包首页带有分割线的GridView九宫格
熟悉listview的小伙伴应该都知道为ListView设置每一行的分割线多简单,直接在xml布局文件中加入一句话android:divider = “”和android:dividerHeigh = “”t即可,但是同样需要适配器来实现的GridView想要为每一个item设置分割线(类似九宫格效果)就没那么简单了,先上图看看是否是效果是否是大家想要的,再决定是否继续往下读
因为我这个GridView是作为ListView头部来使用的,所以使用普通的GridView控件和ListView会产生冲突,导致GridView只显示首行这样显示不完整的情况发生,所以先自定义一个MyGridView嵌套到listview头部去(如果此处是嵌套到ScrollView中也同样处理)
public class MyGridView extends GridView
{
public MyGridView(Context context, AttributeSet attrs)
{
super(context, attrs);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
heightMeasureSpec = MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2, MeasureSpec.AT_MOST);
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
}
然后设置mainactivity的布局代码
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<com.example.util.MyGridView
android:id="@+id/financial_head_gridView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:numColumns="4"
android:scrollbars="none" >
</com.example.util.MyGridView>
</RelativeLayout>
设置gridview行布局的代码
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:fresco="http://schemas.android.com/apk/res-auto"
android:id="@+id/homepage_category_item_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="0dp" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerInParent="true"
android:background="@drawable/bg_gv"
android:padding="8dp" >
<ImageView
android:id="@+id/financail_item_imageView"
android:layout_width="32dp"
android:layout_height="23.5dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="11dp"
android:src="@drawable/logo" />
<TextView
android:id="@+id/financail_item_textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/financail_item_imageView"
android:layout_centerHorizontal="true"
android:layout_marginTop="11dp"
android:textColor="#666"
android:textSize="14sp" />
</RelativeLayout>
</RelativeLayout>
设置相关的drawable背景文件
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"><shape android:shape="rectangle">
<stroke android:width="1.0px" android:color="@color/line" />
<gradient android:angle="270.0" android:endColor="#ffe8ecef" android:startColor="#ffe8ecef" />
</shape></item>
<item android:state_focused="true"><shape android:shape="rectangle">
<gradient android:angle="270.0" android:endColor="#ffe8ecef" android:startColor="#ffe8ecef" />
<stroke android:width="1.0px" android:color="@color/line" />
</shape></item>
<item><shape android:shape="rectangle">
<gradient android:angle="270.0" android:endColor="#ffffffff" android:startColor="#ffffffff" />
<stroke android:width="1.0px" android:color="@color/line" />
</shape></item>
</selector>
最后在MainActivity.java中查找gridview控件和设置适配器等,并添加行数据和图片即可
class GrideviewAdater extends BaseAdapter
{
@Override
public int getCount()
{
return mTwoData.size();
}
@Override
public Object getItem(int position)
{
return null;
}
@Override
public long getItemId(int position)
{
return 0;
}
@Override
public View getView(int position, View convertView, ViewGroup parent)
{
View layout = null;
ViewHolder holder = null;
if (convertView == null)
{
holder = new ViewHolder();
layout = getLayoutInflater().inflate(R.layout.list_item_geridview_financlal, null);
holder.financail_item_textView = (TextView) layout.findViewById(R.id.financail_item_textView);
holder.financail_item_imageView = (ImageView) layout.findViewById(R.id.financail_item_imageView);
// 非空的view 设置标签 口袋
layout.setTag(holder);
} else
{
layout = convertView;// convertView 不为空 复用消失的行数
holder = (ViewHolder) layout.getTag();// 得到标签 口袋
}
HomeBnnerTwoData homeBnnerTwoData = mTwoData.get(position);
holder.financail_item_textView.setText(homeBnnerTwoData.getTitle());
holder.financail_item_imageView.setImageResource(homeBnnerTwoData.getImg());
return layout;
}
}
引用时为listview添加头部(此处省略关于listview数据和适配器的基本代码,相信小伙伴们都会懂~)
head_two_gridview = getLayoutInflater().inflate(R.layout.head_financial_two_gridview, null);
mGridView = (MyGridView) head_two_gridview.findViewById(R.id.financial_head_gridView);
mainListView.addHeaderView(head_two_gridview, null, false);
grideviewAdater = new GrideviewAdater();
mGridView.setAdapter(grideviewAdater);