How to change listview imageview when click and store that image in the view when scroll

scubby3scubby3 Member ✭✭

I have a listview with a custom adapter which contains images and textviews .
On one of the imageview in the row i want to click on the default image and change it to another.
This works great but the problem is that after clicking the imageview and it changes after scrolling up and down that imageview went back to default.

how do i change this imageview and keep it after scrolling without loosing it back to default?

I used img.SetImageResource(Resource.id.imageName); for the new image after default has been click.

here is a 2 example image of what i am talking about.


Best Answer

Answers

  • BillyLiuBillyLiu Member, Xamarin Team Xamurai

    @scubby3

    It seems the listview item rebind after this scrolling up and down.
    I think you could add a variable in your data source to record the click.
    For example, you could use a bool. When the image is clicked, set it to true. And add an if condition when binding data, if the bool is true, bind the new image, else use the default one.

  • scubby3scubby3 Member ✭✭

    @BillyLiu
    I have been trying but i am just a beginner with c# and android.
    is it position to give me an example of how to achieve this.
    what i did so far is this
    public bool imgclick {get; set;} = false;
    and when i click the image i set imgclick to true;
    then an if statement in the adapter if(imgclick == true){ do what ever here }
    but it did not work.

  • scubby3scubby3 Member ✭✭

    So i manage to get it to work but another problem when i click on that imageview it started to change all the other views too when scroll i just want it on that rows that was clicked

  • DimChrisDimChris USMember ✭✭✭
    edited July 2018

    Your problem is that is taking wrong image position. You need to create a dataviewholder and then to save your image checked using --tag image position--. Or you can easy use recyclerview. Can you send the adapter code?

  • scubby3scubby3 Member ✭✭

    @DimChris
    Here is my code, and i am using view holder.
    but my problem is after i click on image view i want that view to keep the newly attach image to it when scroll up and down.
    i have use dataset as public string image {get; set;} = false;
    and when i click it i want to set that image view only to true. But with no luck it keep setting all the image view to true

    `namespace FunStock
    {
    class FeedAdapter : BaseAdapter
    {
    Activity context;
    List list;
    private Action mActionPicSelected;
    private Action mImgValue;
    private int mLayout;
    public FeedAdapter(Activity _context, int layout, List _list, Action picSelected, ActionimgValue) : base()
    {
    this.context = _context;
    this.list = _list;
    this.mActionPicSelected = picSelected;
    mLayout = layout;
    this.mImgValue = imgValue;
    }

        public override int Count
        {
            get { return list.Count; }
        }
    
        public override long GetItemId(int position)
        {
            return position;
        }
    
        public override Feed this[int position]
        {
            get { return list[position]; }
        }
    
    
        public override View GetView(int position, View convertView, ViewGroup parent)
        {
            var view = convertView;
            FeedAdapterViewHolder holder = null;
            Feed item = this[position];
    
            if (view != null)
    
                holder = view.Tag as FeedAdapterViewHolder;
    
            if (view == null)
            {
                holder = new FeedAdapterViewHolder();
                var inflater = context.GetSystemService(Context.LayoutInflaterService).JavaCast<LayoutInflater>();
                //view = inflater.Inflate(Resource.Layout.feedRows, parent, false);
                view = LayoutInflater.From(context).Inflate(mLayout, parent, false);
    
                holder.UserName = view.FindViewById<TextView>(Resource.Id.txtName);
                holder.UserImg = view.FindViewById<ImageView>(Resource.Id.imgUser);
                holder.Img = view.FindViewById<ImageView>(Resource.Id.imgPhoto);
                holder.ImgValue = view.FindViewById<ImageView>(Resource.Id.btnValues);
                holder.ShowCommentBox = view.FindViewById<ImageView>(Resource.Id.btnComment);
                holder.TextPost = view.FindViewById<TextView>(Resource.Id.txtPost);
                holder.TextName = view.FindViewById<TextView>(Resource.Id.txtName);
                holder.txtComments = view.FindViewById<TextView>(Resource.Id.txtComments);
                holder.txtValues = view.FindViewById<TextView>(Resource.Id.txtValues);
                holder.txtLikes = view.FindViewById<TextView>(Resource.Id.txtLikes);
                holder.TxtTime = view.FindViewById<TextView>(Resource.Id.txtTime);
                holder.ImgLikes = view.FindViewById<ImageView>(Resource.Id.btnLikes);
                view.Tag = holder;
            }
    
    
            holder.ImgLikes.Tag = position;
            holder.ImgValue.Tag = position;
    
            if (list[position].Api_status == "200")
            {
    
                Glide.With(context).Load(list[position].Photo).Into(holder.Img); //this.photo can also be used
                //holder.Img.Tag = position;
    
                if (list[position].ImgLikesClick == true)
                {
                    holder.ImgLikes.SetImageResource(Resource.Drawable.ic_likes);
                    holder.txtLikes.Text = list[position].Likes_Count.ToString();
                }
                else
                {
                    if (list[position].User_like.ToString() == "100")
                    {
                        holder.ImgLikes.SetImageResource(Resource.Drawable.ic_likes);
                        holder.txtLikes.Text = list[position].Likes_Count.ToString();
                    }
                    else if (list[position].User_like.ToString() == "200")
                    {
                        holder.ImgLikes.SetImageResource(Resource.Drawable.ic_like);
                        holder.txtLikes.Text = list[position].Likes_Count.ToString();
                    }
                }
    
    
                holder.txtComments.Text = list[position].Comment_Count;
                holder.TextName.Text = list[position].Fullname;
                holder.txtValues.Text = list[position].Feed_Values;
                holder.TxtTime.Text = list[position].Feed_time;
    
                if (list[position].Feed_Text != "")
                {
                    holder.TextPost.Text = System.Net.WebUtility.HtmlDecode(list[position].Feed_Text);
                }
    
    
    
    
    
    
                if (!holder.ImgValue.HasOnClickListeners)
                {
                    holder.ImgValue.Click -= (sender, args) => { };
                    holder.ImgValue.Click += (sender, args) =>
                    {
                        mImgValue.Invoke((ImageView)sender);
                    };
                }
    
                if (!holder.ImgLikes.HasOnClickListeners)
                {
                    holder.ImgLikes.Click -= (sender, args) => { };
                    holder.ImgLikes.Click += (sender, args) => 
                    {
                        list[position].ImgLikesClick = true;
                        int total = list[position].Likes_Count;
                        total += 1; 
                        mActionPicSelected.Invoke((ImageView)sender);
                        holder.txtLikes.Text = total.ToString();
                        holder.ImgLikes.SetImageResource(Resource.Drawable.ic_likes);
    
                    };
                }
    
    
    
            }
            else if (list[position].Api_status == "400")
            {
                Toast.MakeText(context, list[position].Errors_text.ToString(), ToastLength.Long).Show();
            }
    
    
            return view;
        }
    
    
        private class FeedAdapterViewHolder : Java.Lang.Object
        {
            public TextView UserName { get; set; }
            public ImageView UserImg { get; set; }
            public ImageView Img { get; set; }
            public ImageView ImgValue { get; set; }
            public ImageView ImgLikes { get; set; }
            public ImageView ShowCommentBox { get; set; }
            public TextView TextPost { get; set; }
            public TextView TextName { get; set; }
            public TextView txtComments { get; set; }
            public TextView txtValues { get; set; }
            public TextView txtLikes { get; set; }
            public TextView TxtTime { get; set; }
        }
    
    }
    

    }`

    This is the code am using to set it to true

    `if (!holder.ImgLikes.HasOnClickListeners)
    {
    holder.ImgLikes.Click -= (sender, args) => { };
    holder.ImgLikes.Click += (sender, args) =>
    {
    list[position].ImgLikesClick = true;
    int total = list[position].Likes_Count;
    total += 1;
    mActionPicSelected.Invoke((ImageView)sender);
    holder.txtLikes.Text = total.ToString();
    holder.ImgLikes.SetImageResource(Resource.Drawable.ic_likes);

                    };
                }`
    

    Code am using to check the if image view is set to true

    if (list[position].ImgLikesClick == true) { holder.ImgLikes.SetImageResource(Resource.Drawable.ic_likes); holder.txtLikes.Text = list[position].Likes_Count.ToString(); }

  • scubby3scubby3 Member ✭✭

    I have another question.
    Is it possible to update listview adapter row image view or text view from within the activity or fragment.

  • DimChrisDimChris USMember ✭✭✭
    edited July 2018

    Try instead of list[position] in click event to use

     list[Convert.ToInt32(holder.ImgLikes.Tag)
    

    Cause inside holder you keep the right position.

    In your last question there are several ways which you can do that. I dont have use it till now but i think that if you will change something insdide you class adapter and calling notifyDataSetChanged, i think that it will work

  • scubby3scubby3 Member ✭✭

    Hey @DimChris
    I am still having the same problem with the listview. i have no idea how i cant figure it out.
    all i want to do is update 1 row at a given time when user like the empty heart i need to change that imageview image to a filled heart image.
    I get it to change the heart image but once i scroll up and down its resetting.

    i thought that if i have set the holder.imageview.SetImageResource(Resource.Drawable.ic_likes);
    it will automatically stay within that specific row. But i still have no look.

    Am working on a newfeed like instagram hoping someone could helped with this

  • scubby3scubby3 Member ✭✭

    Thanks @DimChris I change to recycleview and all is working well.

Sign In or Register to comment.