利用Spinner和ListView等控件实现一个可查询可分类的小示例

现有条件要求如图所示，



还给定了数组资源如下

分别为食品、食品种类、食品图片。

strings.xml

<string-array name="prodArr">
<item>可口可乐CocaCola</item>
<item>皮制箱leatherBox</item>
<item>统一泡面instantnoodles </item>
<item>Tcl电视</item>
<item>金士顿U盘</item>
<item>中国简史brief history of China </item>
<item>朗科U盘Netac</item>
<item>海尔空调air conditioner</item>
<item>张裕红酒 red wine</item>
<item>MP3播放器</item>
<item>吸类器suction trap</item>
<item>油烟机 lampblack machine</item>
<item>口香糖Chewing gum</item>
<item>唐诗三百首three hundred poems of Tang Dynasty</item>
<item>拉杆箱pull rod box</item>
</string-array>

<string-array name="catArr">
<item>食品</item>
<item>箱包</item>
<item>食品</item>
<item>家电</item>
<item>数码</item>
<item>图书</item>
<item>数码</item>
<item>家电</item>
<item>食品</item>
<item>数码</item>
<item>家电</item>
<item>家电</item>
<item>食品</item>
<item>图书</item>
<item>箱包</item>
</string-array>

<array name="prodImg">
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
<item>@drawable/sample_thumb_2</item>
</array>

第一步先进行文件布局，最外边一层运用LinearLayout的垂直布局。第一行放了一个Spinner控件，查询输入框Edittext，和一个Button按钮所以说这三个在一个布局里边运用LinearLayout的水平布局。下面是一个ListView。

在ListView中又有一个单独的布局，最外边是一个水平布局的LinearLayout，左边是商品的图片，右边又嵌套一个垂直布局，有两行分别是食品的类别和名称。

mian.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="30sp"
android:text="商品列表"
/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/sp"
android:entries="@array/catArr">
</Spinner>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="请输入要搜索的关键字"
android:id="@+id/edit"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="点击我查询"
android:id="@+id/but"/>
</LinearLayout>
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/lv">
</ListView>
</LinearLayout>

layout_listview.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:orientation="horizontal">
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:id="@+id/img"/>

<LinearLayout
android:layout_width="100dp"
android:layout_height="100dp"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="45dp"
android:id="@+id/text1"
android:layout_weight="1"
android:textColor="@android:color/holo_blue_bright"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="45dp"
android:id="@+id/text2"
android:layout_weight="1"
android:textColor="@android:color/black"/>
</LinearLayout>
</LinearLayout>

第二步在Activity里进行示例的算法设计，我们可以观察到食品prodArr、食品种类catArr和食品图片prodImg一一对应，

package com.example.zlg.zujiantest;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import android.widget.Spinner;
import android.widget.Toast;
import java.util.ArrayList;
import java.util.HashMap;
public class MainActivity extends AppCompatActivity {
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

final ListView lv=(ListView)findViewById(R.id.lv);//获取listview组件id
final ArrayList list = new ArrayList();
final String[] items = getResources().getStringArray(R.array.catArr);//将xml文件的商品类别读入
for (String cat:items){
if (!list.contains(cat)) {
list.add(cat);                        //将重复商品类别过滤
}
}
final String[] cat_arr = (String[]) list.toArray(new String[list.size()]);   //将list转换为数组
final String[] items2 = getResources().getStringArray(R.array.prodArr);   //将商品读入
final String[] items3 = getResources().getStringArray(R.array.prodImg);    //将图片读入

Spinner sp=(Spinner)findViewById(R.id.sp);    //获取spinner的id
ArrayAdapter arr = new ArrayAdapter(this,android.R.layout.simple_spinner_item,list);//未下拉前的布局
arr.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);//下拉后的布局
sp.setAdapter(arr);
sp.setPrompt("标题");
sp.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
public void onItemSelected(AdapterView<?> adapterView, View view, int ii, long l) {
//当Spinner的选项被选中后调用匿名类的方法
Toast.makeText(MainActivity.this, ""+list.get(ii), Toast.LENGTH_SHORT).show();
String cat_str = (String)list.get(ii);//获取当前选中的商品类别
ArrayList showArrayList = new ArrayList();//创建新的list来保存选中此类别的商品
HashMap showMap;
for (int i = 0; i < items2.length; i++) {
showMap = new HashMap();
if (items[i].equals(cat_str)) {                 //    遍历所有的商品类别（因为数组中商品类别和商品一一对应）有和当前选中的商品类别一样的话，就取出来放到新的list中
showMap.put("商品种类", items[i]);
showMap.put("商品", items2[i]);
showMap.put("图像", R.drawable.zx);
showArrayList.add(showMap);
}
}
SimpleAdapter simpleAdapter = new SimpleAdapter(getApplicationContext(),showArrayList,R.layout.layout_listview,new String[]{"商品种类","商品","图像"},new int[]{R.id.text1,R.id.text2,R.id.img});
//函数参数分别对应上下文，list列表，布局文件，输入内容，输出位置
lv.setAdapter(simpleAdapter);//应用适配器
}
public void onNothingSelected(AdapterView<?> adapterView) {
//暂未用到
}
});

Button button = (Button)findViewById(R.id.but);
final EditText edit =(EditText)findViewById(R.id.edit) ;
button.setOnClickListener(new View.OnClickListener() {
//设置按钮点击函数
public void onClick(View view) {
String str =  edit.getText().toString();
if (str.equals("")) {
Toast.makeText(MainActivity.this, "请输入关键字", Toast.LENGTH_SHORT).show();
} else {
ArrayList showArrayList2 = new ArrayList();//创建新的list来保存选中此类别的商品
HashMap showMap2;
for (int i = 0; i < items2.length; i++) {
showMap2 = new HashMap();
if(items2[i].contains(str)){
showMap2.put("商品种类", items[i]);
showMap2.put("商品", items2[i]);
showMap2.put("图像", R.drawable.zx);
showArrayList2.add(showMap2);
}
}
SimpleAdapter simpleAdapter = new SimpleAdapter(getApplicationContext(),showArrayList2,R.layout.layout_listview,new String[]{"商品种类","商品","图像"},new int[]{R.id.text1,R.id.text2,R.id.img});
lv.setAdapter(simpleAdapter);
}
}
});
}
}

如此，完成题目要求。

O(∩_∩)O欢迎指教！