Contact List
- 2 minutes to read
A styled contact list with integrated search.
What’s Inside
The Contact List (ContactList
) is an XtraUserControl. It integrates the pre-customized WinForms Data Grid (TileView) and Search Control.
Getting Started
Add the Contact List template to your WinForms project. Locate the UI template in the Toolbox and drop it onto the Form.
Contacts (List Items)
The ContactList.Contact
class represents an item in the list. The table below lists its fields (public properties).
Property Name | Type | Description |
---|---|---|
Avatar | Image |
Gets a contact’s picture. |
UserName | String |
Gets a contact’s name. |
LastActivity | DateTime |
Gets a contact’s last active time. |
LastOnline | DateTime |
Gets whether a contact is online. Use the SetLastOnline method to set this property. |
IsActive | Boolean |
Gets whether a contact is active. Use the SetActive method to set the active state. |
UnreadCount | Int64 |
Gets the number of unread messages. Use the SetUnreadCount method to set this property. |
Create and Add Contacts
Open the YOUR_PROJECT\UserControls\ContactList.cs file. Use the ViewModel’s OnCreate
method to create contacts and add them to the Contact List. You can add contacts as shown in the example below or load contacts from a data source.
public partial class ContactList : XtraUserControl {
// ...
public class ViewModel {
public virtual List<Contact> Contacts {
get;
protected set;
}
public void OnCreate() {
var contacts = new List<Contact> {
/* Uses the generic contact pictures that ship
as part of the WinForms UI Templates. */
new Contact(1, "John Smith", Images.Users.SampleUser1),
new Contact(2, "Mary Brown", Images.Users.SampleUser2),
new Contact(3, "John Doe", Images.Users.Unknown)
};
// Adds a new contact with a custom picture.
contacts.Add(
new Contact(4, "BB 8", Image.FromFile(@"c:\\images\custom-avatar.png"))
);
// Initialize the contact settings.
contacts[0].SetActive();
contacts[0].SetUnreadCount(2);
contacts[1].SetLastOnline(DateTime.Now.AddHours(-4));
contacts[2].SetLastOnline(DateTime.Now.AddYears(-1));
Contacts = contacts;
}
// ...
}
// ...
}
Parameters
Name | Type | Description |
---|---|---|
id | Int64 |
An integer value that identifies a contact. |
userName | String |
A contact’s name. |
image | Image |
A contact’s picture. |
Note
The Contact List is built on HTML & CSS templates. Its HTML template is bound to the following properties: Contact.Avatar
, Contact.UserName
, Contact.LastOnlineText
, Contact.UnreadCount
. Do not rename these properties to avoid layout issues. Otherwise, you should update data bindings in the HTML template (YOUR_PROJECT\Assets\HTML\Contact.html).