Lesson 20.4 – Binding child list properties to a combobox

Lesson Objectives

At the end of this lesson, you will know…

• How to manually bind list properties of custom classes, to automatically update comboboxes in the UI

Manually binding list properties to a combobox

It seems like we could do the same thing to the comboboxes that we did to bind the Inventory to a datagridview. However, there are a couple of problems.

First, the Player.Inventory property contains a list of InventoryItem objects, and we only want a list of the Details property for each InventoryItem object. There isn’t an automatic way to get those values as a bindable list.

Second, we want to apply a filter, so we only include items that are weapons (for the cboWeapons combobox) or potions (for the cboPotions combobox).

So, we need to use a different technique.

When we make this change, we’ll also create a function in the Player class to remove items from inventory. Then, we will change SuperAdventure.cs to use the new function. This is another part of moving our logic code out of the UI code.

Step 1: Open the Player.cs class in Visual Studio.

The first thing we need to do is create properties for the lists of our weapons and potions – to bind to the comboboxes.

It would be nice if we could bind the combobox to the Inventory property, and filter it to only include items that are weapons. However, there are limits to what you can do with the different types of collections and lists in .NET. So, we need to create new properties on the Player class, and do our binding manually.

Create these new properties in Player.cs:

public List<Weapon> Weapons
{
    get { return Inventory.Where(x => x.Details is Weapon).Select(x => x.Details as Weapon).ToList(); }
}
public List<HealingPotion> Potions
{
    get { return Inventory.Where(x => x.Details is HealingPotion).Select(x => x.Details as HealingPotion).ToList(); }
}

These use LINQ to create a new list of Inventory items where the Details property is the datatype Weapon (or HealingPotion). The “is” is used to check the datatype of an object. Remember that the Details property, of the InventoryItem class, holds objects whose datatype is “Item”. The Weapon class inherits from the Item class. So, Weapon objects have a datatype of both Weapon and Item.

Think of it like the base class is “Animal”, and the child class is “Dog”. A poodle is both an animal and a dog. So a poodle can fit in a list of Animal objects, and a list of Dog objects.

The “Select(x => x.Details)” returns only the Details property of the InventoryItem object. We don’t use InventoryItem’s Quantity in the comboboxes, so we only take the Details value.

The “ToList()” converts the results of the LINQ query into a new list. We will bind these lists to the comboboxes.

Step 2: Add this new function to Player.cs. We will use this to notify the UI when the inventory changes.

private void RaiseInventoryChangedEvent(Item item)
{
    if(item is Weapon)
    {
        OnPropertyChanged("Weapons");
    }
    if(item is HealingPotion)
    {
        OnPropertyChanged("Potions");
    }
}

When we add (or remove) anything in the Inventory list, we will call this method. If the item was a weapon, it will raise an event saying that the “Weapons” property has been changed. It will do the same for the “Potions” property, when we add or remove potions.

Step 3: Add this new function to Player.cs. From now on, we will call this when we want to remove an item from the player’s inventory.

public void RemoveItemFromInventory(Item itemToRemove, int quantity = 1)
{
    InventoryItem item = Inventory.SingleOrDefault(ii => ii.Details.ID == itemToRemove.ID);
    if(item == null)
    {
        // The item is not in the player's inventory, so ignore it.
        // We might want to raise an error for this situation
    }
    else
    {
        // They have the item in their inventory, so decrease the quantity
        item.Quantity -= quantity;
        // Don't allow negative quantities.
        // We might want to raise an error for this situation
        if(item.Quantity < 0)
        {
            item.Quantity = 0;
        }
        // If the quantity is zero, remove the item from the list
        if(item.Quantity == 0)
        {
            Inventory.Remove(item);
        }
        // Notify the UI that the inventory has changed
        RaiseInventoryChangedEvent(itemToRemove);
    }
}

When we call this, we pass the item we want to remove, and the quantity to remove.

Notice that the quantity parameter has an ” = 1″ after it. That makes it an optional parameter. If we call this function with only an item, it will assume we want to remove one of it. If we want to delete more than one of that item, we can pass in the number to remove for this parameter.

There are two comments in this code about raising an error – when you try to remove an item from inventory that doesn’t exist in the player’s inventory, and when you try to remove a quantity larger than what they have in their inventory.

If the remaining quantity of the item is zero, we completely remove that item from the Inventory list.

In the last line, we call the function to send the UI a property change notification.

Step 4: Now we need to change the Player class functions to use the new RemoveItemFromInventory function – to raise the notification events when the inventory changes.

Replace the existing RemoveQuestCompletionItems() and AddItemToInventory() functions with this code:

public void RemoveQuestCompletionItems(Quest quest)
{
    foreach(QuestCompletionItem qci in quest.QuestCompletionItems)
    {
        // Subtract the quantity from the player's inventory that was needed to complete the quest
        InventoryItem item = Inventory.SingleOrDefault(ii => ii.Details.ID == qci.Details.ID);
        if(item != null)
        {
            RemoveItemFromInventory(item.Details, qci.Quantity);
        }
    }
}
public void AddItemToInventory(Item itemToAdd, int quantity = 1)
{
    InventoryItem item = Inventory.SingleOrDefault(ii => ii.Details.ID == itemToAdd.ID);
    if(item == null)
    {
        // They didn't have the item, so add it to their inventory
        Inventory.Add(new InventoryItem(itemToAdd, quantity));
    }
    else
    {
        // They have the item in their inventory, so increase the quantity
        item.Quantity += quantity;
    }
    RaiseInventoryChangedEvent(itemToAdd);
}

