1. 程式人生 > >android 自定義搜尋框

android 自定義搜尋框


1.編寫佈局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/commonsdk_ll_search_item"
    android:layout_width="match_parent"
    android:layout_height="48dp"
    android:gravity="center_vertical"
    android:orientation="horizontal"
    android:paddingBottom="7dp"
    android:paddingTop="7dp">

    <FrameLayout
        android:layout_width="48dp"
        android:layout_height="match_parent">

        <ImageView
            android:id="@+id/commonsdk_iv_search_back"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <TextView
            android:id="@+id/commonsdk_tv_search_back"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:visibility="gone" />
    </FrameLayout>

    <LinearLayout
        android:id="@+id/commonsdk_ll_search"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="@drawable/circle_conversation_search_bg"
        android:gravity="center_vertical"
        android:paddingBottom="4dp"
        android:paddingLeft="14dp"
        android:paddingRight="14dp"
        android:paddingTop="4dp">

        <EditText
            android:id="@+id/commonsdk_et_search_content"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@null"
            android:gravity="center_vertical"
            android:imeOptions="actionSearch"
            android:inputType="text"
            android:maxLines="1"
            android:singleLine="true"
            android:textColor="#333333"
            android:textColorHint="#cccccc"
            android:textSize="15sp" />
    </LinearLayout>

    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        android:paddingLeft="9dp"
        android:paddingRight="14dp">

        <ImageView
            android:id="@+id/commonsdk_iv_search_cancle"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:gravity="center_vertical"
            android:src="@drawable/arrow_left_back"
            android:visibility="gone" />

        <TextView
            android:id="@+id/commonsdk_tv_search_cancle"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:gravity="center_vertical"
            android:textColor="#A1B2C6"
            android:textSize="15sp" />
    </FrameLayout>
</LinearLayout>
2.自定義屬性
<!--搜尋框 -->
<declare-styleable name="CustomSearchView">
    <attr name="search_hint" format="string"></attr>
    <attr name="search_left_icon" format="reference"></attr>
    <attr name="search_right_icon" format="reference"></attr>
    <attr name="search_left_text" format="string"></attr>
    <attr name="search_right_text" format="string"></attr>
</declare-styleable>
3.自定義控制元件
package com.dejun.commonsdk.wight;

import android.content.Context;
import android.content.res.TypedArray;
import android.support.annotation.Nullable;
import android.text.Editable;
import android.text.TextWatcher;
import android.util.AttributeSet;
import android.view.KeyEvent;
import android.view.LayoutInflater;
import android.view.View;
import android.view.inputmethod.EditorInfo;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;
import com.dejun.commonsdk.R;

