Android的GridView控件（二）

在上一篇Android的GridView控件中我們實現了GridView的簡單功能。接下來我們實現下面的效果：

點擊每個item右上角的小框框之後：

public class OrderClient2 extends Activity{
	TabHost tabHost;
	String[] dishType=new String[]{"tab1","tab2","tab3","tab4","tab5","tab6","tab7"};
	GridView gridView;
	
	String[] dishName=new String[]{"1","2","3","4","5","6","7","8","9","10","11","12","1"};
	//這個路徑是手機的sdcard，不是外接的sdcard
	String picPath=Environment.getExternalStorageDirectory().getPath() + "/picture/";
	
	GridViewAdapter gridViewAdapter;
	
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        // 獲取TabHost對象
		TabHost tabHost = (TabHost) findViewById(R.id.tabhost);
		// 如果沒有繼承TabActivity時，通過該種方法加載啓動tabHost
		tabHost.setup();
        
		gridView=(GridView)findViewById(R.id.view1);
		gridViewAdapter=new GridViewAdapter(this);
		gridView.setAdapter(gridViewAdapter);
		gridView.setOnItemClickListener(new GridViewAdapterListener());
		
		for(int i=0;i<dishType.length;i++){
			TabHost.TabSpec tabSpec=tabHost.newTabSpec(dishType[i]);
			tabSpec.setIndicator(dishType[i],getResources().getDrawable(R.drawable.ic_launcher));
		    tabSpec.setContent(R.id.view1);
			tabHost.addTab(tabSpec);
		}
		
		tabHost.setCurrentTab(1);
		tabHost.setCurrentTab(0);
		
		new AsyncLoadImage().execute(100);
    }
    
    class GridViewAdapterListener implements OnItemClickListener{

		@Override
		public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
				long arg3) {
			// TODO Auto-generated method stub
			Log.i("選擇的圖片", arg2+"");
			//GridViewItem item=(GridViewItem) gridView.getItemAtPosition(arg2);
			Toast.makeText(getApplicationContext(), "click item", 500).show();
			//item.ifSelect.setBackgroundResource(R.drawable.selected);
		}
    	
    }
    class AsyncLoadImage extends AsyncTask<Object, Bitmap, Object>{

		@Override
		protected Object doInBackground(Object... params) {
			Bitmap bitmap;
			
			Log.i("加載線程", "");
			
			// TODO Auto-generated method stub
			for(int i=0;i<dishName.length;i++){
				Log.i("圖片路徑", picPath + dishName[i] + ".jpg");
				bitmap=BitmapFactory.decodeFile(picPath + dishName[i] + ".jpg");
				
				if(bitmap != null){
					bitmap=Bitmap.createScaledBitmap(bitmap, 500, 350, true);
					publishProgress(bitmap);
					Log.i("圖片解析", "正確");
				}
				else
					Log.i("圖片解析", "錯誤");
			}
			return null;
		}

		@Override
		protected void onProgressUpdate(Bitmap... values) {
			// TODO Auto-generated method stub
			for(Bitmap b : values){
				gridViewAdapter.addPic(b);
				gridViewAdapter.notifyDataSetChanged();
			}
		}
 	
		
    }
    class GridViewAdapter extends BaseAdapter{

    	Context context;
    	private LayoutInflater inflater;   	
    	private ArrayList<Bitmap> picList=new ArrayList<Bitmap>();
    	
    	GridViewAdapter(Context context){
    		this.context=context;
    		inflater=LayoutInflater.from(context);
    	}
    	
		@Override
		public int getCount() {
			// TODO Auto-generated method stub
			return picList.size();
		}

		@Override
		public Object getItem(int position) {
			// TODO Auto-generated method stub
			return picList.get(position);
		}

		@Override
		public long getItemId(int position) {
			// TODO Auto-generated method stub
			return position;
		}

		public void addPic(Bitmap bitmap){
			picList.add(bitmap);
		}
		
		@Override
		public View getView(int position, View convertView, ViewGroup parent) {
			// TODO Auto-generated method stub
			Log.i("得到view", position + "");
			
			GridViewItem gridViewItem;
			
			if(convertView == null){
				convertView=inflater.inflate(R.layout.gridviewitem, null);
				gridViewItem=new GridViewItem();
				gridViewItem.dishPic=(ImageView)convertView.findViewById(R.id.dishPic);
				gridViewItem.ifSelect=(Button)convertView.findViewById(R.id.ifSelect);
				gridViewItem.dishName=(TextView)convertView.findViewById(R.id.dishName);
				convertView.setTag(gridViewItem);
				
			}
			else{
				gridViewItem=(GridViewItem)convertView.getTag();
			}
			
			gridViewItem.dishPic.setImageBitmap(picList.get(position));
			gridViewItem.dishName.setText(dishName[position]);

			gridViewItem.ifSelect.setTag(false);
			gridViewItem.ifSelect.setOnClickListener(new SelectListener());
			return convertView;
		}
    	
    }
    
    class SelectListener implements OnClickListener{

		@Override
		public void onClick(View v) {
			// TODO Auto-generated method stub
			// TODO Auto-generated method stub
			
			if((Boolean) v.getTag()){
				((Button)v).setBackgroundResource(R.drawable.unselected);
				((Button)v).setTag(false);
			}
			else{
				((Button)v).setBackgroundResource(R.drawable.selected);
				((Button)v).setTag(true);
			}
			//Toast.makeText(getApplicationContext(), "click me", 500).show();
			//gridViewAdapter.notifyDataSetChanged();
		}
    	
    }
    class GridViewItem{
    	public ImageView dishPic;
    	public Button ifSelect;
    	public TextView dishName;
    }
    
}

