PopupWindow仿微信浮層彈出框效果
最近公司項目需要實現(xiàn)類似微信的浮層彈出框。研究發(fā)現(xiàn)是用PopupWindow實現(xiàn)的。而且可以自定義位置以及出現(xiàn)和退出時的動畫,由于太晚了就不實現(xiàn)動畫了,需要得同學(xué)請自己研究下。由于本人新手其中的不足和缺點請見諒。
代碼如下:
首先是定義頂部按鈕的main.xml文件
<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" android:id="@+id/main" android:orientation="vertical" tools:context=".MainActivity" android:background="@color/white" > <RelativeLayout android:id="@+id/rl_action_bar" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="center" android:padding="10dip" android:background="@color/gold" > <Button android:id="@+id/more" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_marginRight="10dip" android:background="@drawable/more" /> <Button android:id="@+id/add" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="20dip" android:layout_toLeftOf="@+id/more" android:background="@drawable/add" /> <Button android:id="@+id/search" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="20dip" android:layout_toLeftOf="@+id/add" android:background="@drawable/search" /> </RelativeLayout> </LinearLayout>
其次是定義彈出框PopupWindow的popupwindow_dialog.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:background="@drawable/click" android:cacheColorHint="#00000000" android:orientation="vertical" > <ListView android:id="@+id/lv_dialog" android:layout_width="match_parent" android:layout_height="match_parent" android:cacheColorHint="#00000000" android:listSelector="@drawable/grouplist_item_bg_normal" > </ListView> </LinearLayout>
接著是每一個彈出框顯示的文字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:orientation="vertical" > <TextView android:id="@+id/tv_text" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="10dip" android:padding="5dp" android:textSize="20sp" /> </LinearLayout>
最后是主界面的MainActivity.java
package com.bn.weixindemo;
import android.app.Activity;
import android.graphics.drawable.BitmapDrawable;
import android.os.Bundle;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.PopupWindow;
import android.widget.Toast;
import android.widget.AdapterView.OnItemClickListener;
/**
*
*@title 標(biāo)題
*@description 仿微信頂部彈出框的popuwindow
*@author zhengxiaolin
*@version 1.0
*@created 2014-5-23 上午12:11:11
*@changeRecord [修改記錄]<br />
*/
public class MainActivity extends Activity implements OnClickListener{
private Button mBtnMore,mBtnAdd,mBtnSearch;
private PopupWindow popupWindow;
private LinearLayout layout;
private ListView listView;
private String[] more = {"我的相冊","我的收藏","我的銀行卡","設(shè)置","意見反饋"};
private String[] add ={"發(fā)起群聊","添加朋友","視屏聊天","掃一掃","拍照分享"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
mBtnMore = (Button) findViewById(R.id.more);
mBtnAdd = (Button) findViewById(R.id.add);
mBtnSearch = (Button) findViewById(R.id.search);
setOnClickListener();
}
private void setOnClickListener() {
mBtnMore.setOnClickListener(this);
mBtnAdd.setOnClickListener(this);
mBtnSearch.setOnClickListener(this);
}
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
switch (v.getId()) {
case R.id.more:
mBtnMore.getTop();
int y = mBtnMore.getBottom() * 3 / 2;
int x = getWindowManager().getDefaultDisplay().getWidth();
showMorePopupWindow(x, y);
break;
case R.id.add:
mBtnAdd.getTop();
int y1 = mBtnAdd.getBottom() * 3 / 2;
int x1 = getWindowManager().getDefaultDisplay().getWidth();
showAddPopupWindow(x1, y1);
break;
case R.id.search:
Toast.makeText(getBaseContext(), "搜索", 1).show();
default:
break;
}
}
public void showMorePopupWindow(int x, int y) {
layout = (LinearLayout) LayoutInflater.from(MainActivity.this).inflate(
R.layout.popupwindow_dialog, null);
listView = (ListView) layout.findViewById(R.id.lv_dialog);
listView.setAdapter(new ArrayAdapter<String>(MainActivity.this,
R.layout.text, R.id.tv_text, more));
popupWindow = new PopupWindow(MainActivity.this);
popupWindow.setBackgroundDrawable(new BitmapDrawable());
popupWindow
.setWidth(getWindowManager().getDefaultDisplay().getWidth() / 2);
popupWindow.setHeight(420);
popupWindow.setOutsideTouchable(true);
popupWindow.setFocusable(true);
popupWindow.setContentView(layout);
popupWindow.showAtLocation(findViewById(R.id.main), Gravity.LEFT
| Gravity.TOP, x, y);//需要指定Gravity,默認情況是center.
listView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
long arg3) {
Toast.makeText(getBaseContext(), "您選擇了:"+more[arg2], 1).show();
popupWindow.dismiss();
popupWindow = null;
}
});
}
/**
* 點擊+時彈出的popuwindow
*/
public void showAddPopupWindow(int x, int y) {
layout = (LinearLayout) LayoutInflater.from(MainActivity.this).inflate(
R.layout.popupwindow_dialog, null);
listView = (ListView) layout.findViewById(R.id.lv_dialog);
listView.setAdapter(new ArrayAdapter<String>(MainActivity.this,
R.layout.text, R.id.tv_text, add));
popupWindow = new PopupWindow(MainActivity.this);
popupWindow.setBackgroundDrawable(new BitmapDrawable());
popupWindow
.setWidth(getWindowManager().getDefaultDisplay().getWidth() / 2);
popupWindow.setHeight(420);
popupWindow.setOutsideTouchable(true);
popupWindow.setFocusable(true);
popupWindow.setContentView(layout);
popupWindow.showAtLocation(findViewById(R.id.main), Gravity.LEFT
| Gravity.TOP, x, y);//需要指定Gravity,默認情況是center.
listView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
long arg3) {
Toast.makeText(getBaseContext(), "您選擇了:"+add[arg2], 1).show();
popupWindow.dismiss();
popupWindow = null;
}
});
}
}
好了,主要代碼就完成了,實現(xiàn)效果如下所示


