Andriod-高级UI组件-下拉列表组件-Spinner-ListView-AutoCompleteTextView

下拉列表框组件(Spinner

下拉列表框(Spinner)组件,通常会提供一组固定选项以下拉的方式供用户进行选择,方便用户的操作,例如:电影类软件选择影片类型,动作、喜剧、爱情、科幻等等。

1.基本语法格式

    <Spinner
        属性
        android:entries=""      `设置数组名称`
        android:prompt=""       `可选属性用于指定下拉列表的标题`
       />

注意:prompt属性当显示模式为dialog时生效,作用为显示dialog的标题内容,但在android5.0中时没有任何效果的,得用Theme.Black主题才可以

2.常用属性

  • android:dropDownHorizontalOffset:-----------------------------------------设置列表框的水平偏移距离
  • android:dropDownVerticalOffset:-----------------------------------------设置列表框的垂直偏移距离
  • android:dropDownSelector:-----------------------------------------列表框被选中时的背景
  • android:dropDownWidth:-----------------------------------------设置下拉列表框的宽度
  • android:gravity:-----------------------------------------设置里面组件的对其方式
  • android:popupBackground:-----------------------------------------设置列表框的背景
  • android:spinnerMode:-----------------------------------------列表框的模式,有两个可选值:
    dialog:-----------------------------------------对话框风格的窗口
    dropdown:-----------------------------------------下拉菜单风格的窗口(默认)
  • android:entries:-----------------------------------------使用数组资源设置下拉列表框的列表项目
  • android:prompt:-----------------------------------------设置对话框模式的列表框的提示信息(标题),只能够引用string.xml 中的资源id,而不能直接写字符串

3. 例子:运动类型的下拉菜单

3.1 在values里新建一个sport.xml存储数组

<?xml version="1.0" encoding="utf-8"?>
<resources>
   ` <!-- 数组资源名称  -->`
    <string-array name="list_sport">
        <item >全部</item>
        <item >篮球</item>
        <item >乒乓球</item>
        <item >羽毛球</item>
        <item >足球</item>
    </string-array>
    
</resources>

3.2 ,Spinner.xml文件

<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="${relativePackage}.${activityClass}"
    android:gravity="center"
     >
    <TextView
        android:id="@+id/spinner_text_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="20dp"
        android:text="喜欢的运动类型"
        android:background="#000000"
        android:textColor="#FFFFFF"
         /> 
    <Spinner
        android:layout_below="@id/spinner_text_2"
        android:id="@+id/spinner_sport"
        android:entries="@array/list_sport"                           `引入数组资源`
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"         
       />
</RelativeLayout>

效果:::

在这里插入图片描述

4. 利用代码获取用户选中的数据

原理:设置选择监听器setOnItemSelectedListener并用getSelectedItem方法获取到值

		//获取下拉选择的内容
		Spinner spinner_sport = (Spinner) findViewById(R.id.spinner_sport);     `//获取下拉列表框组件`
		spinner_sport.setOnItemSelectedListener(new OnItemSelectedListener() {
    
      `//设置对应的选择监听事件`

			@Override
			public void onItemSelected(AdapterView<?> adapterView, View view, int position, long id) {
    
    
				// TODO Auto-generated method stub				
				`//获取下拉列表的选项`
				String str = adapterView.getSelectedItem().toString();          `取值`
				if(!str.equals("全部")){
    
                                             `判断不是默认`
					Toast.makeText(SpinnerActivity.this, "你喜欢的运动是:"+str+" 运动", Toast.LENGTH_SHORT).show();
				}			
			}
			@Override
			public void onNothingSelected(AdapterView<?> parent) {
    
    
				// TODO Auto-generated method stub				
			}
		});	

列表视图组件(ListView)

1.列表视图(ListView)组件,它将需要显示的信息以垂直列表的形式进行展现,一行只展现一条信息通常我们也说一条记录或者是一个item。
2.每一个item可以是简单形式也可以是复杂形式,例如每行只显示一个文本信息就属于简单形式,我们不需要设计每个item的样式,可以使用ArrayAdapter的方式进行数据绑定;
3.每行可以显示图文混排样式属于复杂形式,需要自己设计每个item的样式,这个需要SimpleAdapter或者BaseAdapter做数据绑定。

1.基本语法格式

    <ListView 
        属性
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
            >
    </ListView>

2.常用属性

  • android:divider,----------------------------------在列表条目之间显示的drawable或color
  • android:dividerHeight,-------------------------用来指定divider的高度
  • android:entries,---------------------------------构成ListView的数组资源的引用。对于某些固定的资源,这个属性提供了比在程序中添加资源更加简便的方式
  • android:footerDividersEnabled,-------------当设为false时,ListView将不会在各个footer之间绘制divider.默认为true。
  • android:headerDividersEnabled,-----------当设为false时,ListView将不会在各个header之间绘制divider.默认为true。

3.例子:设置一个图片+文字的列表视图

3.1。listview.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"
    tools:context="${relativePackage}.${activityClass}"
    android:orientation="vertical"
    android:gravity="center"
>
    <TextView
        android:id="@+id/listview_text"
        android:textSize="60dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="列表视图组件" />
    <ListView 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/listview"
        ></ListView>
</LinearLayout>

3.2,play_list.xml(自定义的视图列表每行的格式)→在java文件的适配器里引用

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"     >    
    <ImageView 
        android:id="@+id/listview_image"
        android:maxWidth="100dp"
        android:maxHeight="100dp"
        android:paddingTop="10dp"
        android:adjustViewBounds="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        />
    <!-- 占位用 -->
    <TextView
        android:layout_toRightOf="@id/listview_image"
        android:id="@+id/text"
        android:layout_width="100dp"
        android:layout_height="wrap_content"         
        />
    <TextView 
        android:layout_toRightOf="@id/text"
        android:id="@+id/listview_text"
        android:padding="10dp"
        android:textSize="20dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        />
</RelativeLayout>

3.3,play_list.java(建立数据源,建立适配器,获取用户选择的信息 )

public class ListViewActivity extends Activity {
    
    

	@Override
	protected void onCreate(Bundle savedInstanceState) {
    
    
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_list_view);
		`//建立图片数组数据源`
		int image[] = new int[]{
    
    R.drawable.b0,R.drawable.b2,R.drawable.b3,R.drawable.a4,R.drawable.a5,R.drawable.a6};
		
		`//建立文字数组数据源`
		String name[] = new String[]{
    
    "花1hhhhhhhh","花2hhhhhhhh","花3hhhhhh","花4hhhhh","花5hhhhh","花6hhhhhhhhh",};
		
		`//创建一个list对象,一个map对象`
		List<Map<String,Object>> listItem = new ArrayList<Map<String,Object>>() ;
		
		`//使用for循环为map对象赋值`
		for(int i=0;i<image.length;i++){
    
    
			Map<String,Object> map = new HashMap<String,Object>();
			map.put("image", image[i]);
			map.put("name", name[i]);
			`//将赋值后的map放入list中`
			listItem.add(map);

		}
		`//创建一个适配器,并将其实例化`
		`//R.layout.list_play--引入资源文件`
		SimpleAdapter adapter = new SimpleAdapter
				(this, listItem, R.layout.list_play, new String[]{
    
    "image","name"}, new int[]{
    
    R.id.listview_image,R.id.listview_text});
		`//绑定listview组件`		
		ListView listview = (ListView) findViewById(R.id.listview);
		`//使用创建好的适配器对象`
		listview.setAdapter(adapter);
		`//设置列表视图选中监听事件`
		listview.setOnItemClickListener(new OnItemClickListener() {
    
    

			@Override
			public void onItemClick(AdapterView<?> adapterView, View view, int position, long id) {
    
    
				// TODO Auto-generated method stub
			`//获取选中项的字符串`
				Map<String,Object> map = (Map<String,Object>)adapterView.getItemAtPosition(position);
				`//将字符串打印输出`
				Toast.makeText(ListViewActivity.this, "你选中"+map.get("name").toString()+"天气", Toast.LENGTH_SHORT).show();
			}
		});		
	}
}