兩個佈局文件：

main.xml,

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
	android:id="@+id/hometabs"
	android:orientation="vertical"
    android:layout_width="fill_parent"  
    android:layout_height="fill_parent">
    <!-- TabHost必須包含一個 TabWidget和一個FrameLayout--> 
    <TabHost android:id="@+id/tabhost"
     	android:layout_width="fill_parent"
     	android:layout_height="wrap_content"
     	android:layout_weight="1">
     	<LinearLayout
			android:orientation="vertical"
			android:layout_width="fill_parent"
			android:layout_height="fill_parent">
			<HorizontalScrollView
			    android:layout_width="fill_parent"
			    android:layout_height="wrap_content"
			    android:scrollbars="none">
			    <!-- TabWidget的id屬性必須爲 @android:id/tabs-->			
	     	  	<TabWidget android:id="@android:id/tabs" 
		      	android:orientation="horizontal"
		      	android:layout_width="fill_parent"
		      	android:layout_height="wrap_content">
	        	</TabWidget>
			</HorizontalScrollView>
			
	     	<!-- FrameLayout的id屬性必須爲 @android:id/tabcontent-->
		     <FrameLayout 
		          android:id="@android:id/tabcontent"
			      android:layout_width="fill_parent"
			      android:layout_height="fill_parent">
			      
			      <GridView 
			          android:id="@+id/view1"
			          android:listSelector="#000000"
			          android:layout_width="fill_parent"
			          android:layout_height="wrap_content"
			          android:padding="0dip"
			          android:layout_margin="0dip"
			          android:numColumns="2"
			          android:horizontalSpacing="3dip"
			          android:verticalSpacing="3dip"
			          android:stretchMode="columnWidth"
			          android:gravity="fill"/>"
			    	
		     </FrameLayout>
	     
	     </LinearLayout>
    </TabHost>
    <LinearLayout 
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content">
        <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hha"/>
        <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hha2"/>
        <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hha3"/>
    </LinearLayout>
    
</LinearLayout>

gridViewItem,xml:單個item 的佈局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
        <ImageView
            android:id="@+id/dishPic"
            android:adjustViewBounds="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:scaleType="fitXY"/>
        <Button
            android:id="@+id/ifSelect"
            android:background="@drawable/unselected"
            android:focusable="false"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignTop="@id/dishPic"
            android:layout_alignRight="@id/dishPic"/>
        <TextView 
	    android:id="@+id/dishName"
	    android:layout_width="wrap_content"
	    android:layout_height="wrap_content"
	    android:layout_below="@id/dishPic"
	    android:layout_alignLeft="@id/dishPic"
	    android:layout_alignRight="@id/dishPic"
	    android:background="#555555"/>
</RelativeLayout>