Bdtjtk

Those are categories and subcategories. There can be subcategory or not.
JsonCode to be used is as below.

categoryId is what will change to call subcategories.
E.g. If you want to see subcategories of cars

Json Code

[{"Id":1,"TitleEN":"Cars","TitleAR":"سيارات","Photo":"http://souq.hardtask.co//Files/CategoryPhotos/ce686544-9f51-4213-b5db-7c015b788e8d.png","ProductCount":"3","HaveModel":"0","SubCategories":[{"Id":6,"TitleEN":"Cat6","TitleAR":"قسم6","Photo":"http://souq.hardtask.co//Files/CategoryPhotos/ce686544-9f51-4213-b5db-7c015b788e8d.png","ProductCount":"3","HaveModel":"0","SubCategories":}]},{"Id":2,"TitleEN":"Cat2","TitleAR":"قسم2","Photo":"http://souq.hardtask.co//Images/no_image.png","ProductCount":"8","HaveModel":"0","SubCategories":[{"Id":13,"TitleEN":"cat1 -1 ","TitleAR":"cat1 - 1","Photo":"http://souq.hardtask.co//Images/no_image.png","ProductCount":"8","HaveModel":"0","SubCategories":}]},{"Id":3,"TitleEN":"Cat3","TitleAR":"قسم3","Photo":"http://souq.hardtask.co//Images/no_image.png","ProductCount":"2","HaveModel":"0","SubCategories":},{"Id":4,"TitleEN":"Cat4","TitleAR":"قسم4","Photo":"http://souq.hardtask.co//Images/no_image.png","ProductCount":"1","HaveModel":"0","SubCategories":},{"Id":5,"TitleEN":"Cat5","TitleAR":"قسم5","Photo":"http://souq.hardtask.co//Images/no_image.png","ProductCount":"0","HaveModel":"0","SubCategories":},{"Id":8,"TitleEN":"Cat8","TitleAR":"قسم8","Photo":"http://souq.hardtask.co//Images/no_image.png","ProductCount":"0","HaveModel":"0","SubCategories":},{"Id":9,"TitleEN":"Slide01","TitleAR":"Slide02","Photo":"http://souq.hardtask.co//Files/CategoryPhotos/2ba07cb2-49a0-47e4-aba6-ef10a916fb12.png","ProductCount":"0","HaveModel":"0","SubCategories":}]

ImageAdapter

public class ImageAdapter extends BaseAdapter {

    private Context mContext;



    public ImageAdapter(Context c){

        mContext = c;

    }



    @Override

    public int getCount(){

        return images.size();

    }



    @Override

    public Object getItem(int position){

        return images.get(position);

    }



    public long getItemId(int position){

        return 0;

    }



    public View getView(int position, View convertView, ViewGroup parent){

        ImageView imageview;

        if (convertView == null){

            imageview = new ImageView(mContext);

            imageview.setPadding(0, 0, 0, 0);

            //imageview.setLayoutParams(new GridLayout.MarginLayoutParams(ViewGroup.LayoutParams.FILL_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));

            imageview.setScaleType(ImageView.ScaleType.CENTER_INSIDE);

            imageview.setAdjustViewBounds(true);

        } else {

            imageview = (ImageView) convertView;

        }



        Picasso.with(mContext).load(images.get(position)).placeholder(R.mipmap.ic_launcher).into(imageview);

        return imageview;

    }



    /*

    Custom methods

     */

    public void addItem(String url){

        images.add(url);

    }



    public void clearItems() {

        images.clear();

    }



    public ArrayList<String> images = new ArrayList<String>();

}

Movie Model

public class Movie implements Parcelable {

    public String TitleEN;

    public String TitleAR;

    public String Photo;

    public int id;



    public Movie(){



    }



    protected Movie(Parcel in) {

        TitleEN = in.readString();

        TitleAR = in.readString();

        Photo = in.readString();

        id = in.readInt();

    }



    @Override

    public int describeContents() {

        return 0;

    }



    @Override

