这一次给大家带来的依旧是最简单的页面效果图--Android仿支付宝首页GridView的网格效果-不能够换位置
原理也很简单,就是gridview有一个背景颜色,也就是你所看见的分割线的颜色,然后还有一个就是每一个子布局的颜色,然后再给GridView设置几个属性,就是它的上下Pandding和中间的行边距和列边距就OK了。
根据数量的不同添加一个虚拟的数据,然后显示相对应的数量就行了。
直接看效果图吧,就不多说了
因为是一个GridView,所以首先有item的布局页面
item_gridview.xml
这里有一个<?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:layout_height="match_parent"> <LinearLayout android:id="@+id/item_linear" android:layout_width="100dp" android:layout_height="100dp" android:orientation="vertical" android:gravity="center" android:background="@color/white"> <ImageView android:id="@+id/item_image" android:layout_width="50dp" android:layout_height="50dp"/> <TextView android:id="@+id/item_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="5dp"/> </LinearLayout> </LinearLayout>
所以在color里面添加了两个颜色,一个是布局的背景颜色,一个是分割线的颜色android:background="@color/white"
然后便是主页面的布局文件<color name="white">#FFFFFF</color> <color name="hui">#999999</color>
activity_main.java
<?xml version="1.0" encoding="utf-8"?> <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="match_parent" tools:context="gulubaobao.com.mygridviewdemo.MainActivity"> <GridView android:paddingTop="1dp" android:paddingBottom="1dp" android:id="@+id/main_grid" android:layout_width="match_parent" android:layout_height="wrap_content" android:numColumns="4" android:background="@color/hui" android:horizontalSpacing="1dp" android:verticalSpacing="1dp"/> </LinearLayout>
最后便是主要的代码了MainActivity.java
也没有什么好说的,毕竟只是最简单的静态页面,大家看看就好,如果对你有所帮助,请给个赞!import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.BaseAdapter; import android.widget.GridView; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.TextView; import org.w3c.dom.Text; import java.util.ArrayList; public class MainActivity extends AppCompatActivity { //定义控件 public GridView gridView; public int width; public LinearLayout.LayoutParams layoutParams; //list的实际数量 public int sum = 8; //list的虚拟数量 public int sums; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); gridView = (GridView) findViewById(R.id.main_grid); width = getWindowManager().getDefaultDisplay().getWidth(); switch (sum%4){ case 0: sums = sum; break; case 1: sums = sum+3; break; case 2: sums = sum+2; break; case 3: sums = sum+1; break; } gridView.setAdapter(new MyAdapter()); } class Handler{ public LinearLayout linearLayout; public ImageView imageView; public TextView textView; } class MyAdapter extends BaseAdapter { @Override public int getCount() { return sums; } @Override public Object getItem(int position) { return sums; } @Override public long getItemId(int position) { return sums; } @Override public View getView(int position, View convertView, ViewGroup parent) { Handler handler; if (convertView==null){ convertView = LayoutInflater.from(MainActivity.this).inflate(R.layout.item_gridview,null); handler = new Handler(); handler.linearLayout = (LinearLayout) convertView.findViewById(R.id.item_linear); handler.imageView = (ImageView) convertView.findViewById(R.id.item_image); handler.textView = (TextView) convertView.findViewById(R.id.item_text); convertView.setTag(handler); } handler = (Handler) convertView.getTag(); layoutParams = (LinearLayout.LayoutParams) handler.linearLayout.getLayoutParams(); int w = (width-3)/4; layoutParams.width = w; layoutParams.height = w; handler.linearLayout.setLayoutParams(layoutParams); if(position<sum){ handler.imageView.setImageResource(R.mipmap.ic_launcher); handler.textView.setText("项目"); } return convertView; } } }
源码下载地址Android仿支付宝首页GridView的网格效果-不能够换位置,下载需要一分,所以大家还是看代码吧!