android点击切换视图,android列表视图切换：GridView和ListView两种方式来显示一个列表...

在安卓应用中，很多带有列表的界面都提供了两种显示方式，单列显示和平铺显示，比如文件管理器，其实这两种视觉效果分别是用listview和GridView来实现的。这篇文章将讨论如何正确的实现两种视图的切换效果。

对于一个界面，如果需要设计GridView和ListView两种方式来显示一个列表,可以共用一个Adapter和一个布局来实现，这样既可以避免冗余的代码，也使整个处理过程变得更加简单。

1.首先，如下所示，将GridView和ListView布局到同一个页面中；<?xml version="1.0" encoding="utf-8"?>

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:orientation="vertical">

android:id="@+id/app_title"

android:layout_width="fill_parent"

android:layout_height="44dip"

android:text="@string/main_service_title"

android:gravity ="center"

android:textSize="27px"

android:textColor="#ffffff"

android:background ="@drawable/title_bar"/>

android:id="@+id/app_grid"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1"

android:padding="10dp"

android:verticalSpacing="10dp"

android:horizontalSpacing="10dp"

android:numColumns="4"

android:columnWidth="60dp"

android:stretchMode="columnWidth"

android:gravity="center"/>

android:id="@+id/app_list"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1"

android:divider="@drawable/divider"/>

2.使用同一个adapter填充数据：public class ServiceZoneAdapter extends BaseAdapter

{

/**

* Get view from xml layout.

*/

private LayoutInflater mInflater = null;

/**

* A list to encapsulate servcie information.

*/

private List mServiceBeans = null;

public ServiceZoneAdapter(Context c, List serviceBeans)

{

mServiceBeans = serviceBeans;

mInflater = (LayoutInflater)c.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

}

/**

* Get list's size.

*

* @return the size of list.

*/

public int getCount()

{

return mServiceBeans == null ? 0 : mServiceBeans.size();

}

/**

* Get item.

*

* @param position

* @return the item according to the position.

*/

public Object getItem(int position)

{

return mServiceBeans == null ? null : mServiceBeans.get(position);

}

/**

* Get id.

*

* @param position

* @return the item's id according to the position.

*/

public long getItemId(int position)

{

return position;

}

/**

* Get item's view.

*

* @return the item view according to the position.

*/

public View getView(int position, View convertView, ViewGroup parent)

{

if (convertView == null)

{

if (ServiceZone.isGridView)

{

convertView = mInflater.inflate(R.layout.each_app_grid_layout, parent, false);

}

else

{

convertView = mInflater.inflate(R.layout.each_app_list_layout, parent, false);

}

}

ServiceBean service = (ServiceBean)getItem(position);

if (service == null)

{

return convertView;

}

ImageView imageView = (ImageView)convertView.findViewById(R.id.app_icon);

TextView text = (TextView)convertView.findViewById(R.id.app_name);

imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);

imageView.setImageResource(service.getIconId());

text.setText(service.getName());

return convertView;

}

}

3.其次，在acticity中获取相应的对象，同时设定一个标签，用于标记当前是需要用GridView或ListView中哪种方式显示；然后将数据填充到相应的View中。代码如下：

public static Boolean isGridView = true;

/**

* Update the layout.

*/

private void updateLayout()

{

if (isGridView)

{

if (mGridView == null)

{

mGridView = (GridView)findViewById(R.id.app_grid);

}

mGridView.setVisibility(View.VISIBLE);

mGridView.setAdapter(new ServiceZoneAdapter(ServiceZone.this, mService));

mGridView.setOnItemClickListener(this);

mListView.setVisibility(View.GONE);

if (mSelectionPosition < 0)

{

mSelectionPosition = 0;

}

mGridView.setSelection(mSelectionPosition);

}

else

{

if (mListView == null)

{

mListView = (ListView)findViewById(R.id.app_list);

}

mListView.setVisibility(View.VISIBLE);

mListView.setAdapter(new ServiceZoneAdapter(ServiceZone.this, mService));

mListView.setOnItemClickListener(this);

mGridView.setVisibility(View.GONE);

if (mSelectionPosition < 0)

{

mSelectionPosition = 0;

}

mListView.setSelection(mSelectionPosition);

}

}

4.通过控制isGridView标签来控制页面的显示。/**

* Update ui to be the selected style.

*/

@Override

public boolean onOptionsItemSelected(MenuItem item)

{

if (item.getItemId() == R.id.menu_change)

{

isGridView = !isGridView;

updateLayout();

}

return super.onOptionsItemSelected(item);

}