今天的第二篇ui练习贴,先看UI看
看布局可以知道 一个Edittext 输入数据,后右侧的一个Imageview 点击会出现一个,popwindow 可以点击赋值给Edittext 或者点击删除数据,很明显用安卓自带的spinner 是无法实现这个功能的
主布局 : Edittext 和ImageView 没什么难度
<RelativeLayout 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"
tools:context=".MainActivity" >
<EditText
android:id="@+id/input"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:text="@string/hello_world" />
<ImageView
android:id="@+id/down_arrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/down_arrow"
android:layout_alignRight="@id/input"
android:clickable="true"
android:layout_marginTop="20dp"
/>
</RelativeLayout>
然后就是popwindow的布局,填充一个listview 里面有一个条目布局 popwindow 和listview皆在代码中定义生成
<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="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal"
tools:context=".MainActivity" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/user" />
<TextView
android:id="@+id/tv_list_item"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_horizontal"
android:text="@string/hello_world" />
<ImageView
android:id="@+id/delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/delete" />
</LinearLayout>
这篇博客没什么难度,就简单说下吧
看java代码
-----------------------------------------实例化组件---------------------------------
private EditText input;
private ImageView downArrow;
//填充假数据的集合
private List<String> msgList;
private PopupWindow popWin;
private ListView listView;
/**
* 初始化控件
*/
private void initView() {
input = (EditText) findViewById(R.id.input);
downArrow = (ImageView) findViewById(R.id.down_arrow);
}
----------------------------------点击Imageview在下方出现popwindow-----------------------
downArrow.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
//定义 popupWindow
popWin = new PopupWindow(MainActivity.this);
popWin.setWidth(input.getWidth()); //设置宽度
popWin.setHeight(200); //设置popWin 高度
popWin.setContentView(listView); //为popWindow填充内容
popWin.setOutsideTouchable(true); // 点击popWin 以处的区域,自动关闭 popWin
// view的左下角进行偏移,xoff正的向左,负的向右. yoff没测,也应该是正的向下,负的向上
popWin.showAsDropDown(input, 0, 0);//设置 弹出窗口,显示的位置
}
});
-----------------------------------------得到一个listview 为popwindow填充-------------------
private void initListView() {
listView = new ListView(this);
listView.setBackgroundResource(R.drawable.listview_background); //设置listView 背景
listView.setDivider(null); //设置条目之间的分隔线为null
listView.setVerticalScrollBarEnabled(false); //隐藏listView的滚动条
listView.setAdapter(new MyListAdapter());
}
---------------------------------------------为listview填充假数据准备一个集合-----------------------------------
/**
* 填充listview数据
*/
private void initData() {
msgList = new ArrayList<String>();
for (int i = 0; i < 20; i++) {
msgList.add("1000000000"+i);
}
}
---------------------------------准备一个adapter 进行给listview填充数据-------------------------------------
private class MyListAdapter extends BaseAdapter{
@Override
public int getCount() {
return msgList.size();
}
@Override
public Object getItem(int position) {
return position;
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(final int position, View convertView, ViewGroup parent) {
ViewHolder holder;
if(convertView == null){
convertView = View.inflate(getApplicationContext(), R.layout.list_item, null);
holder = new ViewHolder();
holder.delete = (ImageView) convertView.findViewById(R.id.delete);
holder.tv_msg =(TextView) convertView.findViewById(R.id.tv_list_item);
convertView.setTag(holder);
}else{
holder = (ViewHolder) convertView.getTag();
}
holder.tv_msg.setText(msgList.get(position));
//点击事件处理
holder.delete.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
//删除对应的条目
msgList.remove(position);
//刷新listView
MyListAdapter.this.notifyDataSetChanged();
}
});
convertView.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
//设置输入框
input.setText(msgList.get(position));
popWin.dismiss();
}
});
return convertView;
}
}
//-----------------------------adapter开始添加数据-------------
//---------------------listview的优化-----------------------
private class ViewHolder{
TextView tv_msg;
ImageView delete;
}
OK 搞定 因为我是复习UI 关于java代码不懂的可以提问