一.PopupWindow的基本概念
PopupWindow有點類似于Dialog,相同點在于都是彈出視窗,并且都可以對其進行自定義顯示,并且裡面的監聽元件,進行相應的操作,但它與Dialog又有很大的差別,PopupWindow隻是彈出視窗,不會使宿主Activity元件失去焦點,也就是說PopupWindow彈出後,你仍可以與宿主Activity進行互動,Dialog卻不能做到這一點。
二.PopupWindow的相關方法
(一)構造方法
PopupWindow有幾種構造方法,常用的為
1. public PopupWindow(Context context);
//給定一個上下文,當我們設定了setOutsideTouchable為true時,在觸摸到彈框外部後自動關閉。但是這個構造方法必須去指定顯示的布局,布局的寬高,焦點。
2. public PopupWindow(View contentView, int width, int height, boolean focusable)
//給定一個布局。寬,高和焦點,但是在了setOutsideTouchable為true時,觸摸到彈框外部也不能自動關閉,必須去指定背景,一般使用window.setBackgroundDrawable(new Co
lorDrawable(0x00000000))
(二)操作PopupWindow對象的常用方法
-
setOutsideTouchable(boolean);
//指定設定顯示PopuWindow之後在外面點選是否有效。
- setFocusable(boolean);//指定是否擷取焦點
- setBackgroundDrawable(new ColorDrawable(0));//沒有上下文時必須指定,否者setOutsideTouchable無效
-
showAsDropDown(anchor, 0, 0);//設定顯示PopupWindow的位置位于View的左下方,x,y表示坐标偏移量
5.showAtLocation(findViewById(R.id.parent), Gravity.LEFT, 0, -90);
//(以某個View為參考),表示彈出視窗以parent元件為參考,位于左側,偏移-90。
6.dismiss(); //關閉視窗
7.setOnDismissListenerd(new PopupWindow.OnDismissListener(){})
//設定視窗消失的監聽事件事件
三.PopupWindow示例
本程式顯示頁面的效果如下:
簡單說明:頁面布局設計一個RelativeLayout包裹EditText和ImageView,點選ImageView之後,顯示PopupWindow窗體,點選PopupWindow裡面的内容,對應的資料就會顯示在EditText上。
使用PopupWindow要加載一個View,這裡使用的是ListView,是以要建立擴充卡顯示清單資訊。
(一)布局檔案設計
1.activity_main.xml檔案設計
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
tools:context="com.lwz.popupwindow.MainActivity">
<RelativeLayout
android:id="@+id/main_rl"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="@drawable/back"
android:padding="5dp">
<EditText
android:id="@+id/main_et"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="@null"
android:hint="輸入号碼"
android:inputType="number" />
<ImageView
android:id="@+id/main_iv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:src="@mipmap/down_arrow" />
</RelativeLayout>
</RelativeLayout>
2.PopupWindow窗體的布局檔案item_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:gravity="center"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:src="@mipmap/user" />
<TextView
android:id="@+id/tv_phone"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="電話" />
<ImageView
android:id="@+id/iv_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:src="@mipmap/delete" />
</LinearLayout>
(二)java代碼設計
package com.lwz.popupwindow;
import android.graphics.Color;
import android.graphics.drawable.ColorDrawable;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.PopupWindow;
import android.widget.RelativeLayout;
import android.widget.TextView;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
//定義布局内的控件
ImageView imageView;
EditText editText;
RelativeLayout relativeLayout;
//定義資料源的集合
List<String> list = new ArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
//執行個體化資料
private void initView() {
//給資料源添加資料
for (int i = ; i < ; i++) {
list.add("12345345" + i);
}
//執行個體化資料
editText = (EditText) findViewById(R.id.main_et);
imageView = (ImageView) findViewById(R.id.main_iv);
relativeLayout = (RelativeLayout) findViewById(R.id.main_rl);
//給下拉的圖像設定監聽事件
imageView.setOnClickListener(this);
}
//定義一個PopupWindow對話框的對象
PopupWindow pw;
//點選下拉圖像的回調方法
@Override
public void onClick(View v) {
//顯示Popup對話框,需要傳入一個View對象
ListView listview = new ListView(this);
listview.setAdapter(adapter);
//建立PopupWIndow執行個體化對象
//第一個參數是代表View對象,這裡傳入一個清單的ListView對象
//第二個參數代表寬度,這裡的寬度是包裹EditText控件的相對布局的寬度
//第三個參數代表高度,
//第四個代表是否可以聚焦
pw = new PopupWindow(listview, relativeLayout.getWidth(), , true);
//設定點選外部後,Popup頁面消失
pw.setOutsideTouchable(true);
//設定背景顔色
pw.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
//設定PopupWindow的位置,并顯示PopupWindow頁面
//第一個參數代表PopupWindow在哪個控件的下方
//第二個參數代表PopupWindow在x軸上和對應控件的距離差
//第三個參數代表PopupWindow在y軸上和對應控件的距離差
pw.showAsDropDown(relativeLayout, , );
//給ListView設定監聽事件,這裡點選ListView的對應條目後把它的資料顯示在EditText上面
listview.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
editText.setText(list.get(position));
//關閉視窗
pw.dismiss();
}
});
}
//建立擴充卡對象,并進行執行個體化
BaseAdapter adapter = new BaseAdapter() {
@Override
public int getCount() {
return list.size();
}
@Override
public String getItem(int position) {
return list.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(final int position, View convertView, ViewGroup parent) {
//定義ViewHolder對象
ViewHolder viewHolder;
if (convertView == null) {
convertView = View.inflate(MainActivity.this, R.layout.item_popup, null);
viewHolder = new ViewHolder(convertView);
convertView.setTag(viewHolder);
} else {
viewHolder = (ViewHolder) convertView.getTag();
}
//現在ViewHolder有值了 !
//可以對ViewHolder裡面的對象進行操作了,主要是填充資料
viewHolder.tv.setText(list.get(position));
//給Imageview對象設定監聽事件
viewHolder.iv.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//點選删除圖示後,删除這行資訊
list.remove(position);
//重新整理擴充卡
adapter.notifyDataSetChanged();
}
});
return convertView;
}
};
class ViewHolder {
ImageView iv;
TextView tv;
//通過構造方法傳入一個View對象
ViewHolder(View convertView) {
iv = (ImageView) convertView.findViewById(R.id.iv_delete);
tv = (TextView) convertView.findViewById(R.id.tv_phone);
}
}
}
(三)程式運作結果
1.程式剛運作顯示的界面:
2.點選右邊的圖示後顯示的界面:
3.點選PopupWindow的一個條目後顯示的界面:
總結:
PopupWindow的使用并不困難,跟Dialog的使用和功能都是很相近的。
PopupWindow的使用主要是在顯示菜單資訊或在某個控件下方顯示清單資訊。Dialog對話框一般是顯示在螢幕的中心。
PopupWindow和Dialog有一個差別就是:
彈出PopupWindow,頁面的生命周期的方法沒有被回調;
彈出Dialog,頁面的生命周期的方法Pause肯定被回調;
菜單效果的PopupWindow,如圖
這些都是PopupWindow視窗經常使用的場合。