    public void writeToParcel(Parcel dest, int flags) {

        dest.writeString(TitleEN);

        dest.writeString(TitleAR);

        dest.writeString(Photo);

        dest.writeInt(id);

    }



    @SuppressWarnings("unused")

    public static final Parcelable.Creator<Movie> CREATOR = new Parcelable.Creator<Movie>() {

        @Override

        public Movie createFromParcel(Parcel in) {

            return new Movie(in);

        }



        @Override

        public Movie newArray(int size) {

            return new Movie[size];

        }

    };

}

Fragament_main

    public class Fragament_main extends Fragment {





        public View mainFragmentView;

        public String LOG_TAG = "ShowcaseFragment";

        public ArrayList<Movie> movies = new ArrayList<Movie>();

        private RequestQueue mRequestQueue;

        public ImageAdapter imageAdapter;

        public static Fragament_main instance;

        GridView gridview;

        public boolean isDualPane = false;



        // static to preserve sorting over orientation changes (activity restart)

        public static String sortOrder = "popularity.desc", moreParams = "";

        public static boolean setting_cached = false;

        public int gridPos = -1;



        public Fragament_main() {

            // Required empty public constructor



            instance = this;





        }









     @Override

        public View onCreateView(LayoutInflater inflater, ViewGroup container,

                                 Bundle savedInstanceState) {

            mainFragmentView = inflater.inflate(R.layout.fragment_main, container, false);

            mRequestQueue = Volley.newRequestQueue(getContext());



            // setup adapters

            imageAdapter = new ImageAdapter(getContext());

            gridview = (GridView) mainFragmentView.findViewById(R.id.gridView);

            gridview.setAdapter(imageAdapter);



            //updateUI(setting_cached);

            //gridview.setOnItemClickListener(new GridClickListener());

            // manage grid col count wrt Orientation

            if (this.getResources().getConfiguration().orientation == Configuration.ORIENTATION_LANDSCAPE)

                setGridColCount(3);

            else

                setGridColCount(2);



            return mainFragmentView;

        }



        @Override

        public void onActivityCreated(Bundle savedInstanceState) {

            super.onActivityCreated(savedInstanceState);



        }



        @Override

        public void onSaveInstanceState(Bundle outState) {

            super.onSaveInstanceState(outState);

            outState.putInt("GRIDVIEW_POSITION", gridview.getFirstVisiblePosition());

        }



        @Override

        public void onCreate(Bundle savedInstanceState) {

            super.onCreate(savedInstanceState);

            if (savedInstanceState != null)

                gridPos = savedInstanceState.getInt("GRIDVIEW_POSITION");

        }



        @Override

        public void onDestroyView() {

            super.onDestroyView();

            mRequestQueue.cancelAll(new RequestQueue.RequestFilter() {

                @Override

                public boolean apply(Request<?> request) {

                    return true;

                }

            });

        }



        /*class GridClickListener implements AdapterView.OnItemClickListener {

            @Override

            public void onItemClick(AdapterView<?> adapterView, View view, int position, long id) {

                if (isDualPane){

                    android.support.v4.app.FragmentTransaction ft = getActivity().getSupportFragmentManager().beginTransaction();

                    DetailActivityFragment detailActivityFragment = DetailActivityFragment.newInstance(movies.get(position));

                    ft.replace(R.id.detailContainer, detailActivityFragment);

                    ft.commit();

                } else {

                    Intent intent = new Intent(getContext(), DetailActivity.class);

                    intent.putExtra(Intent.EXTRA_TEXT, (Parcelable) movies.get(position));

                    startActivity(intent);

                }

            }

        }*/



      /*  public void updateUI(boolean cached){

            movies.clear();

            imageAdapter.clearItems();

            setting_cached = cached;

            if (!cached)

                getMovies(sortOrder, moreParams);

            else

                getFavorites();

        }

    */

        public void getMovies(String sortOrder, String moreParams){

            String url = "http://souq.hardtask.co/app/app.asmx/GetCategories?categoryId=0&countryId=1";

            JsonObjectRequest req = new JsonObjectRequest(url, null,

                    new Response.Listener<JSONObject>() {

                        @Override

                        public void onResponse(JSONObject response) {

                            try {

                                JSONArray items = response.getJSONArray("results");

                                JSONObject movieObj;

                                for (int i=0; i<items.length(); i++){

                                    movieObj = items.getJSONObject(i);

                                    Movie movie = new Movie();

                                    movie.id = movieObj.getInt("id");

                                    movie.TitleEN = movieObj.getString("original_title");

                                    movie.TitleAR = movieObj.getString("overview");

                                    movie.Photo = "http://souq.hardtask.co/app/app.asmx/GetCategories?categoryId=0&countryId=1" + movieObj.getString("poster_path");

                                    movies.add(movie);

                                    // Add image to adapter

                                    imageAdapter.addItem(movie.Photo);

                                }

                            } catch (JSONException e){

                                e.printStackTrace();

                            }

                            getActivity().runOnUiThread(new Runnable() {

                                @Override

                                public void run() {

                                    gridview.setAdapter(imageAdapter);

                                    if (gridPos > -1)

                                        gridview.setSelection(gridPos);

                                    gridPos = -1;

                                }

                            });

                        }

                    }, new Response.ErrorListener() {

                @Override

                public void onErrorResponse(VolleyError error) {

                    Log.d(LOG_TAG, "Error in JSON Parsing");

                }

            });



            mRequestQueue.add(req);

        }



       /* public void getFavorites(){

            movies.addAll((new MoviesDB()).getFavoriteMovies(getContext().getContentResolver()));

            for (Movie movie : movies){

                imageAdapter.addItem(movie.Photo);

            }

            gridview.setAdapter(imageAdapter);

            if (gridPos > -1)

                gridview.setSelection(gridPos);

            gridPos = -1;

        }*/



        public void updateFavoritesGrid(){

            if (setting_cached) {

                int p = gridview.getLastVisiblePosition();

                ///updateUI(true);

                gridview.smoothScrollToPosition(p);

            }

        }



        public void setGridColCount(int n){

            ((GridView) mainFragmentView.findViewById(R.id.gridView)).setNumColumns(n);

        }





    }

