Creating Filter By activity from ListView Volley using JSON

Good news Wilfredo!

I managed to find some spare time in between my exams and got this done for you! I've tested my blog reader code out and adapted it with some of your data:

It's quite late now for me as I do have school tomorrow so, I'll get the code all sorted for you tomorrow! :)

Hey again Wilfredo!

I've put my project files into a zip file which you can download here

Along with the zip file are some instructions on how to import the project into Android Studio, should you need them.

Note that I haven't included everything from your JSON file and am only using three of the keys but, I'll leave the rest to you, I thought this would just act as a good starting point so that you can understand what is happening.

I've commented throughout the project so, everything should make sense but, if not, let me know what you don't understand :)

If you prefer to not download the project, you can also use the code which I will include some stripped down code below (This code is simply on how you access JSON data - I don't want to create a really long post of code even though it is already!)

GetJSONDataTask

    private class GetJSONDataTask extends AsyncTask<Object, Void, JSONArray> {

        @Override
        protected JSONArray doInBackground(Object... arg0) {
            // Set default values in case something goes wrong.
            int responseCode = -1;
            // Ignore this warning (Or suppress it). We are setting this default responseCode
            // in case something goes wrong.
            JSONArray jsonResponse = null;
            mData = null;

            try {
                // Start connection.
                URL jsonUrl = new URL("http://wlodsgn.x10host.com/json/vrxjns.json");
                HttpURLConnection connection = (HttpURLConnection) jsonUrl.openConnection();
                connection.connect();

                // Get the response code (If it is ok, if statement will run).
                responseCode = connection.getResponseCode();
                if (responseCode == HttpURLConnection.HTTP_OK) {
                    // This code will create an InputStream, storing each character and
                    // appending it to responseData.
                    InputStream inputStream = connection.getInputStream();
                    Reader reader = new InputStreamReader(inputStream);
                    int nextCharacter; // read() returns an int, we cast it to char later
                    String responseData = "";
                    while(true){ // Infinite loop, can only be stopped by a "break" statement
                        nextCharacter = reader.read(); // read() without parameters returns one character
                        if(nextCharacter == -1) // A return value of -1 means that we reached the end
                            break;
                        responseData += (char) nextCharacter; // The += operator appends the character to the end of the string
                    }

                    // Create a JSONArray (This is how you data is stored) with these characters.
                    jsonResponse = new JSONArray(responseData);
                }
                else {
                    Log.i(TAG, "Unsuccessful HTTP Response Code: " + responseCode);
                }
            } catch (Exception e) {
                Log.e(TAG, "Exception caught!", e);
            }
            return jsonResponse;
        }
        @Override
        protected void onPostExecute(JSONArray result) {
            mData = result;
            handleResponse();   // This is for you to handle this data - you can do this with a for loop as shown below, for example.
        }
    }

for loop to get JSONObjects

                for (int i = 0; i < mData.length(); i++) {
                    JSONObject post = mData.getJSONObject(i);

                    String title = post.getString(KEY_TITLE);
                    title = Html.fromHtml(title).toString();

                    String brand = post.getString(KEY_BRAND);
                    brand = Html.fromHtml(brand).toString();

                    HashMap<String, String> listItem = new HashMap<>();
                    listItem.put(KEY_TITLE, title);
                    listItem.put(KEY_BRAND, brand);

                    listItems.add(listItem);
                }

Hope it helps and good luck with your project! Any questions, give me a shout :)

Thanks a lot Harry! I'll be checking it out tonight or tomorrow since my PC's HD went nuts and its not letting me get in. Hope is not something bad and I am trying to get it fixed. Once again, thanks for taking your time and I will let you know if I need any help :)

Hey Harry!

Ok, so after a night of backing up my information from my now defunct hard drive, I was able to install android studio into my macbook pro and use it temporarily while I setup everything back into my new hard drive and get my PC back up and running.

