Example Customization

In the following example, countries in North America are color coded, and sales figures that are evenly divisible by 5 are highlighted.

To customize the C1FlexGrid Silverlight control, click the Write Code button in the screen designer and add code for the Created method:

partial void Test_Created()
{
    IContentItemProxy proxy = this.FindControl("C1FlexGrid");
    proxy.ControlAvailable +=
        new EventHandler<ControlAvailableEventArgs>(proxy_ControlAvailable);
}

Next, add the following using statements:

using C1.Silverlight.FlexGrid;
using C1.LightSwitch.FlexGrid.Presentation.Controls;
using System.Windows.Media;

When the ControlAvailable event handler fires, your code will be able to access the C1FlexGrid control and get a reference to the Country column:

void proxy_ControlAvailable(object sender, ControlAvailableEventArgs e)
{
    C1.Silverlight.FlexGrid.C1FlexGrid _flex =
        e.Control as C1.Silverlight.FlexGrid.C1FlexGrid;
    LSColumn col = _flex.Columns["Country"] as LSColumn;
   // continued below...
}

Note that you will need to cast the result to LSColumn in order to attach conditional formatting expressions to the column. Since the conditions involve simple string comparisons, you can use the TextConditionalFormat class, which is also used internally by the FlexGrid Text Column control. Its constructor takes a background color, a foreground color, and a boolean that determines whether matching conditions are rendered with a bold font. The Operator and Value properties specify a binary expression that will be evaluated against all values within the column.

TextConditionalFormat f1 = new TextConditionalFormat(Colors.Red, Colors.White, false);
f1.Operator = ConditionOperator.Equals;
f1.Value = "Canada";


TextConditionalFormat f2 = new TextConditionalFormat(Colors.Blue, Colors.White, false);
f2.Operator = ConditionOperator.Equals;
f2.Value = "USA";


TextConditionalFormat f3 = new TextConditionalFormat(Colors.Green, Colors.White, false);
f3.Operator = ConditionOperator.Equals;
f3.Value = "Mexico";


col.ConditionalFormats.Add(f1);
col.ConditionalFormats.Add(f2);
col.ConditionalFormats.Add(f3);

Once each format object is added to the column’s ConditionalFormats collection, they will be evaluated automatically as appropriate, and no further action is required.

To implement the “multiple of 5” formatting for the Sales column, you will need to derive a class from C1.LightSwitch.FlexGrid.Presentation.Controls.ConditionalFormat or one of its subclasses. Since this is a numeric column, you should use NumericConditionalFormat:

public class CustomFormat : NumericConditionalFormat
{
    public CustomFormat(string backColor) : base(backColor, null, false)
    {
    }
}

The CustomFormat constructor takes only a string representing a background color value, as this example does not apply formatting to cell text. By default, NumericConditionalFormat objects must have their Value property set in order to be evaluated. In this example, however, a comparison value is not needed, so we override the following property to always return true:

public override bool IsValid
{
    get { return true; }
}

The Evaluate method does the real work. If it returns true, then the LSColumn object will apply the formatting specified in the CustomFormat constructor to the corresponding cell. If it returns false, then no custom formatting is applied.

public override bool Evaluate(object obj)
{
    if (IsNumeric(obj))
    {
        decimal n = System.Convert.ToDecimal(obj);
        return (n % 5M) == 0;
    }

    return false;
}

Finally, at the end of the ControlAvailable handler, we need to instantiate the CustomFormat class and append it to the ConditionalFormats collection for the Sales column:

col = _flex.Columns["Sales"] as LSColumn;
CustomFormat cf = new CustomFormat("#80FFFF00");
col.ConditionalFormats.Add(cf);

It is possible to use both design time conditional formatting and custom formatting in code on the same column, since they both use the ConditionalFormats collection to convey formatting rules to the low-level display code.