Xamarin.Forms.Shapes.Line重叠绘制iOS端出现异常阴影问题咨询

• 平台渲染逻辑差异：Xamarin.Forms.Shapes.Line在iOS端采用CoreGraphics框架绘制，和Android端的Canvas渲染逻辑不同。当使用PenLineCap.Round端点样式时，线条边缘会生成半透明抗锯齿像素，两条线交叉时iOS的alpha混合计算会让同色半透明像素叠加后出现色差，表现为类似阴影的异常效果。
• 坐标计算错误：你当前代码中计算Line的X、Y坐标时错误引入了container.X（该值是AbsoluteLayout相对于父控件的偏移量），而Line的坐标本应相对于AbsoluteLayout本身计算，错误的偏移会导致线条绘制在亚像素位置，进一步放大iOS端抗锯齿叠加的色差问题。
• 控件重复添加：drawX方法绑定到了SizeChanged事件，每次尺寸变化都会新增两条Line到容器中，多层线条叠加会加重异常效果。

简易修正方案（仅修改现有代码） #

直接修正坐标逻辑，增加清空旧控件的逻辑即可解决绝大多数场景的问题：

private void drawX(object sender, EventArgs e) 
{
    var container = (AbsoluteLayout)sender;
    // 先清空旧控件，避免重复添加
    container.Children.Clear();

    double width = container.Width;
    double height = container.Height;
    double offset = width * 0.3;

    PenLineCap lineCap = PenLineCap.Round;
    double strokeThickness = 2;
    SolidColorBrush brush = new SolidColorBrush(Color.White);

    // 去掉了container.X的错误引用，坐标直接相对于容器
    Line line1 = new Line {
        X1 = offset,
        Y1 = offset,
        X2 = width - offset,
        Y2 = height - offset,
        Stroke = brush,
        StrokeLineCap = lineCap,
        StrokeThickness = strokeThickness,
        Opacity = 1
    };

    Line line2 = new Line {
        X1 = offset,
        Y1 = height - offset,
        X2 = width - offset,
        Y2 = offset,
        Stroke = brush,
        StrokeLineCap = lineCap,
        StrokeThickness = strokeThickness,
        Opacity = 1
    };

    container.Children.Add(line1);
    container.Children.Add(line2);
}

彻底兼容方案（推荐） #

直接用Path控件一次性绘制完整X形，从根源避免两条线叠加的混合问题，双端表现完全一致：

private void drawX(object sender, EventArgs e) 
{
    var container = (AbsoluteLayout)sender;
    container.Children.Clear();
    double width = container.Width;
    double height = container.Height;
    double offset = width * 0.3;

    PathFigureCollection figures = new PathFigureCollection();
    // 第一条线：左上到右下
    figures.Add(new PathFigure {
        StartPoint = new Point(offset, offset),
        Segments = new PathSegmentCollection {
            new LineSegment { Point = new Point(width - offset, height - offset) }
        }
    });
    // 第二条线：左下到右上
    figures.Add(new PathFigure {
        StartPoint = new Point(offset, height - offset),
        Segments = new PathSegmentCollection {
            new LineSegment { Point = new Point(width - offset, offset) }
        }
    });

    Path xPath = new Path {
        Data = new PathGeometry { Figures = figures },
        Stroke = new SolidColorBrush(Color.White),
        StrokeLineCap = PenLineCap.Round,
        StrokeThickness = 2
    };
    container.Children.Add(xPath);
}

内容的提问来源于stack exchange，提问作者wiisco