Segmentation and displaying content from dictionary

Question

Through my initial program code, I have been able to generate a dictionary of {string, int} fo some some length (mostly 3).

In my application, I have to display the strings separated by a semi-colon, and on hovering over a certain string, it should display the corresponding int of the string as something sort of a tooltip

My idea of doing this was to have the labels (equal to number of strings in dictionary) being displayed, content of each label being picked up from the dictionary's keys, and displaying the tooltip from corresponding value pair.

Though, I am able to generate these labels as said above, I am not sure, how should I be displaying them in a way such Label1 Content ; Label2 Content ; Label3 Content

Is this the correct approach of doing this thing? And how should the labels be displayed according to the above layout (in a stack panel or something? how would these be separated by ; if I have the labels set as the children of stack panel). I am not quite sure.

score 1 · Accepted Answer · edited May 23 '17 at 11:56

You will want to use an ItemsControl, with its ItemsPanel set to a StackPanel with Orientation of Horizontal.

Have a look here - Use different template for last item in a WPF itemscontrol.

This shows a solution in XAML that will allow you to omit a semi-colon after the final item in the ItemsControl.

The other thing you may wish to do is convert your dictionary into an ObservableCollection of an 'Item' type or something similar, which means you can use property names in your ItemControl template bindings, which is neater. Something like:

var items = dictionary.Select(kv => new Item { Name = kv.Key, Value = kv.Value });
this.Items = new ObservableCollection<Item>(items);

Where Items is an ObservableCollection<Item> type, and Item is defined as:

public class Item
{
    public string Name { get; set; }
    public int Value { get; set; }
}

Note that if you instantiate the ObservableCollection in anything other than the constructor, then your Items property setter should invoke the PropertyChanged event, so that the UI is notified of the change.

I don't know how many items you are rendering, but you could also use a WrapPanel, which would allow the Labels to wrap after they reach a certain width. Note that the WrapPanel implemented in WPF doesn't virtualise though, so it will not perform as well for a large number of items.

Segmentation and displaying content from dictionary

1 Answers1