Hi,
Axes in FlexChart are not FrameworkElements and hence don’t inherit the DataContext from their parent. So, In order to make the Binding work on Axis level, we have to provide the Source for Binding explicitly. This can be done by using a custom Freezable object as follows:
public class BindingProxy : Freezable
{
protected override Freezable CreateInstanceCore()
{
return new BindingProxy();
}
public object Source
{
get
{
return GetValue(SourceProperty);
}
set
{
SetValue(SourceProperty, value);
}
}
public static readonly DependencyProperty SourceProperty = DependencyProperty.Register("Source", typeof(object), typeof(BindingProxy), new UIPropertyMetadata());
}
And then use this for Binding on Axis.Style properties as follows:
<local:FlexChart.Resources>
<local:BindingProxy x:Key="bindingProxy" Source="{Binding}" />
</local:FlexChart.Resources>
<local:FlexChart.AxisX >
<c1:Axis MajorGrid="True" AxisLine="True" >
<c1:Axis.Style>
<c1:ChartStyle Stroke="{Binding Source.AxisStroke, Source={StaticResource bindingProxy}, Mode=TwoWay}"
StrokeDashArray="10 7"
StrokeThickness="{Binding Source.AxisThickness, Source={StaticResource bindingProxy}, Mode=TwoWay}"/>
</c1:Axis.Style>
</c1:Axis>
</local:FlexChart.AxisX>
Also, since ChartStyle does not implement INotifyPropertyChanged so, for any style property changes to be rendered immediately we have to force the FlexChart to re-render. For this we can have a property (say IsDirty) in our ViewModel and then use this for re-rendering FlexChart as follows:
public bool IsDirty
{
get { return _isDirty; }
set
{
if (_isDirty != value)
{
_isDirty = value;
RaisePropertyChanged(nameof(IsDirty));
}
}
}
protected virtual void RaisePropertyChanged([CallerMemberName] string propertyName = null)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
if(propertyName == nameof(AxisThickness) || propertyName == nameof(AxisStroke))
{
IsDirty = true;
}
}
Use this with FlexChart as follows:
<local:FlexChart x:Name="flexChart"
Tag="{Binding IsDirty, NotifyOnTargetUpdated=True}" TargetUpdated="FlexChart_TargetUpdated"/>
private void FlexChart_TargetUpdated(object sender, DataTransferEventArgs e)
{
if ((Boolean)flexChart.Tag)
{
flexChartViewModel.IsDirty = false;
flexChart.BeginUpdate();
flexChart.EndUpdate();
}
}
Please refer the attached modified sample (prj_FlexChartBindings.zip) to verify the same.
Thanks,
Basant
prj_FlexChartBindings.zip
