xmlns:ig="clr-namespace:Infragistics.XamarinForms.Controls.Charts;assembly=Infragistics.XF.Charts"
xmlns:local="clr-namespace:MyAppNamespace"
このトピックではコード例を使用して、XamCategoryChart コントロールのツールチップを構成する方法を説明します。
ツールチップ コンテンツは、XamCategoryChart オブジェクトの ToolTipTemplate プロパテによって提供されます。 Xamarin.Forms では、ツールチップを構成する視覚要素を含む DataTemplate を使用します。
XamCategoryChart のツールチップは、チャートでプロットされる各シリーズを表します。値プロパティ名が同じ階層構造を使用している場合以外、ToolTipTemplate プロパティと DataTemplateSelector を使用してください。
ToolTipTemplate で使用される DataTemplate に配置される要素が DataContext オブジェクトのバインディング コンテキストを持ちます。このオブジェクトが特定のツールチップの基本データ項目を Item プロパティによってアクセスできるし、表されている Series を Series プロパティによってアクセスできます。この DataContext クラスおよび DataTemplateSelector の使用が以下のコード スニペットで表示されます。
XamCategoryChart コントロールのツールチップのルック アンド フィールをカスタマイズするには、ToolTipTemplate プロパティに追加して以下のプロパティを設定できます。
以下のコード例は、上記のプロパティおよび DataTemplateSelector を使用して XamCategoryChart コントロールのツールチップをカスタマイズする方法を紹介します。
XAML の場合:
xmlns:ig="clr-namespace:Infragistics.XamarinForms.Controls.Charts;assembly=Infragistics.XF.Charts"
xmlns:local="clr-namespace:MyAppNamespace"XAML の場合:
<ig:XamCategoryChart ItemsSource="{Binding}"
ChartType="Column"
ToolTipBackgroundColor="LightGray"
ToolTipBorderColor="DarkOrange"
ToolTipBorderThickness="2">
<ig:XamCategoryChart.ToolTipTemplate>
<local:TooltipSelector/>
</ig:XamCategoryChart.ToolTipTemplate>
</ig:XamCategoryChart>C# の場合:
namespace MyAppNamespace
{
public class TooltipSelector : DataTemplateSelector
{
protected override DataTemplate OnSelectTemplate(object item, BindableObject container)
{
if (container is ColumnSeries)
{
ColumnSeries series = container as ColumnSeries;
DataTemplate template = CreateDataTemplate(series);
return template;
}
else
{
return null;
}
}
private DataTemplate CreateDataTemplate(ColumnSeries series)
{
DataTemplate template = new DataTemplate(() =>
{
StackLayout layout = new StackLayout() { Orientation = StackOrientation.Horizontal, Margin = new Thickness(5, 2) };
Label titleLabel = new Label() { TextColor = ((SolidColorBrush)series.ActualBrush).Color };
titleLabel.Text = series.ValueMemberPath + ": ";
Label valueLabel = new Label() { TextColor = ((SolidColorBrush)series.ActualBrush).Color };
valueLabel.SetBinding(Label.TextProperty, new Binding("Item." + series.ValueMemberPath));
layout.Children.Add(titleLabel);
layout.Children.Add(valueLabel);
return layout;
});
return template;
}
}
}