Question

我正在使用ChartView Telerik WPF库。当用户将鼠标悬停在这些点上时，我希望这些点变大。但是由于某种原因，它没有按预期工作。椭圆会变大，但无法正确调整大小。但是我不明白为什么。其他属性（如边框颜色和厚度）均正常运行。有人可以告诉我我在这里想念什么吗？

这是我尝试调整点大小时的当前外观：

这是源代码：

private FrameworkElementFactory AddPointsToSeries(KeyValuePair<ChartSerie, List<ChartDataPoint>> chartSeries, int colorPaletteIndex)
    {
        var seriesPredefinedColor = this.ChartBase.Palette.GlobalEntries[colorPaletteIndex].Fill;

        FrameworkElementFactory frameworkElement = new FrameworkElementFactory(typeof(Ellipse));
        frameworkElement.SetValue(Ellipse.FillProperty, ColorService.BrushFromHex(chartSeries.Key.ColorHex) ?? seriesPredefinedColor);
        frameworkElement.SetValue(Ellipse.HeightProperty, 9.0D);
        frameworkElement.SetValue(Ellipse.WidthProperty, 9.0D);


        frameworkElement.AddHandler(Ellipse.MouseEnterEvent, new MouseEventHandler((sender, args) =>
           {
               Ellipse ellipse = (Ellipse)sender;
               ellipse.Stroke = ColorService.BrushFromHex(ColorService.BlendHex((chartSeries.Key.ColorHex ?? ColorService.BrushToHex(seriesPredefinedColor)), "#000000", 0.4));

               // this is not correctly applied!
               ellipse.Width = 15;
               ellipse.Height = 15;

               ellipse.StrokeThickness = 2;
           }));

        frameworkElement.AddHandler(Ellipse.MouseLeaveEvent, new MouseEventHandler((sender, args) =>
           {
               Ellipse ellipse = (Ellipse)sender;
               ellipse.Height = 8;
               ellipse.Width  = 8;

               ellipse.Stroke = null;
           }));


        return frameworkElement;
    }

    // Here I create the Line Series and here I use the AddPointsToSeries Method
    private LineSeries CreateLineSeries(KeyValuePair<ChartSerie, List<ChartDataPoint>> chartSeries, ChartLegendSettings legendSettings,
                                        int colorPaletteIndex)
    {
        FrameworkElementFactory addPoints = AddPointsToSeries(chartSeries, colorPaletteIndex);
        var lineSerie = new LineSeries()
        {
            VerticalAxis    = CreateMultipleVerticalAxis(chartSeries, colorPaletteIndex, out var multipleVerticalAxis) ? multipleVerticalAxis : null,
            ZIndex          = 150, // the line series should always be displayed on top of other series.
            StrokeThickness = 3.5,
            LegendSettings  = (SeriesLegendSettings)legendSettings,
            Opacity         = 0.8,
            StackGroupKey = chartSeries.Key.Group,
            CombineMode   = string.IsNullOrEmpty(chartSeries.Key.Group) ? ChartSeriesCombineMode.None : ChartSeriesCombineMode.Stack,

            PointTemplate = new DataTemplate()
            {
                VisualTree = addPoints,
            },
        };

        // this is the color of line series
        if (chartSeries.Key.ColorHex != null)
        {
            lineSerie.Stroke = (SolidColorBrush)(new BrushConverter().ConvertFrom(chartSeries.Key.ColorHex));
        }

        foreach (ChartDataPoint serie in chartSeries.Value)
        {
            lineSerie.DataPoints.Add(new CategoricalDataPoint()
            {
                Category = serie.XPoint.Label,
                Value    = (double?)serie.Value,
            });
        }

        return lineSerie;
    }

Answer 1

我的问题得到了我的马丁·伊凡诺夫的回答：

此行为来自图表的大小缓存机制。基本上，控件是在初始加载时设置视觉效果的大小，然后除非图表API上的某些内容发生变化，否则它不会更改它的大小。为了满足您的要求，您可以将椭圆包装在“网格”面板中，并将其“宽度”和“高度”属性设置为与较大椭圆的大小相同（或更小）。

这是解决方案：

private FrameworkElementFactory AddPointsToSeries(KeyValuePair<ChartSerie, List<ChartDataPoint>> chartSeries, int colorPaletteIndex)
    {
        var   seriesPredefinedColor = this.ChartBase.Palette.GlobalEntries[colorPaletteIndex].Fill;
        Brush brush                 = chartSeries.Key.ColorHex == null ? (seriesPredefinedColor) : ColorService.HexToBrush(chartSeries.Key.ColorHex);
        Brush mouseOnEnterColor     = new SolidColorBrush(ColorService.ChangeColorLightness(ColorService.BrushToColor(brush), 0.8));

        double ellipseMouseOverStrokeThickness = 2;
        double ellipseMouseOverHeightWidth     = 13;
        double ellipseStrokeThickness          = 1;
        double ellipseHeightWidth              = 9;

        FrameworkElementFactory frameworkElement = new FrameworkElementFactory(typeof(Ellipse));
        frameworkElement.SetValue(Ellipse.FillProperty, brush);
        frameworkElement.SetValue(Ellipse.MarginProperty, new Thickness(-4.5));
        frameworkElement.SetValue(Ellipse.HeightProperty, ellipseHeightWidth);
        frameworkElement.SetValue(Ellipse.WidthProperty, ellipseHeightWidth);
        frameworkElement.SetValue(Ellipse.StrokeProperty, new SolidColorBrush(Colors.White));
        frameworkElement.SetValue(Ellipse.StrokeThicknessProperty, ellipseStrokeThickness);


        frameworkElement.AddHandler(Ellipse.MouseEnterEvent, new MouseEventHandler((sender, args) =>
                                                                                   {
                                                                                       Ellipse ellipse = (Ellipse)sender;
                                                                                       ellipse.Fill            = new SolidColorBrush(Colors.White);
                                                                                       ellipse.Stroke          = mouseOnEnterColor;
                                                                                       ellipse.StrokeThickness = ellipseMouseOverStrokeThickness;
                                                                                       ellipse.Width           = ellipseMouseOverHeightWidth;
                                                                                       ellipse.Height          = ellipseMouseOverHeightWidth;
                                                                                   }));

        frameworkElement.AddHandler(Ellipse.MouseLeaveEvent, new MouseEventHandler((sender, args) =>
                                                                                   {
                                                                                       Ellipse ellipse = (Ellipse)sender;
                                                                                       ellipse.Stroke          = new SolidColorBrush(Colors.White);
                                                                                       ellipse.Fill            = brush;
                                                                                       ellipse.StrokeThickness = ellipseStrokeThickness;
                                                                                       ellipse.Height          = ellipseHeightWidth;
                                                                                       ellipse.Width           = ellipseHeightWidth;
                                                                                   }));

        FrameworkElementFactory stackPanelFactory = new FrameworkElementFactory(typeof(Grid));
        stackPanelFactory.SetValue(Grid.HeightProperty, ellipseMouseOverHeightWidth + ellipseMouseOverStrokeThickness);
        stackPanelFactory.SetValue(Grid.WidthProperty, ellipseMouseOverHeightWidth  + ellipseMouseOverStrokeThickness);
        stackPanelFactory.AppendChild(frameworkElement);

        return stackPanelFactory;
    }

现在看起来像这样：

WPF Ellipse不会在MouseEnter事件上正确调整大小

1 个答案: