MaterialSearchBar

شريط بحث المواد أندرويد

شريط بحث تصميم المواد لنظام Android

---

ستساعدك هذه المكتبة الجميلة وسهلة الاستخدام على إضافة Lollipop Material Design SearchView في مشروعك.

---

انظر لدينا ويكي

كيفية الاستخدام

لتضمين SearchBar في مشروعك:

أضف هذا الكود إلى ملف build.gradle على مستوى المشروع

 allprojects {
	repositories {
		.. .
		maven { url " https://jitpack.io " }
	}
}

أضف التبعية إلى ملف build.gradle على مستوى التطبيق

 dependencies {
	implementation ' com.github.mancj:MaterialSearchBar:X.X.X '
}

ثم أضف SearchBar إلى نشاطك:

< com .mancj.materialsearchbar.MaterialSearchBar
    style = " @style/MaterialSearchBarLight "
    app : mt_speechMode = " true "
    app : mt_hint = " Custom hint "
    app : mt_maxSuggestionsCount = " 10 "
    android : layout_width = " match_parent "
    android : layout_height = " wrap_content "
    android : id = " @+id/searchBar " />

---

يحتوي MaterialSearchBar على سمات XML التالية:

يصف	وصف
mt_speechMode	إذا تم التعيين على "صحيح"، فسيتم عرض رمز الميكروفون بدلاً من رمز البحث
mt_maxSuggestionsCount	يحدد الحد الأقصى لعدد استعلامات البحث المخزنة
mt_navIconEnabled	تمكين رمز التنقل
mt_roundedSearchBarEnabled	استخدم شريط البحث على شكل كبسولة على الإصدار v21+ ثم عد إلى الوضع الافتراضي في الإصدار السفلي
mt_dividerColor	ضبط ألوان الاقتراحات وفواصل القائمة
mt_searchBarColor	ضبط اللون الرئيسي لشريط البحث
mt_menuIconDrawable	تعيين قابل للرسم من أيقونة القائمة
mt_searchIconDrawable	قم بتعيين رمز البحث القابل للرسم عندما يكون وضع الكلام خاطئًا
mt_speechIconDrawable	قم بتعيين رمز الكلام القابل للرسم عندما يكون وضع الكلام صحيحًا
mt_backIconDrawable	تعيين قابل للرسم من أيقونة السهم الخلفي
mt_clearIconDrawable	تعيين قابل للرسم من الأيقونة الواضحة
mt_navIconTint	ضبط لون الصبغة لأيقونة التنقل/الرجوع المتحركة
mt_menuIconTint	ضبط لون خفيف لرمز القائمة
mt_searchIconTint	ضبط لون البحث/رمز الكلام
mt_backIconTint	ضبط لون الصبغة لرمز السهم الخلفي
mt_clearIconTint	ضبط لون الصبغة للرمز الواضح
mt_navIconUseTint	هل يجب أن يستخدم رمز التنقل المتحرك لونًا خفيفًا
mt_menuIconUseTint	يجب أن يستخدم رمز القائمة لون الصبغة
mt_searchIconUseTint	يجب أن يستخدم رمز البحث/الكلام لون الصبغة
mt_backIconUseTint	يجب أن يستخدم الرمز الخلفي لون الصبغة
mt_clearIconUseTint	يجب أن يستخدم الرمز الواضح لون الصبغة
mt_hint	قم بتعيين نص التلميح عندما يكون شريط البحث مركّزًا ويكون استعلام البحث فارغًا
mt_placeholder	قم بتعيين نص العنصر النائب عندما لا يتم التركيز على MaterialSearchBar
mt_textColor	ضبط لون النص
mt_hintColor	تعيين لون التلميح
mt_placeholderColor	تعيين لون العنصر النائب
mt_textCursorTint	ضبط لون مؤشرات النص
mt_highlightedTextColor	ضبط لون تسليط الضوء على النص

---

الأساليب العامة:

• addTextChangeListener(TextWatcher textWatcher)
• clearSuggestions()
• closeSearch()
• openSearch()
• getLastSuggestions()
• getMenu()
• getText()
• hideSuggestionList()
• inflateMenu(int menuResource)
• inflateMenu(int menuResource, int icon)
• isSearchOpened()
• isSpeechModeEnabled()
• isSuggestionsVisible()
• setArrowIcon(int arrowIconResId)
• setArrowIconTint(int arrowIconTint)
• setCardViewElevation(int elevation)
• setClearIcon(int clearIconResId)
• setClearIconTint(int clearIconTint)
• setCustomSuggestionAdapter(SuggestionsAdapter suggestionAdapter)
• setDividerColor(int dividerColor)
• setHint(CharSequence hintText)
• setIconRippleStyle(boolean borderlessRippleEnabled)
• setLastSuggestions(List suggestions)
• setMaxSuggestionCount(int maxSuggestionsCount)
• setMenuDividerEnabled(boolean menuDividerEnabled)
• setMenuIcon(int menuIconResId)
• setMenuIconTint(int menuIconTint)
• setNavButtonEnabled(boolean navButtonEnabled)
• setNavIconTint(int navIconTint)
• setOnSearchActionListener(OnSearchActionListener onSearchActionListener)
• setPlaceHolder(CharSequence placeholder)
• setPlaceHolderColor(int placeholderColor)
• setRoundedSearchBarEnabled(boolean roundedSearchBarEnabled)
• setSearchIcon(int searchIconResId)
• setSearchIconTint(int searchIconTint)
• setSpeechModeEnabled(boolean speechMode)
• setSuggestionsClickListener(SuggestionsAdapter.OnItemViewClickListener listener)
• setText(String text)
• setTextColor(int textColor)
• setTextHighlightColor(int highlightedTextColor)
• setTextHintColor(int hintColor)
• showSuggestions()
• updateLastSuggestions(List suggestions)

---

شريط البحث عن مواد التصميم

نمط مخصص - style.xml قم بإنشاء نمط مخصص واستخدم أحد الأنماط المتوفرة كالأصل.

Provided Styles are: MaterialSearchBarLight and MaterialSearchBarDark

Example:
< style name = " MyCustomTheme " parent = " MaterialSearchBarLight " >
     < item name = " mt_searchBarColor " >@color/searchBarPrimaryColor</ item >
            < item name = " mt_dividerColor " >@color/searchBarDividerColor</ item >
            < item name = " mt_navIconTint " >@color/searchBarNavIconTintColor</ item >
            < item name = " mt_searchIconTint " >@color/searchBarSearchIconTintColor</ item >
            < item name = " mt_clearIconTint " >@color/searchBarClearIconTintColor</ item >
            < item name = " mt_menuIconTint " >@color/searchBarMenuIconTintColor</ item >
            < item name = " mt_backIconTint " >@color/searchBarBackIconTintColor</ item >
            < item name = " mt_textCursorTint " >@color/searchBarCursorColor</ item >
            < item name = " mt_textColor " >@color/searchBarTextColor</ item >
            < item name = " mt_hintColor " >@color/searchBarHintColor</ item >
            < item name = " mt_placeholderColor " >@color/searchBarPlaceholderColor</ item >
            < item name = " mt_highlightedTextColor " >@color/searchBarTextHighlightColor</ item >
</ style >

أو