We want to use these functions every time we add or remove items in the player’s inventory. There are not many places right now. However, if we add vendors to the game, and let the player buy and sell items, we will use these two functions. That way, we know the event notification will always be raised for the UI.

Step 5: Now we need to modify SuperAdventure.cs. The first thing we’ll do is set up the comboboxes to bind to the new Player properties.

In the constructor for SuperAdventure.cs, add these lines before the “MoveTo(_player.CurrentLocation);”

cboWeapons.DataSource = _player.Weapons;
cboWeapons.DisplayMember = "Name";
cboWeapons.ValueMember = "Id";
if(_player.CurrentWeapon != null)
{
    cboWeapons.SelectedItem = _player.CurrentWeapon;
}
cboWeapons.SelectedIndexChanged += cboWeapons_SelectedIndexChanged;
cboPotions.DataSource = _player.Potions;
cboPotions.DisplayMember = "Name";
cboPotions.ValueMember = "Id";
_player.PropertyChanged += PlayerOnPropertyChanged;

These lines say to use the Weapons and Potions properties as the datasources for the comboboxes. We say what property to display in the combobox (the DisplayMember) and what property to use as the value (the ValueMember) when we check for the currently selected item.

We also set the SelectedItem to the player’s CurrentWeapon – if they have one.

There are two connections to event handlers:

1. “cboWeapons_SelectedIndexChanged”, the existing function for when the player chooses a new weapon in the combobox.
2. “PlayerOnPropertyChanged” – a new function to update the combobox data when the player’s inventory changes.

Step 6: Add the PlayerOnPropertyChanged function to SuperAdventure.cs. This will update the combobox data when the player’s inventory changes.

private void PlayerOnPropertyChanged(object sender, PropertyChangedEventArgs propertyChangedEventArgs)
{
    if(propertyChangedEventArgs.PropertyName == "Weapons")
    {
        cboWeapons.DataSource = _player.Weapons;
        if(!_player.Weapons.Any())
        {
            cboWeapons.Visible = false;
            btnUseWeapon.Visible = false;
        }
    }
    if(propertyChangedEventArgs.PropertyName == "Potions")
    {
        cboPotions.DataSource = _player.Potions;
        if(!_player.Potions.Any())
        {
            cboPotions.Visible = false;
            btnUsePotion.Visible = false;
        }
    }
}

The “propertyChangedEventArgs.PropertyName” tells us which property was changed on the Player object. This value comes from the Player.RaiseInventoryChangedEvent function, where it says OnPropertyChanged(“Weapons”), or OnPropertyChanged(“Potions”).

We re-bind the combobox to the Weapons (or Potions) DataSource property, to refresh it with the current items.

Then, we see if the lists are empty, by using “!_player.Weapons.Any()”. Remember that Any() tells us if there are any items in the list: “true” if there are, “false” if there are not. So, we are saying, “if there are not any items in the list, set the visibility of the combobox and ‘Use’ button to false (not visible)”.

This is in case we use our last potion in the middle of a fight. Since the player’s Potions property will be an empty list, it will hide the potions combobox and “Use” button.

Step 7: With the binding in place, we can remove the old code we used to manually refresh the comboboxes.

Look for the UpdateWeaponListInUI() function (line 235) and the UpdatePotionListInUI() function (line 275), and delete both of them.

Use Ctrl-F to find where we called those two functions and delete those lines. They are at the end of the MoveTo() function, in the bntUseWeapon_Click() function, and in the btnUsePotion_Click() function.

Step 8: The final change is to make the btnUsePotion_Click() function use our new Player.RemoveItemFromInventory() function, when the player uses a potion.

Change this code:

// Remove the potion from the player's inventory
foreach(InventoryItem ii in _player.Inventory)
{
    if(ii.Details.ID == potion.ID)
    {
        ii.Quantity--;
        break;
    }
}

To this:

// Remove the potion from the player's inventory
_player.RemoveItemFromInventory(potion, 1);

Now we aren’t directly changing the player’s inventory from the UI. It has to pass through our function in the Player object, which will send up a notification that the player’s inventory has changed.

Step 9: We’ll also want to use the new Weapons and Potions properties to show, or hide, the comboboxes and buttons when the player moves to a new location and encounters a monster.

In SuperAdventure.cs, change lines 253-256 from this:

cboWeapons.Visible = true;
cboPotions.Visible = true;
btnUseWeapon.Visible = true;
btnUsePotion.Visible = true;

to this:

cboWeapons.Visible = _player.Weapons.Any();
cboPotions.Visible = _player.Potions.Any();
btnUseWeapon.Visible = _player.Weapons.Any();
btnUsePotion.Visible = _player.Potions.Any();

Step 10: Run the program, and make sure it works.

Summary

We’ve moved more logic code where it belongs – in the classes of the Engine project. We’ve also provided a central place to remove items from the player’s inventory.

Players won’t see a change in how the game works. However, we are making it much easier for us to work with in the future.

Source code for this lesson

Source code on GitHub

Source code on Dropbox

Next lesson: Lesson 20.5 – Moving the game logic functions from the UI project to the Engine project

Previous lesson: Lesson 20.3 – Binding list properties to datagridviews

All lessons: Learn C# by Building a Simple RPG Index