I was able to check the example you did (which I really appreciate it) and basically thats the idea of creating my listview although when I click on any item in the list I would like to show an image with info like I did here with my listview using google volley:

This is ListView of the products

This is the next activity when you select on a product from ListView

Now, what I would like to do is to have a Filter By in the actionbar where the listview of the products are located (actionbar in first image) just like JackThreads have in their application:

And this is the way I would like to show when you press on the filter

Any ideas on how to do it and which method I should use to implement it? I mean using Google Volley like the example I have above or do I have to use Asynctask and use a database like phpMyAdmin to create the filter.

Let me know :)

Thanks!

I don't know how to go about this with Google Volley (I have never used Google Volley before) but, you can always filter with if statements by slightly modifying the for statement:

                for (int i = 0; i < mData.length(); i++) {
                    JSONObject post = mData.getJSONObject(i);

                    String title = post.getString(KEY_TITLE);
                    title = Html.fromHtml(title).toString();

                    String brand = post.getString(KEY_BRAND);
                    brand = Html.fromHtml(brand).toString();

                    HashMap<String, String> listItem = new HashMap<>();

                    if (title.equals("Verox's 1001 Jeans")) {
                        listItem.put(KEY_TITLE, title);
                        listItem.put(KEY_BRAND, brand);
                        listItems.add(listItem);
                    }
                }

As you can see, I've added a if statement that will check if the title is equal to Verox's 1001 Jeans. If it is, add the item to the list. If it isn't, ignore it.

Alternatively, you can also run this in the php file when outputting to JSON. So, instead of outputting everything to JSON, only output the JSONObjects you want.

Either way works, it's personal preference which way you want to do it!

Hope it helps and, if you have any more questions, give me a shout :)

Awesome! Going to give it a try and will let you know if need any help.

Thanks!

Hello Harry!

Sorry to bother you again but have been fiddling around with the project you sent me and implementing it to the one I am currently working with some modifications. Was trying to implement your code when pressing ListView to WebView and change it from a clicklistener NetworkImageView to a Fullscreen NetworkImageView in another activity.

This is the screenshot of the three images I want to make Fullscreen when pressed:

By the way, I decided to upload my project here So you can have an idea how I am elaborating everything and also you can see how Volley library is implemented and get to know it a little. A win win for both! :D

So, here is what I am doing right now under JeansDetailsActivity.java:

@Override
    public void onItemClick(NetworkImageView n, View v, int position, long id) {
        super.onItemClick(n, v, position, id);

        // Let's show the image when the user clicks on the entry!

        try {
            JSONObject obj = response.getJSONObject(i);
            String imgUrl = obj.getString("image");
            Intent intent = new Intent(this, JnsDetailsFSActivity.class);
            intent.setData(Uri.parse(imgUrl));
            startActivity(intent);
        } catch (JSONException e) {
            /**logException(e);**/
        }
    }

I am trying to implement a clicklistener so when the image is pressed, it will open another activity that will show the image in fullscreen but haven't been able to solve the errors that are being shown (You will see them when you open the project). Hope to add a page adapter or something similar in the future so when I click one of the images, it can show all three of them while swiping.

This is what I have in the activity that will have the fullscreen image when clicked:

package com.wlodsgn.bunbunup;

import android.content.Intent;
import android.net.Uri;
import android.os.Bundle;
import android.webkit.WebView;

public class JnsDetailsFSActivity {

    protected String mImage;

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

        Intent intent = getIntent();
        Uri blogUri = intent.getData();
        mImage = blogUri.toString();

        JnsDetailsFSActivity jnsDetailsFSActivity = (JnsDetailsFSActivity) findViewById(R.id.thumbnailfs);
        jnsDetailsFSActivity.loadImage(mImage);
    }

}

Once again appreciate your time since I know you got a lot of work (like I do) so take your time in answering.

Cheers!

Done! By the way, I created an account through GitHub last night so if you find it more easier to use it this way, then you are more than welcome :D