How to achieve search interface on JSON data in a listview

Question

I am making an Application which parse the JSON data into a listview. I also want to add a search dialog in the toolbar. But i don't know how to achieve this. I had checked the Android Developer document, but i am still stuck. So, any ideas, any suggestions would be helpful.

Here is my MainActivity.java

public class MainActivity extends AppCompatActivity implements LoaderCallbacks<List<PlayerDetails>> {

public static final String LOG_TAG = MainActivity.class.getName();

private static final int PLAYER_ID = 1;

private static final String PLAYER_DETAILS_URL =
        "http://hackerearth.0x10.info/api/gyanmatrix?type=json&query=list_player";

private ListView playerListView;
private PlayerAdapter mAdapter;
private ProgressBar mProgressBar;
private TextView mPlayerTextView;
MaterialSearchView searchView;


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

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);
    getSupportActionBar().setTitle(R.string.app_name);
    toolbar.setTitleTextColor(Color.parseColor("#FFFFFF"));

    searchView = (MaterialSearchView) findViewById(R.id.search_view);

    mAdapter = new PlayerAdapter(this, new ArrayList<PlayerDetails>());

    playerListView = (ListView) findViewById(R.id.list);

    mPlayerTextView = (TextView) findViewById(R.id.empty_text_view);

    playerListView.setAdapter(mAdapter);

    searchView.setOnSearchViewListener(new MaterialSearchView.SearchViewListener() {
        @Override
        public void onSearchViewShown() {
        }

        @Override
        public void onSearchViewClosed() {
            mAdapter = new PlayerAdapter(MainActivity.this, new ArrayList<PlayerDetails>());
            playerListView.setAdapter(mAdapter);
        }
    });

    playerListView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
        @Override
        public void onItemClick(AdapterView<?> parent, View view, int position, long id) {

            PlayerDetails player = mAdapter.getItem(position);

            String playerImage = player.getImage();
            String playerName = player.getName();
            String playerCountry = player.getCountry();
            String playerDesc = player.getDesc();
            String playerRuns = player.getTotalScore();
            String playerMatches = player.getMatchesPlayed();

            Intent intent = new Intent(MainActivity.this, PlayerDetailsActivity.class);
            intent.putExtra("playerImage", playerImage);
            intent.putExtra("playerName", playerName);
            intent.putExtra("playerCountry", playerCountry);
            intent.putExtra("playerDesc", playerDesc);
            intent.putExtra("playerRuns", playerRuns);
            intent.putExtra("playerMatches", playerMatches);

            startActivity(intent);
        }
    });

    ConnectivityManager manager = (ConnectivityManager) getSystemService(Context.CONNECTIVITY_SERVICE);
    NetworkInfo networkInfo = manager.getActiveNetworkInfo();

    if (networkInfo != null && networkInfo.isConnected()) {
        getLoaderManager().initLoader(PLAYER_ID, null, this).forceLoad();
    } else {
        mProgressBar = (ProgressBar) findViewById(R.id.loading_spinner);
        mProgressBar.setVisibility(View.INVISIBLE);
    }
}



@Override
public Loader<List<PlayerDetails>> onCreateLoader(int id, Bundle args) {

    Uri baseUri = Uri.parse(PLAYER_DETAILS_URL);
    Uri.Builder uriBuilder = baseUri.buildUpon();

    return new PlayerLoader(this, uriBuilder.toString());
}

@Override
public void onLoadFinished(Loader<List<PlayerDetails>> loader, List<PlayerDetails> data) {
    Log.v("MainActivity", "The UI is created via onLoadFinished");

    mProgressBar = (ProgressBar) findViewById(R.id.loading_spinner);
    mProgressBar.setVisibility(View.GONE);

    mPlayerTextView = (TextView) findViewById(R.id.empty_text_view);
    mPlayerTextView.setVisibility(View.GONE);
    // Clear the adapter of previous earthquake data
    mAdapter.clear();

    // If there is a valid list of {@link Earthquake}s, then add them to the adapter's
    // data set. This will trigger the ListView to update.
    if (data != null && !data.isEmpty()) {
        mAdapter.addAll(data);
    }
}

@Override
public void onLoaderReset(Loader<List<PlayerDetails>> loader) {
    Log.v("MainActivity", "The data is destroyed and the Loader is reset via onLoadReset()");
    //Loader reset, so we can clear out all the existing data
    mAdapter.clear();
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {

    getMenuInflater().inflate(R.menu.menu_search, menu);
    MenuItem searchItem = menu.findItem(R.id.search);
    searchView.setMenuItem(searchItem);
    return true;
}

}

and My Adapter.java class is

public class PlayerAdapter extends ArrayAdapter<PlayerDetails> {

public PlayerAdapter(Activity context, ArrayList<PlayerDetails> players) {
    super(context, 0, players);
}

@NonNull
@Override
public View getView(int position, @Nullable View convertView, @NonNull ViewGroup parent) {

    View listItemView = convertView;
    if (listItemView == null) {
        listItemView = LayoutInflater.from(getContext()).inflate(
                R.layout.list_item, parent, false);
    }
    PlayerDetails currentPlayer = getItem(position);

    ImageView playerImageView = (ImageView) listItemView.findViewById(R.id.player_image_view);

    Glide.with(getContext()).load(currentPlayer.getImage())
            .crossFade()
            .thumbnail(0.5f)
            .bitmapTransform(new CircleTransform(getContext()))
            .diskCacheStrategy(DiskCacheStrategy.ALL)
            .into(playerImageView);

    TextView playerNameTextView = (TextView) listItemView.findViewById(R.id.player_name_text_view);
    playerNameTextView.setText(currentPlayer.getName());

    TextView playerCountryTextView = (TextView) listItemView.findViewById(R.id.player_country);
    playerCountryTextView.setText(currentPlayer.getCountry());

    return listItemView;
}

}

Answer 1

Add menu item search in the activity bar inflate it and then in your activity

  if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
        MenuItem searchMenuItem = menu.findItem(R.id.action_search);
        if (searchMenuItem == null) {
            return;
        }
        SearchView searchView = (SearchView) searchMenuItem.getActionView();
        searchView.setOnQueryTextListener(mSearchQueryTextListener);
    }

 protected SearchView.OnQueryTextListener mSearchQueryTextListener
        = new SearchView.OnQueryTextListener() {
    @Override
    public boolean onQueryTextSubmit(String query) {
        return false;
    }

    @Override
    public boolean onQueryTextChange(String s) {
        onSearchTextChanged(s);
        return false;
    }
};

now in onSearchTextChanged search the string in the list using contains keyword Arraylist.contains(s) and reload the list

Hope it helps

Answer 2

You have to create to implement the getFilter() in your adapter and create a Filter class that will filter based on the search criteria. Here is an example: https://gist.github.com/tobiasschuerg/3554252