Xamarin Android: Customizing a ListView with the button
As below picture, the article is how to use these classes and special buttons to display a ListView:
- Count – To tell the control how many rows are in the data.
- GetView – To return a View for each row, populated with data. This method has a parameter for
ListView
to pass in an existing, unused row for re-use. - GetItemId – Return a row identifier (typically the row number, although it can be any long value that you like).
- this[int] indexer – To return the data associated with a particular row number.
The example code in MainActivity.cs:
public class AccountAndPaymentActivity : Activity
{
List<ViewCollection> viewCollection = new List<ViewCollection>();
protected override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
SetContentView(Resource.Layout.AccountAndPaymentLayout);
Toolbar mToolbar = FindViewById<Toolbar>(Resource.Id.accountToolbar);
mToolbar.Title="Account And Payment";
SetActionBar(mToolbar);
loaddata();
ListView lst = FindViewById<ListView>(Resource.Id.lstAccountAndPayment);
lst.Adapter = new ListviewPayment(this, viewCollection);
ActionBar.SetDisplayHomeAsUpEnabled(true);
// Create your application here
}
private void loaddata()
{
viewCollection.Add(new ViewCollection {title="Name",subtitle="Jone Lee" });
viewCollection.Add(new ViewCollection { title = "Email", subtitle = "Jonelee@yahoo.com" });
viewCollection.Add(new ViewCollection { title = "Home", subtitle = "Australia" });
viewCollection.Add(new ViewCollection { title = "Work", subtitle = "Sydney" });
viewCollection.Add(new ViewCollection { title = "", subtitle = "Daily Featured Deals" });
viewCollection.Add(new ViewCollection { title = "", subtitle = "Reminder before event starts" });
viewCollection.Add(new ViewCollection { title = "Credit/ Debit Card", subtitle = "Jone Lee" });
}
The example code in MainActivity.cs/HomeAdapter
demonstrates how to subclass BaseAdapter`` ``with the parameter is ViewCollection.
private class HomeAdapter : BaseAdapter<ViewCollection>
{
LayoutInflater _inflater;
public List<ViewCollection> _item { get; set; }
public ListviewPayment(Context context, List<ViewCollection> item)
{
_inflater = LayoutInflater.FromContext(context);
_item = item;
}
public override ViewCollection this[int position]
{
get
{
return _item[position];
}
}
public override int Count
{
get
{
return _item.Count;
}
}
public override long GetItemId(int position)
{
return position;
}
public override View GetView(int position, View convertView, ViewGroup parent)
{
View view = convertView ?? _inflater.Inflate(Resource.Layout.ListviewPaymentItem, parent, false);
var item = _item[position];
var viewHolder = view.Tag as PaymentItemViewHolder;
if (viewHolder == null)
{
viewHolder = new PaymentItemViewHolder();
viewHolder.Title = view.FindViewById<TextView>(Resource.Id.txtPayment);
viewHolder.SubTitle = view.FindViewById<TextView>(Resource.Id.txtsubPayment);
viewHolder.switchButton = view.FindViewById<Switch>(Resource.Id.switchPayment);
}
viewHolder.Title.Text = item.title;
viewHolder.SubTitle.Text = item.subtitle;
if (position == 4 || position == 5)
{
viewHolder.Title.Visibility = ViewStates.Invisible;
viewHolder.SubTitle.Visibility = ViewStates.Visible;
viewHolder.switchButton.Visibility = ViewStates.Visible;
}
else
{
viewHolder.switchButton.Visibility = ViewStates.Invisible;
viewHolder.Title.Visibility = ViewStates.Visible;
viewHolder.SubTitle.Visibility = ViewStates.Visible;
}
return view;
}
public class PaymentItemViewHolder : Java.Lang.Object
{
public TextView Title { get; set; }
public TextView SubTitle { get; set; }
public ImageViewAsync Image { get; set; }
public ImageView ImgIcon { get; set; }
public Switch switchButton { get; set; }
}
}
If your data just is a string so you use BaseAdapter.
So everyone will asks
w
hy use BaseAdapter<``ViewCollection``>.
Because of
ViewCollection this[int position]. It is t
o`` return the data associated with a particular row number. Clearly, it is to return a item of ViewCollection at a row number.
Example: at row number 2 the data of the result is
- Title is Home
- Subtitle is Australia.
public override ViewCollection this[int position]
``{
``get
``{
``return _item[position];
``}
``}
ListViewPaymentItem
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="80dp"
android:gravity="left">
<ImageView android:id="@+id/imgPayment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:visibility="invisible"/>
<TextView android:id="@+id/txtPayment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:textColor="@android:color/holo_red_light"
android:textSize="16dp"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView android:id="@+id/txtsubPayment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_margin="5dp"
android:layout_below="@id/txtPayment"
/>
<Switch android:id="@+id/switchPayment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:visibility="invisible"
android:layout_alignParentRight="true"
android:layout_below="@id/txtPayment"/>
</RelativeLayout>
</LinearLayout>
</LinearLayout>