moayed ayasaa moayed ayasaa - 2 months ago 22
Android Question

error in display image from jsonArray to Picasso

I have this JSON link and I parsed it.

enter image description here

But when I click on any item I get all the images.

enter image description here

What I want is, when user clicks on an item, I want to see the details of only the item clicked.
For example, when I click on imo, I need only the image for imo.

How can I solve this problem?

this is my module :

public class AppShowModule {
private List<String> Allimage = new ArrayList<String>();
public List<String> getAllimage() {
return Allimage;
}
public void setAllimage(List<String> allimage) {
Allimage = allimage;
}
}


This is my Fragment

public class ImageListFragment extends Fragment {

List<AppShowModule> appShowModules;
List<AppShowModule> imagesModule;
RecyclerView AppRecyclerView;
RecyclerView.Adapter imageRecyclerViewadapter;
List<String> imageUrls;
String feedKey = "feed";
String entryKey = "entry";
String imageKey = "im:image";
String labelKey = "label";
String jsonUrl = "https://itunes.apple.com/jo/rss/topfreeapplications/limit=50/json";
RequestQueue requestQueue;
private RecyclerView.LayoutManager mLayoutManager;

public ImageListFragment() {
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {
return inflater.inflate(R.layout.fragment_image_list, container, false);
}

public void onActivityCreated(@Nullable Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
AppRecyclerView = (RecyclerView) getView().findViewById(R.id.imageRecyclerView);
imagesModule = new ArrayList<>();
appShowModules = new ArrayList<>();
imageUrls = new ArrayList<>();
JsonAppShowData();
}
public void JsonAppShowData() {
final JsonObjectRequest jsonObjectRequest = new JsonObjectRequest( jsonUrl, new Response.Listener<JSONObject>() {
@Override
public void onResponse(JSONObject response) {
try {
JSONArray jsonArray = response.getJSONObject(feedKey).getJSONArray( entryKey );
AppShowModule appShowModule = new AppShowModule();
for (int i = 0; i < jsonArray.length(); i++) {
JSONArray imageArray = response.getJSONObject(feedKey).getJSONArray(entryKey).getJSONObject(i).getJSONArray(imageKey);
for (int j = 0; j < imageArray.length(); j++) {
String image = imageArray.getJSONObject(j).getString(labelKey).toString();
imageUrls.add(image);
appShowModule.setAllimage(imageUrls);
appShowModules.add(appShowModule);}}
imageRecyclerViewadapter = new ImageListAdapter(appShowModules,getContext(),imageUrls);
AppRecyclerView.setAdapter(imageRecyclerViewadapter);
} catch (JSONException e) {
e.printStackTrace();
}}
}, new Response.ErrorListener() {
@Override
public void onErrorResponse(VolleyError error) {
Log.e( "LOG", error.toString() );
}
} );
requestQueue = Volley.newRequestQueue( getContext() );
requestQueue.add(jsonObjectRequest);
mLayoutManager = new GridLayoutManager( getContext().getApplicationContext(),3);
AppRecyclerView.setLayoutManager(mLayoutManager);
}
}


This is the Recycler adapter,

public class ImageListAdapter extends RecyclerView.Adapter<ImageListAdapter.ViewHolder> {
List<AppShowModule> imagesModules;
List<AppShowModule> appShowModules;

List<String> imageUrl;
AppShowModule appShowModule;
String x;
Context context;
private OnItemClickListener callback;




public ImageListAdapter(List<AppShowModule> appShowModules, Context context ,List<String>imageUrls, OnItemClickListener callback){
super();
this.imageUrl =imageUrls;
this.appShowModules = appShowModules;
this.context = context;
this.callback = callback;
}

@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.imagelayout, parent, false);
ViewHolder viewHolder = new ViewHolder(v);
return viewHolder;
}

@Override
public void onBindViewHolder(ViewHolder holder, int position) {
holder.setClickListerner(imageUrl.get(position), callback);

}

public int getItemCount() {
return imageUrl.size();
}

class ViewHolder extends RecyclerView.ViewHolder {


public ImageView appImage;

public void setClickListerner(final String item, final OnItemClickListener callback){
parent.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
callback.onItemClick(item);
}
});
}

public ViewHolder(View itemView) {
super(itemView);
appImage = (ImageView) itemView.findViewById(R.id.appImage);
appImage.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Intent intent = new Intent(context, ImageShow.class);
intent.putExtra("image", x);
context.startActivity(intent);
}
});}}

public interface OnItemClickListener {
void onItemClick(String item);
}
}


and this is the activity that have the image view where click

