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

来源：互联网发布：给淘宝店铺起个名字编辑：程序博客网时间：2024/06/05 05:38

现有条件要求如图所示，
程序样式
还给定了数组资源如下
分别为食品、食品种类、食品图片。
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欢迎指教！

阅读全文

0 0