الألوان المخصصة -colors.xml ما عليك سوى ضبط/تغيير هذه الألوان (أو بعضها) وسيكون لديك النمط المخصص الخاص بك.

    //Material SearchBar Light Theme Colors
        < color name = " searchBarIconColor " >#3a3a3a</ color >
        //Base
        < color name = " searchBarPrimaryColor " >#FFFFFF</ color >
        < color name = " searchBarCursorColor " >#8000a1ff</ color >
        < color name = " searchBarDividerColor " >#1F000000</ color >
    
        //Icons
        < color name = " searchBarNavIconTintColor " >@color/searchBarIconColor</ color >
        < color name = " searchBarMenuIconTintColor " >@color/searchBarIconColor</ color >
        < color name = " searchBarSearchIconTintColor " >@color/searchBarIconColor</ color >
        < color name = " searchBarClearIconTintColor " >@color/searchBarIconColor</ color >
        < color name = " searchBarBackIconTintColor " >@color/searchBarIconColor</ color >
    
        //Text
        < color name = " searchBarTextColor " >#DE000000</ color >
        < color name = " searchBarHintColor " >#42000000</ color >
        < color name = " searchBarPlaceholderColor " >#8A000000</ color >
        < color name = " searchBarTextHighlightColor " >#8000a1ff</ color >
    
        //Base
        < color name = " searchBarPrimaryColorDark " >#303030</ color >
        < color name = " searchBarDividerColorDark " >#1FFFFFFF</ color >
    
        //Material SearchBar Dark Theme Colors
        < color name = " searchBarIconColorDark " >#00a1ff</ color >
        //Icons
        < color name = " searchBarNavIconTintColorDark " >@color/searchBarIconColorDark</ color >
        < color name = " searchBarMenuIconTintColorDark " >@color/searchBarIconColorDark</ color >
        < color name = " searchBarSearchIconTintColorDark " >@color/searchBarIconColorDark</ color >
        < color name = " searchBarClearIconTintColorDark " >@color/searchBarIconColorDark</ color >
        < color name = " searchBarBackIconTintColorDark " >@color/searchBarIconColorDark</ color >
    
        //Text
        < color name = " searchBarTextColorDark " >#DEFFFFFF</ color >
        < color name = " searchBarHintColorDark " >#42FFFFFF</ color >
        < color name = " searchBarPlaceholderColorDark " >#8AFFFFFF</ color >
        < color name = " searchBarTextHighlightColorDark " >#BF00a1ff</ color >

---

لحفظ استعلامات البحث عند تدمير النشاط، استخدم طريقة searchBar.getLastSuggestions() ثم لاستعادتها استخدم searchBar.setLastSuggestions(List<String>); كما هو موضح في المثال أدناه

مثال

فيما يلي مثال بسيط لاستخدام MaterialSearchBar

 private List < String > lastSearches ;
private MaterialSearchBar searchBar ;

@ Override
protected void onCreate ( Bundle savedInstanceState ) {
    super . onCreate ( savedInstanceState );
    setContentView ( R . layout . activity_main );

    searchBar = ( MaterialSearchBar ) findViewById ( R . id . searchBar );
    searchBar . setHint ( "Custom hint" );
    searchBar . setSpeechMode ( true );
    //enable searchbar callbacks
    searchBar . setOnSearchActionListener ( this );
    //restore last queries from disk
    lastSearches = loadSearchSuggestionFromDisk ();
    searchBar . setLastSuggestions ( list );
    //Inflate menu and setup OnMenuItemClickListener
    searchBar . inflateMenu ( R . menu . main );
    searchBar . getMenu (). setOnMenuItemClickListener ( this );
}

@ Override
protected void onDestroy () {
    super . onDestroy ();
    //save last queries to disk
    saveSearchSuggestionToDisk ( searchBar . getLastSuggestions ());
}

@ Override
public void onSearchStateChanged ( boolean enabled ) {
    String s = enabled ? "enabled" : "disabled" ;
    Toast . makeText ( MainActivity . this , "Search " + s , Toast . LENGTH_SHORT ). show ();
}

@ Override
public void onSearchConfirmed ( CharSequence text ) {
    startSearch ( text . toString (), true , null , true );
}

@ Override
public void onButtonClicked ( int buttonCode ) {
    switch ( buttonCode ){
        case MaterialSearchBar . BUTTON_NAVIGATION :
            drawer . openDrawer ( Gravity . LEFT );
            break ;
        case MaterialSearchBar . BUTTON_SPEECH :
            openVoiceRecognizer ();
    }
}

المزيد من الأمثلة