Android自定義組件之ListPopWindow
來自: http://blog.csdn.net//lyhhj/article/details/50582900
最近小編在學習IOS開發,感觸頗深,看到了iOS里面封裝了好多組件,很多組件都是iOS自帶的,相信一般的小公司的產品經理都是按照iOS的交互來設計UI,而且還要求Android要和iOS統一風格,這讓Android開發人員很頭痛,iOS自帶組件很容易實現,而Android可能需要重寫控件去配合iOS的效果。其實這樣必然會導致性能的小將,或有些許的卡頓。小編個人認為,按照各自系統的風格和規范進行設計才能把自己的優點發揮到最大化。
下面就引出了今天的主題,自定義組件ListPopWindow,iOS中,這個效果是自帶的。PopWindow可以說在項目里用的比較多的了,可能有n處要用到PopWindow,那么自定義一個PopWindow,到處來用更方便一些。
先看一下效果:
效果就是這樣,看一下實現,其實也沒多難,就是想開源出來供小伙伴們使用,如有不合理地方,希望大家多多指正。
1.自定義PopWindow
首先我們分析一下,這樣的效果肯定是一個PopWindow嵌套著listview,而上面的title、和下面的cancel是兩個文本框,實現起來也比較簡單。
然后我們在PopWindow中聲明兩個接口,用來回調cancel和item的點擊事件
public interface OnPopItemClickListener{
void onPopItemClick(View view,int position);
}
public interface OnBottomTextviewClickListener{
void onBottomClick();
}</pre> <p>然后再設置一些PopWindow的一些屬性</p>
parentView = LayoutInflater.from(context).inflate(R.layout.list_popwindow,null);
setContentView(parentView);
lv = (ListView) parentView.findViewById(R.id.lv_popwindow);
//設置彈出窗體的高
this.setWidth(ViewGroup.LayoutParams.MATCH_PARENT);
this.setHeight(ViewGroup.LayoutParams.MATCH_PARENT);
//設置彈出窗體可點擊
this.setFocusable(true);
//實例化一個ColorDrawable顏色為半透明
ColorDrawable dw = new ColorDrawable(0xb0000000);
//設置SelectPicPopupWindow彈出窗體的背景
this.setBackgroundDrawable(dw); 看一下整體的代碼吧:
/* Created by Hankkin on 16/1/25. */
public class ListPopWindow extends PopupWindow{
private Context context; //上下文
private View parentView; //父視圖
private List<PopBean> dataList; //item數據源
private OnPopItemClickListener listener; //item點擊接口
private ListView lv; //item列表視圖
private View viewTop; //title視圖
private String topText,bottomText; //title文字,bottom文字
private TextView tvTop,tvBottom; //title文本,bottom文本
private PopWindowAdapter adapter; //適配器
private OnBottomTextviewClickListener bottomListener;//底部點擊接口
public interface OnPopItemClickListener{
void onPopItemClick(View view,int position);
}
public interface OnBottomTextviewClickListener{
void onBottomClick();
}
public ListPopWindow(Context context,OnPopItemClickListener listener,OnBottomTextviewClickListener bottomListener,
View parentView,List<PopBean> dataList,String bottomText,String topText){
this.context = context;
this.listener = listener;
this.parentView = parentView;
this.dataList = dataList;
this.bottomListener = bottomListener;
this.topText = topText;
this.bottomText = bottomText;
initViews();
}
private void initViews(){
parentView = LayoutInflater.from(context).inflate(R.layout.list_popwindow,null);
setContentView(parentView);
lv = (ListView) parentView.findViewById(R.id.lv_popwindow);
//設置彈出窗體的高
this.setWidth(ViewGroup.LayoutParams.MATCH_PARENT);
this.setHeight(ViewGroup.LayoutParams.MATCH_PARENT);
//設置彈出窗體可點擊
this.setFocusable(true);
//實例化一個ColorDrawable顏色為半透明
ColorDrawable dw = new ColorDrawable(0xb0000000);
//設置SelectPicPopupWindow彈出窗體的背景
this.setBackgroundDrawable(dw);
//view添加OnTouchListener監聽判斷獲取觸屏位置如果在布局外面則銷毀彈出框
parentView.setOnTouchListener(new View.OnTouchListener() {
public boolean onTouch(View v, MotionEvent event) {
int height = parentView.findViewById(R.id.ll_bottom).getTop();
int y = (int) event.getY();
if (event.getAction() == MotionEvent.ACTION_UP) {
if (y > height) {
dismiss();
}
}
return true;
}
});
update();
viewTop = parentView.findViewById(R.id.view_line1);
tvBottom = (TextView) parentView.findViewById(R.id.tv_popwindow_bottom);
tvTop = (TextView) parentView.findViewById(R.id.tv_popwindow_first);
adapter = new PopWindowAdapter(context,dataList,false);
lv.setAdapter(adapter);
if (!TextUtils.isEmpty(topText)){
tvTop.setVisibility(View.VISIBLE);
tvTop.setText(topText);
viewTop.setVisibility(View.VISIBLE);
}
else {
tvTop.setVisibility(View.GONE);
viewTop.setVisibility(View.GONE);
}
if (!TextUtils.isEmpty(bottomText)){
tvBottom.setVisibility(View.VISIBLE);
tvBottom.setText(bottomText);
}
else {
tvBottom.setVisibility(View.GONE);
}
lv.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
listener.onPopItemClick(view, i);
}
});
tvBottom.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
bottomListener.onBottomClick();
}
});
}
}</pre>
2.看一些item的bean
這里我就聲明了title和圖片的id
package com.hankkin.library;
/* Created by Hankkin on 16/1/25. */
public class PopBean {
private String title;
private int icon_res;
public String getTitle() {
return title;
}
public void setTitle(String title) {
this.title = title;
}
public int getIcon_res() {
return icon_res;
}
public void setIcon_res(int icon_res) {
this.icon_res = icon_res;
}
public PopBean(String title, int icon_res) {
this.title = title;
this.icon_res = icon_res;
}
}</pre>
3.自定義adapter適配器
這里面可能要注意的就是item的背景設置,有的是上半部分圓角、有的是下半部分圓角,特殊處理一下
@Override
public View getView(int i, View view, ViewGroup viewGroup) {
ViewHolder holder;
if (view == null) {
view = inflater.inflate(R.layout.listview_popwindow_item, null);
holder = new ViewHolder();
holder.tv_name = (TextView) view.findViewById(R.id.tv_title);
holder.v_line = (View) view.findViewById(R.id.v_line);
view.setTag(holder);
} else {
holder = (ViewHolder) view.getTag();
}
holder.tv_name.setText(dataList.get(i).getTitle());
if (dataList.size() - 1 == i) {
holder.v_line.setVisibility(View.INVISIBLE);
holder.tv_name.setBackground(context.getResources().getDrawable(R.drawable.selector_bottom_half));
} else {
holder.v_line.setVisibility(View.VISIBLE);
holder.tv_name.setBackground(context.getResources().getDrawable(R.drawable.list_gray_item));
}
return view;
}</pre> <h3 id="最后看一下調用">最后看一下調用</h3>
Activity需要實現item接口(OnPopItemClickListener)和底部按鈕接口(OnBottomTextviewClickListener)
public void show(View view){
List<PopBean> pops = new ArrayList<>();
for (int i=0;i<5;i++){
PopBean pop = new PopBean("item"+i,0);
pops.add(pop);
}
popWindow = new ListPopWindow(MainActivity.this,this,this,rl,pops,"cancel","title");
popWindow.showAtLocation(rl, Gravity.CENTER| Gravity.BOTTOM,0,0);
} 最后小編附上github源碼地址,小伙伴們可以直接用哦。
https://github.com/Hankkin/ListPopwidowDemo
</div>