Semantic Zoom - Show letters containing no items

Question

How can I show letters of the alphabet, which contain no items beginning with that letter (in gray) within the ZoomedOutView view of my semantic zoom control?

I want to achieve something like this (excluding 'Social', 'Favorites' and '#'):

but I end up with this:

Now I know the code below is where the issue is but I don't know what I need to change it to. Any ideas?

internal List<GroupInfoList<object>> GetGroupsByLetter()
        {
            List<GroupInfoList<object>> groups = new List<GroupInfoList<object>>();

            var query = from item in Collection
                        orderby ((Item)item).Station
                        group item by ((Item)item).Station[0] into g
                        select new { GroupName = g.Key, Items = g };
            foreach (var g in query)
            {
                GroupInfoList<object> info = new GroupInfoList<object>();
                info.Key = g.GroupName;
                foreach (var item in g.Items)
                {
                    info.Add(item);
                }
                groups.Add(info);
            }

            return groups;

        }

Answer 1

This is quite simple.

You must always include every letter group.

In your ZoomedInView you set it so that groups without items are hidden. It's a property in the gridview. In your ZoomedOutView you simply show all the groups in the gridview with a converter that checks if there are children, switching the color depending. You will also add the logic not to respond to the user if they click a group with no children. The end. Problem solved.

Best of luck!