效果:::

在这里插入图片描述

3.4 listview.xml与play_list.xml的关系

在这里插入图片描述

AutoCompleteTextView-自动完成文本框

自动完成文本框(AutoCompleteTextView)实际上也是一个编辑文本框,但它比普通编辑框多了一个功能:当用户输入一定字符后,自动文本框会显示一个下拉菜单,供用户从中选择,当用户选择某个菜单选项之后,AutoCompleteTextView按用户选择自动填写该文本框。常常和Adapter(提供数据源)搭配使用。

1.常用属性

  • android:completionHint:------------------------设置下拉菜单中的提示标题
  • android:completionHintView:-----------------定义提示视图中显示下拉菜单
  • android:completionThreshold:---------------指定用户至少输入多少个字符才会显示提示
  • android:dropDownAnchor:-------------------设置下拉菜单的定位"锚点"组件,如果没有指定改属性,将使用该TextView作为定位"锚点"组件
  • android:dropDownHeight:--------------------设置下拉菜单的高度
  • android:dropDownWidth:---------------------设置下拉菜单的宽度
  • android:dropDownHorizontalOffset:-------指定下拉菜单与文本之间的水平间距
  • android:dropDownVerticalOffset:----------指定下拉菜单与文本之间的竖直间距
  • android:dropDownSelector:-----------------设置下拉菜单点击效果
  • android:popupBackground:-----------------设置下拉菜单的背景

2.例子:模糊输入,提示

<AutoCompleteTextView
        android:layout_below="@id/autoCompleteTextView_text"
        android:id="@+id/autoCompleteTextView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" 
        android:hint="请输入你的名字"
        android:textSize="25dp"        
        />

效果:::

在这里插入图片描述

3.利用java代码做出提示

原理:通过适配器把数据源传入

public class AutoCompleteTextViewActivity extends Activity {
    
    
	
	AutoCompleteTextView autoCompleteTextView;                                  `定义组件`

	@Override
	protected void onCreate(Bundle savedInstanceState) {
    
    
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_auto_complete_text_view);
		
		`建立数据源-提示库`
		String names[] = new  String[]{
    
    "王大器1","王大器2","王大器3","王大器4","王大器5","王大器6","李大家1","李大家2",
				"李大家3","李大家4","李大家5","李大家6",};
		
		`建立适配器`
		ArrayAdapter<String> adapter = new ArrayAdapter<String>(
				AutoCompleteTextViewActivity.this,                   `参数1:承接上下文`
				android.R.layout.simple_expandable_list_item_1,		 `参数2:引入展示样式文件` 		
					            `simple_expandable_list_item_1---系统的样式`
				names                                                `参数3,数据源对象名`
				);
		`设置适配器`
		autoCompleteTextView=(AutoCompleteTextView)findViewById(R.id.autoCompleteTextView);     `绑定自动补全组件`
		autoCompleteTextView.setAdapter(adapter);                                               `设置适配器`
		
	}
}

猜你喜欢

转载自blog.csdn.net/csdnbian/article/details/109559571