Android中GridView以表格形式顯示多張圖片(仿桌面)
阿新 • • 發佈:2019-01-24
GridView可以理解為顯示多列的ListView,這次就利用GridView做一個仿桌面的案例。GridView和ListView的使用相同,都基本使用以下三步走:設定資料來源,設定介面卡,設定監聽器。
Demo展示圖片
佈局程式碼
//(layout)activity_main.xml
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#000"
tools:context="com.test.gridview.MainActivity">
<GridView
android:id="@+id/gridView"
android:numColumns="3"
android:layout_marginTop ="20dp"
android:horizontalSpacing="30dp"
android:verticalSpacing="30dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<!--注 numColumns 表示GridView的列數
horizontalSpacing 表示水平間距
verticalSpacing 表示垂直間距
-->
</LinearLayout>
-------------------------------------------------------------------
//(layout)gridview_item.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000"
android:gravity="center">
<ImageView
android:id="@+id/image"
android:src="@mipmap/address_book"
android:layout_width="60dp"
android:layout_height="60dp"/>
<TextView
android:id="@+id/text"
android:layout_marginTop="6dp"
android:text="文字"
android:textColor="#fff"
android:layout_centerHorizontal="true"
android:layout_below="@+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
Activity程式碼
//MainActivity
import android.content.Context;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.AdapterView;
import android.widget.GridView;
import android.widget.SimpleAdapter;
import android.widget.Toast;
import java.util.HashMap;
import java.util.LinkedList;
import java.util.List;
import java.util.Map;
public class MainActivity extends AppCompatActivity {
private Context mContext = MainActivity.this;
private GridView mGridView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initData();
}
private void initView(){
mGridView = (GridView) findViewById(R.id.gridView);
}
private void initData(){
List<Map<String , Object>> list = new LinkedList<>();
int[] icon = {R.mipmap.address_book , R.mipmap.calendar , R.mipmap.camera , R.mipmap.clock , R.mipmap.games_control , R.mipmap.messenger
, R.mipmap.ringtone , R.mipmap.settings , R.mipmap.speech_balloon , R.mipmap.weather , R.mipmap.world , R.mipmap.youtube};
final String[] iconName ={"通訊錄" , "日曆" , "照相機" , "時鐘" , "遊戲" , "簡訊" , "鈴聲" , "設定" , "語音" , "天氣" , "瀏覽器" , "視訊"};
// 在for迴圈裡填充資料
for(int i = 0 ; i < icon.length ;i++){
Map<String , Object> map = new HashMap<>();
map.put("image" , icon[i]);
map.put("text" , iconName[i]);
list.add(map);
}
SimpleAdapter adapter = new SimpleAdapter(this, list , R.layout.gridview_item ,
new String[]{"image" , "text"} , new int[]{R.id.image , R.id.text});
mGridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> adapterView, View view, int position, long id) {
Toast.makeText(mContext , "正在進入" + iconName[position] + "應用" , Toast.LENGTH_SHORT).show();
}
});
mGridView.setAdapter(adapter);
}
}