Android常用UI

详细介绍列表视图(ListView)、单选(RadioGroup)、多选(CheckBox)、下拉列表(Spinner)、菜单(Menu)、内容提示文本框(AutoCompleteTextView)、手势识别(GestureOverlayView)、网页视图(WebView)。

1.列表视图（ListView）

XML配置

在主界面中配置<ListView>标签

在res/layout/文件夹下创建一个新的xml文件指定每个条目的布局

Java代码构建ListView

获取ListView对象

设置一个Adapter

用适配器封装有两种方式：

1.SimpleAdapter：以List<Map<String,?>>形式封装数据

2.SimpleCursorAdapter：以Cursor对象封装数据，Cursor中需要有“_id”一列

添加OnItemClickListener

调用ListView的getItemAtPosition(int)方法可以获取封装数据的容器

如果传入的是SimpleAdapter，获取到的就是一个Map<String,?>

如果传入的是SimpleCursorAdapter，获得到的就是一个Cursor，并且Cursor以指向选中的一条记录

示例：

用SimpleAdapter进行数据绑定

public class MainActivity extends Activity { private PersonService service; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); service = new PersonService(this); ListView listView = (ListView) this.findViewById(R.id.listView); //获取到集合数据 List<Person> persons = service.getScrollData(0, 10); List<HashMap<String, Object>> data = new ArrayList<HashMap<String,Object>>(); for(Person person : persons){ HashMap<String, Object> item = new HashMap<String, Object>(); item.put("id", person.getId()); item.put("name", person.getName()); item.put("phone", person.getPhone()); item.put("amount", person.getAmount()); data.add(item); } //创建SimpleAdapter适配器将数据绑定到item显示控件上 SimpleAdapter adapter = new SimpleAdapter(this, data, R.layout.item, new String[]{"name", "phone", "amount"}, new int[]{R.id.name, R.id.phone, R.id.amount}); //实现列表的显示 listView.setAdapter(adapter); //条目点击事件 listView.setOnItemClickListener(new ItemClickListener()); } //获取点击事件 private final class ItemClickListener implements OnItemClickListener{ public void onItemClick(AdapterView<?> parent, View view, int position, long id) { ListView listView = (ListView) parent; HashMap<String, Object> data = (HashMap<String, Object>) listView.getItemAtPosition(position); String personid = data.get("id").toString(); Toast.makeText(getApplicationContext(), personid, 1).show(); } } }

用SimpleCursorAdapter进行数据绑定

public class MainActivity extends Activity { private PersonService service; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); service = new PersonService(this); ListView listView = (ListView) this.findViewById(R.id.listView); //获取游标 Cursor cursor = service.getCursorScrollData(0, 10); //创建SimpleCursorAdapter适配器将数据绑定到item显示控件上 SimpleCursorAdapter adapter = new SimpleCursorAdapter(this, R.layout.item, cursor, new String[]{"name", "phone", "amount"}, new int[]{R.id.name, R.id.phone, R.id.amount}); listView.setAdapter(adapter); //条目点击事件 listView.setOnItemClickListener(new ItemClickListener()); } private final class ItemClickListener implements OnItemClickListener{ public void onItemClick(AdapterView<?> parent, View view, int position, long id) { ListView listView = (ListView) parent; Cursor cursor = (Cursor) listView.getItemAtPosition(position); String personid = String.valueOf(cursor.getInt(cursor.getColumnIndex("_id"))); Toast.makeText(getApplicationContext(), personid, 1).show(); } } }

2.单选(RadioGroup)

定义<RadioGroup>

在<RadioGroup>中定义<RadioButton>和<Button>

处理Button点击事件

根据ID获取RadioGroup对象，调用其getCheckedRadioButtonId()方法可以获取其中被选中的RadioGroup的ID

main.xml:

<RadioGroup android:id="@+id/radioGroup" android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <RadioButton android:id="@+id/java" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Java" android:layout_weight="1" /> <RadioButton android:id="@+id/net" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text=".NET" android:layout_weight="1" /> <RadioButton android:id="@+id/php" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="PHP" android:layout_weight="1" /> <Button android:id="@+id/php" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="确定" android:onClick="submitRadio" android:layout_weight="1" /> </RadioGroup>

MainActivity:

public void submitRadio(View view){ //获取选中按钮的ID int id =radioGroup.getCheckedRadioButtonId(); RadioButton radioButton=(RadioButton)findViewById(id); Toast.makeText(this,radioButton.getText(), 0).show(); }

3.多选(CheckBox)

定义若干<CheckBox>和一个<Button>

处理Button的点击事件

根据findViewById获取每个CheckBox，调用其isChecked()方法判断是否被选中

<LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" > <CheckBox android:id="@+id/javaCheckBox" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Java" android:layout_weight="1" /> <CheckBox android:id="@+id/netCheckBox" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text=".NET" android:layout_weight="1" /> <CheckBox android:id="@+id/phpCheckBox" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="PHP" android:layout_weight="1" /> <Button android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="确定" android:onClick="submitCheckBox" android:layout_weight="1" /> </LinearLayout>

4.下拉列表(Spinner)

定义<Spinner>标签

创建一个适配器

获取Spinner标签，调用setAdapter(SpinnerAdapter adapter)方法设置一个适配器

调用setOnItemSelectedListener(OnItemSelectedListener listener)方法设置监听器监听选中事件

使用字符串构建适配器

public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); spinner = (Spinner) findViewById(R.id.spinner); generateSpinner(); } private void generateSpinner() { //android.R.layout.simple_spinner_item下拉列表的样式 ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_spinner_item); adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item); adapter.add("Java"); adapter.add(".NET"); adapter.add("PHP"); spinner.setAdapter(adapter); //监听器 spinner.setOnItemSelectedListener(new OnItemSelectedListener(){ public void onItemSelected(AdapterView<?> parent, View view, int position, long id) { String selection=(String)parent.getItemAtPosition(position); Toast.makeText(getApplicationContext(), selection, 0).show(); } public void onNothingSelected(AdapterView<?> arg0) { } }); }

使用JavaBean构建适配器

private void generateSpinnerByJavaBean() { ArrayAdapter<User> adapter = new ArrayAdapter<User>(this, android.R.layout.simple_spinner_item); adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item); adapter.add(new User(1,"aaa","aaa@163.com")); adapter.add(new User(2,"bbb","bbb@163.com")); adapter.add(new User(3,"ccc","ccc@163.com")); spinner.setAdapter(adapter); //监听器 spinner.setOnItemSelectedListener(new OnItemSelectedListener(){ public void onItemSelected(AdapterView<?> parent, View view, int position, long id) { User user=(User)parent.getItemAtPosition(position); Toast.makeText(getApplicationContext(), user.toString(), 0).show(); } public void onNothingSelected(AdapterView<?> arg0) { } }); }

使用资源文件构建适配器

支持国际化

资源文件：

<?xml version="1.0" encoding="utf-8"?> <resources> <string-array name="items"> <item>Java</item> <item>.NET</item> <item>PHP</item> </string-array> </resources>

MainActivity

private void generateSpinnerByResource() { ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(this, R.array.items, android.R.layout.simple_spinner_item); adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item); spinner.setAdapter(adapter); spinner.setOnItemSelectedListener(new OnItemSelectedListener(){ public void onItemSelected(AdapterView<?> parent, View view, int position, long id) { CharSequence selection=(CharSequence)parent.getItemAtPosition(position); Toast.makeText(getApplicationContext(), selection, 0).show(); } public void onNothingSelected(AdapterView<?> arg0) { } }); }

自定义适配器样式

ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, R.layout.custom, R.id.content);

R.layout.custom 布局文件ID

R.id.content 哪一个组件用来显示文本

自定义布局文件：

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@android:drawable/btn_radio" /> <TextView android:id="@+id/content" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="30dp" android:textColor="#FFFF0000" android:textSize="30sp" /> </LinearLayout>

activity:

private void generateSpinnerByResource() { ArrayAdapter<String> adapter =new ArrayAdapter<String>(this,R.layout.item,R.id.content); adapter.add("java"); adapter.add(".NET"); adapter.add("php"); spinner.setAdapter(adapter); }

5.菜单(Menu)

添加菜单项

1.重写Actvity的onCreateOptionsMenu(Menu menu)方法

2.添加菜单项

调用方法中参数menu的add(CharSequence title) 方法

3.添加子菜单

调用menu对象的addSubMenu(final CharSequence title)

该方法返回一个SubMenu对象

4.添加子菜单的菜单项

调用SubMenu对象的add(CharSequence title) 方法

处理菜单点击事件

重写Activity的onOptionsItemSelected(MenuItem item) 方法