/**
 * Author:DoctorWei
 * Time:2018/12/28 9:10
 * Description:自定義搜尋框
 * email:
[email protected]
*/ public class CustomSearchView extends RelativeLayout implements View.OnClickListener { private ImageView mIvSearchBack;//返回鍵 private TextView mTvSearchBack;//返回鍵 private EditText mDetSearchContent;//編輯框搜尋內容 private TextView mTvCancle;//搜尋框取消 private ImageView mIvCancle; public CustomSearchView(Context context, @Nullable AttributeSet attrs) { super(context, attrs); initView(context, attrs); } private void initView(Context context, AttributeSet attrs) { View view = LayoutInflater.from(context).inflate(R.layout.search_view_layout, this); mIvSearchBack = view.findViewById(R.id.commonsdk_iv_search_back); mTvSearchBack = view.findViewById(R.id.commonsdk_tv_search_back); mDetSearchContent = view.findViewById(R.id.commonsdk_et_search_content); mTvCancle = view.findViewById(R.id.commonsdk_tv_search_cancle); mIvCancle = view.findViewById(R.id.commonsdk_iv_search_cancle); mIvSearchBack.setOnClickListener(this); mTvSearchBack.setOnClickListener(this); mTvCancle.setOnClickListener(this); mIvCancle.setOnClickListener(this); //獲取設定屬性 TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.CustomSearchView); String string = typedArray.getString(R.styleable.CustomSearchView_search_hint);//提示文字 int leftIcon = typedArray.getResourceId(R.styleable.CustomSearchView_search_left_icon, R.drawable.arrow_left_back); int rightIcon = typedArray.getResourceId(R.styleable.CustomSearchView_search_right_icon, R.drawable.arrow_left_back); String leftText = typedArray.getString(R.styleable.CustomSearchView_search_left_text); String rightText = typedArray.getString(R.styleable.CustomSearchView_search_right_text); if (typedArray.hasValue(R.styleable.CustomSearchView_search_hint)) { mDetSearchContent.setHint(string); } if (typedArray.hasValue(R.styleable.CustomSearchView_search_left_icon)) { mIvSearchBack.setImageResource(leftIcon); } if (typedArray.hasValue(R.styleable.CustomSearchView_search_right_icon)) { mIvCancle.setImageResource(rightIcon); } if (typedArray.hasValue(R.styleable.CustomSearchView_search_left_text)) { mTvSearchBack.setText(leftText); } if (typedArray.hasValue(R.styleable.CustomSearchView_search_right_text)) { mTvCancle.setText(rightText); } mDetSearchContent.addTextChangedListener(new TextWatcher() { @Override public void beforeTextChanged(CharSequence s, int start, int count, int after) { if (watchListener != null) { watchListener.beforeTextChanged(s, start, count, after); } } @Override public void onTextChanged(CharSequence s, int start, int before, int count) { if (watchListener != null) { watchListener.onTextChanged(s, start, count, count); } } @Override public void afterTextChanged(Editable s) { if (watchListener != null) { watchListener.afterTextChanged(s); } } }); mDetSearchContent.setOnEditorActionListener(new TextView.OnEditorActionListener() { @Override public boolean onEditorAction(TextView v, int actionId, KeyEvent event) { if (actionId == EditorInfo.IME_ACTION_SEARCH) { if (searchViewSearchListener != null) { String content = v.getText().toString(); searchViewSearchListener.search(content); } return true; } return false; } }); } @Override public void onClick(View v) { int id = v.getId(); if (id == R.id.commonsdk_iv_search_back) { searchViewListener.ivLeftBackClick(id); } else if (id == R.id.commonsdk_tv_search_back) { searchViewListener.tvLeftBackClick(id); } else if (id == R.id.commonsdk_iv_search_cancle) { searchViewListener.ivRightBackClick(id); } else if (id == R.id.commonsdk_tv_search_cancle) { searchViewListener.tvRightLeftBackClick(id); } } public WatchListener watchListener; public CustomSearchView setWatchListener(WatchListener watchListener) { this.watchListener = watchListener; return this; } public interface WatchListener { void beforeTextChanged(CharSequence s, int start, int count, int after); void onTextChanged(CharSequence s, int start, int before, int count); void afterTextChanged(Editable s); } public SearchViewListener searchViewListener; public CustomSearchView setSearchViewListener(SearchViewListener searchViewListener) { this.searchViewListener = searchViewListener; return this; } public abstract static class SearchViewListener { public void ivLeftBackClick(int id) { } public void tvLeftBackClick(int id) { } public void ivRightBackClick(int id) { } public void tvRightLeftBackClick(int id) { } } public SearchViewSearchListener searchViewSearchListener; public CustomSearchView setSearchViewSearchListener(SearchViewSearchListener searchViewSearchListener) { this.searchViewSearchListener = searchViewSearchListener; return this; } public interface SearchViewSearchListener { void search(String content); } } 4.使用
<com.dejun.commonsdk.wight.CustomSearchView
    android:id="@+id/csv"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:search_left_icon="@drawable/arrow_left_back"
    app:search_hint="搜尋內容"
    app:search_right_text="完成"
    app:search_backgound="#ff00">
</com.dejun.commonsdk.wight.CustomSearchView>