Android自定义搜索界面，搜索词单独设置颜色

最新推荐文章于 2024-10-12 15:01:35 发布

不年少还青春

最新推荐文章于 2024-10-12 15:01:35 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

文章标签： android 手机开发设计 app

本文链接：https://blog.youkuaiyun.com/Hello201404/article/details/48493025

本文介绍了如何在Android app中创建自定义搜索界面，包括边输入边搜索、搜索历史、改变回车键为搜索按钮并添加点击事件，以及设置搜索词在结果中的特定颜色。详细讲述了实现这个功能涉及的技术点和代码实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、概述

一般的app有可能会涉及到搜索，现在的搜索的需求都是边输入边搜索的，然后下面会有之前的搜索历史，以及搜索词在搜索结果中的颜色是另外的颜色，例如蓝色红色等，还有一个需求就是改变回车按键，然后可以触发点击事件。

二、将要实现的效果图

三、涉及到的知识点

1、把回车键变为搜索按钮，代码添加点击事件，进行搜索

2、添加流式标签布局，并且添加点击事件

3、通过监听，实现一边输入一边搜索效果

4、搜索结果中搜索词颜色设为指定的另外的颜色

三、实现过程（解决问题代码）

1、更改软键盘回车为搜索按钮，给EditText添加这两个属性：

 android:imeOptions="actionSearch"
 android:singleLine="true"

2、代码里实现点击事件

et_text.setOnEditorActionListener(this);
@Override
	public boolean onEditorAction(TextView v, int actionId, KeyEvent event)
	{
		//此处写想要实现的搜索功能代码

		return false;
	}

3、解决流式布局，可以通过github比较好的流式布局demo，很简单用一下就好，搜FlowLayout,肯定可以搜索

/**
	 * 给Flowlayout添加数据，并且设置点击事件
	 */
	private void addDataToflowlayout()
	{
		String beforeWords = SharedPreferencesUtils.getString(context,
				"searchConfig", "");
		if (!"".equals(beforeWords))
		{
			String[] searchWords = beforeWords.split(",");
			for (String string : searchWords)
			{
				TextView rb = (TextView) View.inflate(this, R.layout.rb, null);
				rb.setText(string);

				MarginLayoutParams layoutParams = new MarginLayoutParams(
						MarginLayoutParams.WRAP_CONTENT,
						MarginLayoutParams.WRAP_CONTENT);
				layoutParams.setMargins(10, 15, 30, 0);
				flowLayout.addView(rb, layoutParams);
			}
			// 设置点击事件
			for (int i = 0; i < flowLayout.getChildCount(); i++)
			{
				TextView tView = (TextView) flowLayout.getChildAt(i);
				final String strText = tView.getText().toString();

				tView.setOnClickListener(new OnClickListener()
				{

					@Override
					public void onClick(View v)
					{
						et_text.setText(strText);
					}
				});
			}
		} else
		{
			ll.setVisibility(View.GONE);
		}

	}

3、添加EditText内容变化监听：

//给Editext添加文字变化监听
et_text.addTextChangedListener(this);
//让Activity实现TextWatcher，重写相应的方法
@Override
	public void afterTextChanged(Editable s)
	{
		// TODO Auto-generated method stub

	}

	@Override
	public void beforeTextChanged(CharSequence s, int start, int count,
			int after)
	{

	}

	@SuppressWarnings("unchecked")
	@Override
	public void onTextChanged(CharSequence s, int start, int before, int count)
	{
		//这里的s就是用户输入的词，你可以根据s值，进行相应的搜索等操作。

	}

4、给相应的搜索词设置另外的颜色。

//自定义Adapter,在getView方法添加颜色更改代码
@Override
		public View getView(int position, View convertView, ViewGroup parent)
		{
			// TODO Auto-generated method stub
			ViewHolder holder = null;
			if (convertView == null)
			{
				convertView = View.inflate(context,
						R.layout.query_college_textview2, null);
				holder = new ViewHolder();
				holder.iv = (ImageView) convertView.findViewById(R.id.id_iv);
				holder.tv_course_title = (TextView) convertView
						.findViewById(R.id.id_text);
				convertView.setTag(holder);
			} else
			{
				holder = (ViewHolder) convertView.getTag();
			}
			//以下代码是改变搜索词的颜色的方法
			String searchWords = et_text.getText().toString().trim();
			int chageTextColor;	
			ForegroundColorSpan redSpan = new ForegroundColorSpan(Color.BLUE);
			SpannableStringBuilder builder = new SpannableStringBuilder(
					videoNames.get(position));
			chageTextColor = videoNames.get(position).indexOf(searchWords);
			if (chageTextColor != -1)
			{
				builder.setSpan(redSpan, chageTextColor, chageTextColor
						+ searchWords.length(),
						Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
				holder.tv_course_title.setText(builder);
			} else
				holder.tv_course_title.setText(videoNames.get(position));
			return convertView;
		}

四、总结

这是很常见的一个功能，大家有兴趣可以看看，有什么问题，请在评论中问哦

demo下载地址