I don't know how to add Json data into GridView.
Could you help me?

Go through this example to view images in grid,
Convert your jsonArray into an ArrayList by using,

ArrayList<Cars> carsList = new Gson().fromJson(jsonArrayYouHave.toString(),new TypeToken<List<Cars>>() {

        }.getType());

Pass this Array to your Adapter.

Use this POJO,

    public class Cars {

    private String TitleAR;



    private String HaveModel;



    private String TitleEN;



    private String Id;



    private ArrayList<SubCategories> SubCategories;



    private String Photo;



    private String ProductCount;



    //Todo please add getter/setters for class Cars variables here



    public class SubCategories {

        private String TitleAR;



        private String HaveModel;



        private String TitleEN;



        private String Id;



        private ArrayList<String> SubCategories;



        private String Photo;



        private String ProductCount;



        //Todo please add getter/setters for class SubCategories variables here

    }

I'll suggest to use Retrofit as it'll provide you parsed arraylist which is converted into Response POJO you have provided. You can find many examples for Retrofit.

Step 1
Add the following dependencies in your app level gradle file.Dependencies are for retrofit, gsonConvertor butterknife and glide.

implementation 'com.squareup.retrofit2:retrofit:2.1.0'

implementation 'com.google.code.gson:gson:2.6.2'

implementation 'com.squareup.retrofit2:converter-gson:2.1.0'

implementation('com.squareup.retrofit2:retrofit:2.1.0') {

    // exclude Retrofit’s OkHttp dependency module and define your own module import

    exclude module: 'okhttp'

}

implementation 'com.google.code.gson:gson:2.6.2'

implementation 'com.squareup.retrofit2:converter-gson:2.1.0'

implementation 'com.squareup.okhttp3:logging-interceptor:3.4.1'

implementation 'com.squareup.okhttp3:okhttp:3.4.1'

implementation 'com.android.support:design:28.0.0'

implementation 'com.android.support:recyclerview-v7:28.0.0'



implementation "com.jakewharton:butterknife:$BUTTER_KNIFE_VERSION"

annotationProcessor "com.jakewharton:butterknife-compiler:$BUTTER_KNIFE_VERSION"

implementation 'com.github.bumptech.glide:glide:4.8.0'

annotationProcessor 'com.github.bumptech.glide:compiler:4.8.0'

Step 2 Create a class by name ApiClient and paste the following code in this class

public class ApiClient {

private static Retrofit retrofit = null;



public static Retrofit getRetrofit() {

    HttpLoggingInterceptor interceptor = new HttpLoggingInterceptor();

    interceptor.setLevel(HttpLoggingInterceptor.Level.BODY);

    OkHttpClient client = new OkHttpClient.Builder().addInterceptor(interceptor).build();





    retrofit = new Retrofit.Builder()

            .baseUrl("http://souq.hardtask.co")

            .addConverterFactory(GsonConverterFactory.create())

            .client(client)

            .build();







    return retrofit;

}

}

Step 3 Create a new Interface class by name APIInterface and paste the following code in this class

 @GET("/app/app.asmx/GetCategories")

Call<List<Product>> getProducts(@QueryMap Map<String, String> params);

Step 4 Create POJO classes according to json response. We have two classes Products and their subcategory.So I am creating first class by name Product

public class Product {



@SerializedName("Id")

@Expose

private Integer id;

@SerializedName("TitleEN")

@Expose

private String titleEN;

@SerializedName("TitleAR")

@Expose

private String titleAR;

@SerializedName("Photo")

@Expose

private String photo;

@SerializedName("ProductCount")

@Expose

private String productCount;

@SerializedName("HaveModel")

@Expose

private String haveModel;

@SerializedName("SubCategories")

@Expose

private List<SubCategory> subCategories = null;



public Integer getId() {

    return id;

}



public void setId(Integer id) {

    this.id = id;

}



public String getTitleEN() {

    return titleEN;

}



public void setTitleEN(String titleEN) {

    this.titleEN = titleEN;

}



public String getTitleAR() {

    return titleAR;

}



public void setTitleAR(String titleAR) {

    this.titleAR = titleAR;

}



public String getPhoto() {

    return photo;

}



public void setPhoto(String photo) {

    this.photo = photo;

}



public String getProductCount() {

    return productCount;

}



public void setProductCount(String productCount) {

    this.productCount = productCount;

}



public String getHaveModel() {

    return haveModel;

}



public void setHaveModel(String haveModel) {

    this.haveModel = haveModel;

}



public List<SubCategory> getSubCategories() {

    return subCategories;

}



public void setSubCategories(List<SubCategory> subCategories) {

    this.subCategories = subCategories;

}



}

And SubCategory

public class SubCategory {



@SerializedName("Id")

@Expose

private Integer id;

@SerializedName("TitleEN")

@Expose

private String titleEN;

@SerializedName("TitleAR")

@Expose

private String titleAR;

@SerializedName("Photo")

@Expose

private String photo;

@SerializedName("ProductCount")

@Expose

private String productCount;

@SerializedName("HaveModel")

@Expose

private String haveModel;

@SerializedName("SubCategories")

@Expose

private List<Object> subCategories = null;



public Integer getId() {

    return id;

}



public void setId(Integer id) {

    this.id = id;

}



public String getTitleEN() {

    return titleEN;

}



public void setTitleEN(String titleEN) {

    this.titleEN = titleEN;

}



public String getTitleAR() {

    return titleAR;

}



public void setTitleAR(String titleAR) {

    this.titleAR = titleAR;

}



public String getPhoto() {

    return photo;

}



public void setPhoto(String photo) {

    this.photo = photo;

}



public String getProductCount() {

    return productCount;

}



public void setProductCount(String productCount) {

    this.productCount = productCount;

}



public String getHaveModel() {

    return haveModel;

}



public void setHaveModel(String haveModel) {

    this.haveModel = haveModel;

}



public List<Object> getSubCategories() {

    return subCategories;

}



public void setSubCategories(List<Object> subCategories) {

    this.subCategories = subCategories;

}



}

Step 5 now we need a view for recyclerview holder(in your case gridview layout). For that we need to create a new layout file inside layout folder. you can name it li_product_view

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="wrap_content">



<RelativeLayout

    android:layout_width="200dp"

    android:layout_height="200dp">



    <ImageView

        android:id="@+id/ImageView"

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        android:src="@mipmap/ic_launcher" />



    <TextView

        android:id="@+id/tv_title"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignLeft="@id/ImageView"

        android:layout_alignTop="@id/ImageView"

        android:layout_alignRight="@id/ImageView"

        android:layout_alignBottom="@id/ImageView"

        android:text="@string/app_name"

        android:gravity="bottom|right" />



</RelativeLayout>



</RelativeLayout>

Step 6 Now we need itemHolder to hold the view for that purpose we will create a new class by name ProductsItemHolderand will have the following code

public class ProductsItemHolder extends RecyclerView.ViewHolder {

@BindView(R.id.ImageView)

ImageView imageView;

@BindView(R.id.tv_title)

TextView textView;

public ProductsItemHolder(@NonNull View itemView) {



    super(itemView);

    ButterKnife.bind(this,itemView);



}

public void bindData(Product datum, int position, int size) {

    Glide.with(itemView)

            .asBitmap()

            .load(datum.getPhoto())

            .into(imageView);



    textView.setText(datum.getTitleAR());



}

}

Step 7 Now we need adapter which contains the data to present inside recyclerview. Create a new class by name ProductsAdapter and paste the following code inside this class

public class ProductsAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {



private List<Product> mList;

@NonNull

@Override

public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {

    View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.li_product_view, viewGroup, false);

    return new ProductsItemHolder(view);

}



@Override

public void onBindViewHolder(@NonNull RecyclerView.ViewHolder viewHolder, int position) {

    int size= mList.size();

    ((ProductsItemHolder) viewHolder).bindData(mList.get(position), position,size);

}



@Override

public int getItemCount() {

    return mList.size();

}

public void setData(List<Product> userLists) {

    this.mList = userLists;

    notifyDataSetChanged();

}

}