参数item即为被选中的菜单项

/* * 点击菜单按钮时会调用这个方法 * 支持子菜单，子菜单中不能再创建子菜单 */ public boolean onCreateOptionsMenu(Menu menu) { menu.add(Menu.NONE,0,1,"增加1"); menu.add(Menu.NONE,1,0,"增加2"); menu.add("修改"); menu.add("删除"); //创建子菜单 SubMenu subMenu=menu.addSubMenu("查询"); subMenu.add("按id查询"); subMenu.add("按名字查询"); subMenu.add("按邮箱查询"); return super.onCreateOptionsMenu(menu); } /* * 点击菜单项会执行这个方法 * @see android.app.Activity#onOptionsItemSelected(android.view.MenuItem) */ public boolean onOptionsItemSelected(MenuItem item) { Toast.makeText(this, item.getTitle(), 0).show(); return super.onOptionsItemSelected(item); }

6.手势识别(GestureOverlayView)

创建手势库

导入SDK中的工程

android-sdk-windows\samples\android-8\GestureBuilder

这个工程不能直接导入，需要添加三个配置文件：.classpath、.project、default.properties

将工程部署到手机中，创建手势库

手势库会存储在手机SD卡的根目录

使用手势识别

XML配置:

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <android.gesture.GestureOverlayView android:id="@+id/gov" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gestureStrokeType="multiple" > <ImageView android:id="@+id/img" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </android.gesture.GestureOverlayView> </LinearLayout>

Java代码:

public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); gov = (GestureOverlayView) findViewById(R.id.gov); img=(ImageView) findViewById(R.id.img); //获取到手势库，并加载 library = GestureLibraries.fromRawResource(this, R.raw.gestures); library.load(); gov.addOnGesturePerformedListener(new MyListener()); } private final class MyListener implements OnGesturePerformedListener { public void onGesturePerformed(GestureOverlayView overlay, Gesture gesture) { //手势库来匹配手势 ArrayList<Prediction> list = library.recognize(gesture); //查询手势库匹配的分值并打印 for(Prediction p:list){ System.out.println(p.name+":"+p.score); } //获取匹配度最高的选项 Prediction p =list.get(0); //如果匹配值小于3则不能识别 if(p.score<3){ Toast.makeText(getApplicationContext(), "手势不能识别", 0).show(); }else if("true".equals(p.name)){ //执行的内容 }else if("o".equals(p.name)){ //执行的内容 }else if("x".equals(p.name)){ //执行的内容 } } }

7.网页视图(WebView)

WebView(网络视图)能加载显示网页，它使用了WebKit渲染引擎加载显示网页，WebKit是android手机中内置了一款高性能内核浏览器。

XML配置：

<WebView android:id="@+id/webView" android:layout_width="fill_parent" android:layout_height="fill_parent" />

java代码：

WebView webView = (WebView) findViewById(R.id.webView); // 或取内容 String url = editText.getText().toString(); // 设置是否可缩放 webView.getSettings().setBuiltInZoomControls(true); // 设置是否支持脚本 webView.getSettings().setJavaScriptEnabled(true); // 设置客户端(谷歌Chrome客户端) webView.setWebChromeClient(new WebChromeClient()); // 加载页面 webView.loadUrl(url);

8.内容提示文本框(AutoCompleteTextView)

单次提示

XML文件：

<AutoCompleteTextView android:id="@+id/actv" android:layout_width="fill_parent" android:layout_height="wrap_content" android:completionThreshold="1" />

Java代码：

private void generateActv() { AutoCompleteTextView actv = (AutoCompleteTextView) findViewById(R.id.actv); String[] items = { "tom", "tony", "terry", "付东", "付荣", "付贵" }; ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_dropdown_item_1line, items); actv.setAdapter(adapter); }

多次提示

XML文件：

<MultiAutoCompleteTextView android:id="@+id/mactv" android:layout_width="fill_parent" android:layout_height="wrap_content" android:completionThreshold="1" />

Java代码：

private void generateMactv() { MultiAutoCompleteTextView mactv = (MultiAutoCompleteTextView) findViewById(R.id.mactv); String[] items = { "tom", "tony", "terry", "付东", "付荣", "付贵" }; ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_dropdown_item_1line, items); mactv.setAdapter(adapter); //用分隔符进行分割 mactv.setTokenizer(new MultiAutoCompleteTextView.CommaTokenizer()); }