Search Dialog

Additional

Language
Java
Version
N/A
Created
May 16, 2017
Updated
Jul 6, 2017
Owner
Mohammad Mirrajabi (mirrajabi)
Contributors
Alashow (alashow)
Mohammad Mirrajabi (mirrajabi)
irsalshabirin
3
Activity
Badge
Generate
Download
Source code

Show card

search-dialog

An awesome and customizable search dialog with built-in search options.

Usage

First add jitpack to your projects build.gradle file

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

Then add the dependency in modules build.gradle file

dependencies {
    compile 'com.github.mirrajabi:search-dialog:1.2'
}

Simple usage

if you just want to use the simple search dialog first you need to provide searchable items. to achieve this you should implement Searchable in your model.

you can see the SampleSearchModel for example :

public class SampleSearchModel implements Searchable {
    private String mTitle;

    public SampleSearchModel(String title) {
        mTitle = title;
    }

    @Override
    public String getTitle() {
        return mTitle;
    }

    public SampleSearchModel setTitle(String title) {
        mTitle = title;
        return this;
    }
}

now generate some search options in your activity :

    private ArrayList<SampleSearchModel> createSampleData(){
        ArrayList<SampleSearchModel> items = new ArrayList<>();
        items.add(new SampleSearchModel("First item"));
        items.add(new SampleSearchModel("Second item"));
        items.add(new SampleSearchModel("Third item"));
        items.add(new SampleSearchModel("The ultimate item"));
        items.add(new SampleSearchModel("Last item"));
        items.add(new SampleSearchModel("Lorem ipsum"));
        items.add(new SampleSearchModel("Dolor sit"));
        items.add(new SampleSearchModel("Some random word"));
        items.add(new SampleSearchModel("guess who's back"));
        return items;
    }

then you just need to add the below lines where you want to show the dialog :

new SimpleSearchDialogCompat(MainActivity.this, "Search...",
                        "What are you looking for...?", null, createSampleData(),
                        new SearchResultListener<SampleSearchModel>() {
                            @Override
                            public void onSelected(BaseSearchDialogCompat dialog,
                                                   SampleSearchModel item, int position) {
                                Toast.makeText(MainActivity.this, item.getTitle(),
                                        Toast.LENGTH_SHORT).show();
                                dialog.dismiss();
                            }
                        }).show();

The constructor parameters are

SimpleSearchDialogCompat(Context context, String title, String searchHint,
                                    @Nullable Filter filter, ArrayList<T> items,
                                    SearchResultListener<T> searchResultListener)

Loading view(added to SimpleSearchDialogCompat in v1.1)

Just use setLoading(true) for showing and setLoading(false) for hiding it on an instance of SimpleSearchDialogCompat

Changing default adapters text colors(added in v1.2.1)

If you want to change the default colors just override these colors in your colors.xml or wherever you want like this.

    <color name="searchDialogResultColor"/>
    <color name="searchDialogResultHighlightColor"/>

Advanced usage

The layout

I used this layout for simple search dialog but you can use anything else. Of course your layout should have thse two views :

  • An EditText to use as search key input
  • A RecyclerView for showing the results in it

The search dialog

You can use your custom layouts, adapters and search options by creating a class inheriting the BaseSearchDialogCompat take a look at SimpleSearchDialogCompat to see an example of how it can be done You should implement the BaseSearchDialogCompat methods :

    // handle your view with this one
    protected abstract void getView(View view);
    // Id of your custom layout
    @LayoutRes protected abstract int getLayoutResId();
    // Id of the search edittext you used in your custom layout
    @IdRes protected abstract int getSearchBoxId();
    // Id of the recyclerview you used in your custom layout
    @IdRes protected abstract int getRecyclerViewId();

The search filter

You can use your custom filters for text searching. The one used in SimpleSearchDialogCompat is SimpleSearchFilter. It checks the search key and if an item and the key had partially exact same letters it will add that item to results and also if the CheckLCS was set to true, it will check if the amount of matching letters was bigger than the given AccuracyPercentage the item will be added to results

The adapter

the one used in SimpleSearchDialogCompat is so simple despite its too long. the main functionality is in initializeViews method. you can create your custom adapters and use it instead of this one

The StringsHelper

it has two methods which you can use for highlighting the results.

/*
 * Returns a SpannableString with 
 * highlighted LCS(Longest Common Subsequence)
 * of two strings with the givven color
 */
SpannableStringBuilder highlightLCS(String text1, String text2, int highlightColor);

// Returns the LCS(Longest Common Subsequence) of two strings
String lcs(String text1, String text2) 

See the sample app to get a better understanding of the advanced usage

Used in sample app

Changelog

1.2.1 - Adds an option for changing text color and highlight color of default adapter.

1.2 - Adds getter for views in simple search dialog and an option to turn off the auto filtering on search edittext.

1.1.1 - Fixes drawable overriding issue.

1.1 - Adds loading feature.