Android抽屉效果之PopupWindow
之前一直使用SlidingDrawer抽屉效果，不过在整体布局中显示起来，总有点不舒服的感觉
现在终于有空了，用PopupWindow实现底部抽屉，让我们先看截图
好了，如果效果图不是各位想要的，就不用浪费时间看代码了
下面是项目的目录结构
整体文件也不多，3个布局文件、N个图片文件、其实一个Java类就可以，不过写的分开点，让大家看的清楚
我们先从布局文件看起：
activity_main.xml:
<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/body_background" >
<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="@drawable/bottom_handler" />
</RelativeLayout>
activity_popup.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<Button
android:id="@+id/content_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/bottom_handler" />
<GridView
android:id="@+id/content_grid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/bottom_background"
android:columnWidth="90dp"
android:gravity="center"
android:horizontalSpacing="10dp"
android:numColumns="auto_fit"
android:paddingTop="5dp"
android:stretchMode="columnWidth"
android:verticalSpacing="20dp" />
</LinearLayout>
gridview_img_text.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical" >
<ImageView
android:id="@+id/item_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="@+id/item_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="#FFF" />
</LinearLayout>
然后看MainActivity.java：
/**
* 使用PopupWindow实现抽屉效果
* @author Francis-ChinaFeng
* @version 1.0 2014-02-17
*/
public class MainActivity extends Activity {
private Button button;
private PopupWindow popupWindow;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
init();
setListener();
}
private void init() {
button = (Button) findViewById(R.id.button);
}
private void setListener() {
button.setOnClickListener(new ButtonClickListener());
}
private void showBottomMenu(View v) {
View view = getLayoutInflater().inflate(R.layout.activity_popup, null);
Button contentButton = (Button) view.findViewById(R.id.content_button);
GridView contentGridView = (GridView) view.findViewById(R.id.content_grid);
setGridViewNumColumns(contentGridView, 4);
int[] items = {
R.drawable.button_audio,
R.drawable.button_camera,
R.drawable.button_query,
R.drawable.button_video
};
String[] titles = {
"录音", "拍照", "查询", "视频"
};
final List<GridViewItem> data = new ArrayList<GridViewItem>();
for (int i = 0; i < items.length; i++) {
GridViewItem entity = new GridViewItem(items[i], titles[i]);
data.add(entity);
}
GridViewAdapter adapter = new GridViewAdapter(data, getLayoutInflater());
contentGridView.setAdapter(adapter);
// boolean参数设置PopupWindow中的元素是否可以操作
popupWindow = new PopupWindow(view, LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT, true);
// 该设置解决PopupWindow各种不可思议Bug……
popupWindow.setBackgroundDrawable(new BitmapDrawable());
popupWindow.setOutsideTouchable(true);
popupWindow.showAtLocation(v, Gravity.BOTTOM, 0, 0);
contentGridView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> adapterView, View v, int position,
long id) {
GridViewItem entity = data.get(position);
System.out.println(entity);
Toast.makeText(MainActivity.this, entity.toString(), Toast.LENGTH_LONG).show();
}
});
contentButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
dismissBottomMenu();
}
});
}
private void dismissBottomMenu() {
if (popupWindow != null && popupWindow.isShowing()) {
popupWindow.dismiss();
popupWindow = null;
}
}
// 点击其他区域，隐藏PopupWindow内容
@Override
public boolean onTouchEvent(MotionEvent event) {
dismissBottomMenu();
return super.onTouchEvent(event);
}
@Override
protected void onDestroy() {
dismissBottomMenu();
super.onDestroy();
}
private class ButtonClickListener implements OnClickListener {
@Override
public void onClick(View v) {
showBottomMenu(v);
}
}
/**
* 获取屏幕宽度
* @return
*/
public int getWidth() {
WindowManager wManager = (WindowManager) getSystemService(Context.WINDOW_SERVICE);
DisplayMetrics outMetrics = new DisplayMetrics();
wManager.getDefaultDisplay().getMetrics(outMetrics);
return outMetrics.widthPixels;
}
/**
* 设置GridView中item的宽度
* @param v
* @param numColumns
*/
public void setGridViewNumColumns(View v, int numColumns) {
GridView view = (GridView) v;
int columnWidth = getWidth() / ++numColumns;
view.setColumnWidth(columnWidth);
}
}
GridViewItem.java：
/**
*
* @author Francis-ChinaFeng
* @version 1.0 2014-2-17
*/
public class GridViewItem {
private int item_img;
private String item_text;
public GridViewItem(int item_img, String item_text) {
super();
this.item_img = item_img;
this.item_text = item_text;
}
@Override
public String toString() {
return "GridViewItem [item_img=" + item_img + ", item_text="
+ item_text + "]";
}
public int getItem_img() {
return item_img;
}
public void setItem_img(int item_img) {
this.item_img = item_img;
}
public String getItem_text() {
return item_text;
}
public void setItem_text(String item_text) {
this.item_text = item_text;
}
}
GridViewAdapter：
/**
*
* @author Francis-ChinaFeng
* @version 1.0 2014-2-17
*/
public class GridViewAdapter extends BaseAdapter {
private List<GridViewItem> data;
private LayoutInflater inflater;
public GridViewAdapter(List<GridViewItem> data, LayoutInflater inflater) {
this.data = data;
this.inflater = inflater;
}
@Override
public int getCount() {
return data != null ? data.size() : 0;
}
@Override
public Object getItem(int position) {
return data != null ? data.get(position) : null;
}
@Override
public long getItemId(int position) {
return data.size() > position && position > 0 ? position : 0;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
Holder holder;
if (convertView == null) {
convertView = inflater.inflate(R.layout.gridview_img_text, null);
holder = new Holder();
holder.item_img = (ImageView) convertView.findViewById(R.id.item_img);
holder.item_text = (TextView) convertView.findViewById(R.id.item_text);
convertView.setTag(holder);
} else {
holder = (Holder) convertView.getTag();
}
holder.item_img.setBackgroundResource(data.get(position).getItem_img());
holder.item_text.setText(data.get(position).getItem_text());
return convertView;
}
private class Holder {
private ImageView item_img;
private TextView item_text;
}
}