Step 8 now inside the activity or fragment we need to get response from json and pass this response to recyclerview.

public class MainActivity extends AppCompatActivity {

APIInterface apiInterfacePages;

RecyclerView recyclerView;



List<MultipleResource.Datum> datumList= new ArrayList<>();

ProgressDialog dialog;

ProductsAdapter productsAdapter;

private List<Product> dataArrayList;



@Override

protected void onCreate(Bundle savedInstanceState) {

    super.onCreate(savedInstanceState);

    setContentView(R.layout.activity_main);

    apiInterfacePages= PageApiClient.getRetrofit().create(APIInterface.class);



    recyclerView= findViewById(R.id.recyclerView);

    productsAdapter= new ProductsAdapter();

    StaggeredGridLayoutManager staggeredGridLayoutManager = new StaggeredGridLayoutManager(2, LinearLayoutManager.VERTICAL);

    recyclerView.setLayoutManager(staggeredGridLayoutManager);

    getData();



}



private void getData() {

    dataArrayList = new ArrayList<>();





    Map<String, String> params = new HashMap<String, String>();

    params.put("categoryId", "0");

    params.put("countryId", "1");

    Call<List<Product>> call= apiInterfacePages.getProducts(params);

    call.enqueue(new Callback<List<Product>>() {

        @Override

        public void onResponse(Call<List<Product>> call, Response<List<Product>> response) {

            dataArrayList = response.body();

            productsAdapter.setData(dataArrayList);

            recyclerView.setAdapter(productsAdapter);





        }



        @Override

        public void onFailure(Call<List<Product>> call, Throwable t) {

            Log.i("Call response",t.getMessage());

        }

    });

}

}