由于本人沒有圖片,所以彈出框的背景圖沒有處理,彈出框中的每一項的前面也沒有添加圖片,有需要得同學(xué)可以自行添加。(效果已經(jīng)出來了,細節(jié)沒有調(diào)整,請大家見諒)
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Android使用ViewDragHelper實現(xiàn)仿QQ6.0側(cè)滑界面(一)
這篇文章主要介紹了Android使用ViewDragHelper實現(xiàn)仿QQ6.0側(cè)滑界面(一)的相關(guān)資料,需要的朋友可以參考下2016-02-02
Android中AlertDialog各種對話框的用法實例詳解
這篇文章主要介紹了Android中AlertDialog各種對話框的用法在項目開發(fā)中經(jīng)常用的到,本文給大家介紹的非常詳細,具有參考借鑒價值2016-04-04
如果你在Android Studio碰到gradle的各種問題就來看這篇文章吧(強烈建議收藏)
這篇文章主要介紹了你可能會在Android Studio碰到gradle的各種問題,完美解決關(guān)于gradle的全部問題,切記收藏以防需要的時候找不到了哦2021-08-08
Android實現(xiàn)鍵盤彈出界面上移的實現(xiàn)思路
這篇文章主要介紹了Android實現(xiàn)鍵盤彈出界面上移的實現(xiàn)思路,需要的朋友可以參考下2018-04-04
Android Flutter實現(xiàn)淘寶App的搜索推薦
這篇文章主要為大家詳細介紹了Android?Flutter如何模擬實現(xiàn)淘寶App的搜索推薦,文中的示例代碼講解詳細,具有一定的借鑒價值,感興趣的可以了解一下2023-07-07
Android入門之TableLayout應(yīng)用解析(二)
這篇文章主要介紹了Android入門之TableLayout應(yīng)用,需要的朋友可以參考下2014-08-08
Android開發(fā)仿IOS滑動開關(guān)實現(xiàn)代碼
這篇文章主要介紹了 android開發(fā)仿IOS滑動開關(guān)實現(xiàn)代碼的相關(guān)資料,需要的朋友可以參考下2017-05-05

