listlistviewxamarin.androidprogress-barlistadapter

ListView item as a progress bar


I was wondering if someone can maybe help me with the following intent:

I created an app which simply displays a table. It shows a table head and beyond that a list view which contains several items.

Is it possible, that if one clicks on one of these items, a progress bar is shown which loads smoothely in a certain time interval (lets say 30 seconds) from left to right?

Please see my screenshot below, maybe it's easier to understand what I am trying to do:

Screenshot of goal

Finally, I don't know if it helps, but let me attach some code as well. I shortened it a little, if something is missing for understanding (like the list class) or if I removed to much, please let me know:

public class TableActivity : Activity
{
    ListView lv;
    ListAdapter adapter = null;
    protected override void OnCreate(Bundle bundle)
    {
        base.OnCreate(bundle);
        //...
        lv = FindViewById<ListView>(Resource.Id.geraeteListView);
        adapter = new ListAdapter(this, Resource.Layout.List, geraeteliste.CurrentGeraeteliste, Intent.GetStringExtra("ServerIP"))
        {
            parentActivity = this
        };
        lv.Adapter = adapter;
    }

    private async void OnItemClick(object sender, AdapterView.ItemClickEventArgs e)
    {
        if (geraeteliste.CurrentGeraeteliste[e.Position].bespielt == "J") return;
        //…
        await Task.Delay(0);
    } 
}

public class ListAdapter : ArrayAdapter
{
    //...
    public override View GetView(int position, View convertView, ViewGroup parent)
    {
        View v = convertView;
        if (v == null)
        {
            LayoutInflater inflater = (LayoutInflater)Context.GetSystemService(Context.LayoutInflaterService);
            v = inflater.Inflate(Resource.Layout.List, parent, false);
        }
        //...
        v.FindViewById<ImageView>(Resource.Id.typeImageView).SetImageResource(Resource.Drawable.Icon);
        v.FindViewById<TextView>(Resource.Id.numberTextView).Text = Geraetelist[position].geraeteplatz;
        v.FindViewById<TextView>(Resource.Id.descriptionTextView).Text = Geraetelist[position].geraeteinformation;
        ImageView iv = v.FindViewById<ImageView>(Resource.Id.bspImageView);
        iv.SetImageResource(Geraetelist[position].bespielt == "N" ? Resource.Drawable.greenPoint : Resource.Drawable.redPoint);
        //…
        return v;        
    }
}

Can anyone maybe give me a short hint or something? How can I implement such a progress bar for every item on click?^^ Would be really happy for every helping effort.

Thanks in advance for every answer,

Best regards


Solution

  • Is it possible, that if one clicks on one of these items, a progress bar is shown which loads smoothly in a certain time interval (lets say 30 seconds) from left to right?

    If you want to display progressbar when click Listview item, I do one sample for you, you can take a look:

    1.Declare ListView layout

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" android:orientation="vertical">
    
    <ListView
        android:minWidth="25px"
        android:minHeight="25px"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/ListView" />
    
    </LinearLayout>
    

    2.Declare list row layout

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView android:id="@+id/textView1" 
              android:layout_width="match_parent" 
              android:layout_height="wrap_content" />
    
    <ProgressBar android:id="@+id/progressBar1" 
                 android:layout_width="match_parent" 
                 android:layout_height="wrap_content" 
                 android:layout_centerHorizontal="true" android:visibility="invisible"
    
                style="@android:style/Widget.ProgressBar.Horizontal" />
    </LinearLayout>
    

    3.Define ListView Adapter

    public class Post
    {      
        public string title { get; set; }
        public bool isselect { get; set; }
       
    }
    
    public class CusotmListAdapter : BaseAdapter<Post>
    {
        Activity context;
        List<Post> list;
    
        public CusotmListAdapter(Activity _context, List<Post> _list)
        : base()
        {
            this.context = _context;
            this.list = _list;
        }
    
        public override Post this[int position]
        {
            get { return list[position]; }
    
        }
    
        public override int Count
        {
            get { return list.Count; }
    
        }
    
        public override long GetItemId(int position)
        {
            return position;
    
        }
    
        public override View GetView(int position, View convertView, ViewGroup parent)
        {
            View view = convertView;
    
            // re-use an existing view, if one is available
            // otherwise create a new one
            if (view == null)
                view = context.LayoutInflater.Inflate(Resource.Layout.ListItemRow, parent, false);
    
            Post item = this[position];
            view.FindViewById<TextView>(Resource.Id.textView1).Text = item.title;
            if(item.isselect==true)
            {
                view.FindViewById<ProgressBar>(Resource.Id.progressBar1).Visibility = ViewStates.Visible;
            }
            else
            {
                view.FindViewById<ProgressBar>(Resource.Id.progressBar1).Visibility = ViewStates.Invisible;
            }
    
    
            return view;
        }
    
    }
    

    4.Setting ListView Adapter

        public class MainActivity : AppCompatActivity
         {
           private ListView listview;
           List<Post> posts = new List<Post>();
           private CusotmListAdapter adapter;
           private int oldposition = -1;
           protected override void OnCreate(Bundle savedInstanceState)
           {
            base.OnCreate(savedInstanceState);
            // Set our view from the "main" layout resource
    
            posts.Add(new Post() { title = "title 1", isselect = false });
            posts.Add(new Post() { title = "title 2", isselect = false });
            posts.Add(new Post() { title = "title 3", isselect = false });
            posts.Add(new Post() { title = "title 4", isselect = false });
            posts.Add(new Post() { title = "title 5", isselect = false });
            posts.Add(new Post() { title = "title 6", isselect = false });
            posts.Add(new Post() { title = "title 7", isselect = false });
            posts.Add(new Post() { title = "title 8", isselect = false });
            SetContentView(Resource.Layout.activity_main);
            listview = FindViewById<ListView>(Resource.Id.ListView);
            listview.ItemClick+= OnListItemClick;
            adapter= new CusotmListAdapter(this, posts);
            listview.Adapter = adapter;
        }
    
        private void OnListItemClick(object sender, AdapterView.ItemClickEventArgs e)
        {
            if(oldposition!=-1)
            {
                Post p1 = adapter[oldposition];
                p1.isselect = false;
            }
            oldposition = e.Position;
            Post p = adapter[e.Position];
            p.isselect = true;
            adapter.NotifyDataSetChanged();
    
          }
         }
    

    Update

    You can change some code in CusotmListAdapter GetView event:

     public override View GetView(int position, View convertView, ViewGroup parent)
        {
            View view = convertView;
    
            // re-use an existing view, if one is available
            // otherwise create a new one
            if (view == null)
                view = context.LayoutInflater.Inflate(Resource.Layout.ListItemRow, parent, false);
    
            Post item = this[position];
    
            view.FindViewById<TextView>(Resource.Id.textView1).Text = item.title;
            ProgressBar p = view.FindViewById<ProgressBar>(Resource.Id.progressBar1);
            p.Max = 100;
            p.Progress = 100;
            //p.IncrementProgressBy(-10);
            if(item.isselect==true)
            {
                view.FindViewById<ProgressBar>(Resource.Id.progressBar1).Visibility = ViewStates.Visible;
                new Thread(new ThreadStart(delegate
                {
                    while (p.Progress > 0)
                    {
                        p.Progress -= 20;
                        Thread.Sleep(1000);
                    }
                })).Start();
            }
            else
            {
                view.FindViewById<ProgressBar>(Resource.Id.progressBar1).Visibility = ViewStates.Invisible;
            }
    
    
            return view;
        }
    

    Then please look at the screenshot:

    enter image description here