public class ListViewDetailsFragment extends Fragment {
ImageView AppImage;
TextView AppName,AppArtist,AppContentType,AppRights,AppCategory,AppRealseDate,AppSammary;
ImageButton AppLink;
Context context;
public ListViewDetailsFragment() {
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {
return inflater.inflate(R.layout.fragment_list_view_details, container, false);}
public void onActivityCreated(@Nullable Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
AppImage = (ImageView) getView().findViewById(R.id.imageView);
AppName = (TextView) getView().findViewById(R.id.textname);
AppArtist = (TextView) getView().findViewById(R.id.textartest);
AppContentType = (TextView) getView().findViewById(R.id.textcontent);
AppRights = (TextView) getView().findViewById(R.id.textrights);
AppCategory = (TextView) getView().findViewById(R.id.textCategory);
AppRealseDate = (TextView) getView().findViewById(R.id.textRelease);
AppSammary = (TextView) getView().findViewById(R.id.textSummary);
AppLink = (ImageButton) getView().findViewById(R.id.imageButton);
String name = getActivity().getIntent().getExtras().getString("App_name");
final String image = getActivity().getIntent().getExtras().getString("App_image");
String artist = getActivity().getIntent().getExtras().getString("App_artist");
String contentType = getActivity().getIntent().getExtras().getString("App_ContentType");
String rights = getActivity().getIntent().getExtras().getString("App_Rights");
String category = getActivity().getIntent().getExtras().getString("App_Category");
String realse = getActivity().getIntent().getExtras().getString("App_ReleaseDate");
final String link = getActivity().getIntent().getExtras().getString("App_link");
String sammary = getActivity().getIntent().getExtras().getString("App_summary");
AppName.setText(name);
AppArtist.setText(artist);
AppContentType.setText(contentType);
AppRights.setText(rights);
AppCategory.setText(category);
AppRealseDate.setText(realse);
AppSammary.setText(sammary);
Picasso.with(context).load(image).into(AppImage);
AppLink.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Intent intent = new Intent(getActivity().getBaseContext(),
WebView.class);
intent.putExtra("App_link", link);
getActivity().startActivity(intent);}});
AppImage.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
String id = (String) view.getTag();
Intent intent = new Intent(getActivity().getBaseContext(), ImageList.class);
intent.putExtra("id", id);
getActivity().startActivity(intent);
}});}}


this is image layout

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"

android:id="@+id/card">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/lnrLayout"
android:orientation="vertical">
<ImageView
android:layout_margin="4dp"
android:scaleType="centerCrop"
android:id="@+id/appImage"
android:layout_width="100dp"
android:background="@android:color/darker_gray"
android:padding="2dp"
android:layout_height="100dp" />

</LinearLayout>



Answer

create an interface class like:

public interface OnItemClickListener {
   void onItemClick(String item); 
}

and implement this class in ImageListFragment.

public class ImageListFragment extends Fragment implements OnItemClickListener {

Now when you are creating your adapter object inside ImageListFragment, change your code

imageRecyclerViewadapter = new ImageListAdapter(appShowModules,getContext(),imageUrls);

to

imageRecyclerViewadapter = new ImageListAdapter(appShowModules,getContext(),imageUrls, ImageListFragment.this);

and inside your adapter class, change constructor to

public ImageListAdapter(List<AppShowModule> appShowModules, Context context ,List<String>imageUrls, OnItemClickListener callback){
super();
this.imageUrl =imageUrls;
this.appShowModules = appShowModules;
this.context = context;
this.callback = callback;
}

in your adapter you have to write one more line, which is

private OnItemClickListener callback;

Now inside onBindViewHolder of adapter, write

holder.setClickListerner(imageUrl.get(position), callback);

and inside ViewHolder class create setClickListerner method like

public void setClickListerner(String item, OnItemClickListener callback){
parent.setOnClickListener(new View.OnClickListener() {
                @Override public void onClick(View v) {
                    callback.onItemClick(item);
                }
            });

Now you have ViewHolder like this

class ViewHolder extends RecyclerView.ViewHolder {

public ImageView appImage;
public LinearLayout parent;

public void setClickListerner(final String item, final OnItemClickListener callback){
    parent.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            callback.onItemClick(item);
        }
    });
}

public ViewHolder(View itemView) {
    super(itemView);

    appImage = (ImageView) itemView.findViewById(R.id.appImage);
    parent = (LinearLayout) itemView.findViewById(R.id.lnrLayout);

    appImage.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            Intent intent = new Intent(context, ImageShow.class);
            intent.putExtra("image", x);
            context.startActivity(intent);
        }
    });
}

}

Now when you click any item onItemClick inside your Fragment class give you select image.