Feather: Extend the Navigation widget model

You can extend widget models to modify widgets implementation.

The following example demonstrates  how to extend the model of the Feather Navigation widget and thus modify the widget's display settings. You first implement a custom model that represents page nodes with descriptions and then modify the widget's view to use the new model.

First, in the Mvc/Models/Navigation folder you create a new view model that represents a page node. The model inherits from the default model, so it is usable. Add an extra Description property to the model:

As a result, the new model extracts page descriptions.

Next, you create a new model that is aware of the custom view model. The new navigation model inherits from the default model and exposes the same constructors. You then override the InstantiateNodeViewModel method and its overloads in the new model:

You use the NavigationView.Tabs view as a starting point. Wherever page nodes are enumerated, make sure to specify the new view model class and print the node's Description:

You finally replace the original implementation of the Navigation widget model with the new model. You do this using Bootstrapper.Initialized event. Place the following code in your Global.asax file: