Xamarin中如何将触摸点映射到图片/位图的对应像素？

问题核心是触摸坐标是屏幕/CanvasView上的显示坐标，而SkBitmap.GetPixel()需要的是图片原始像素坐标，二者之间存在缩放、偏移的转换关系，直接使用触摸坐标会因为尺寸不匹配导致只能取到左上角区域的像素。

解决步骤：

• 第一步：记录图片绘制时的实际显示区域（缩放、偏移后的Rect）
  在CanvasView的Draw方法中绘制图片时，计算出图片在画布上的绘制矩形（比如destRect），将这个Rect保存下来供触摸事件使用。
• 第二步：将触摸坐标转换为图片的原始像素坐标
  1. 先判断触摸点是否在图片的显示区域内，避免无效计算
  2. 计算触摸点相对于显示区域的偏移比例
  3. 用比例乘以图片原始宽高，得到对应的原始像素坐标

修改后的代码示例 #

首先在类中保存绘制区域和SkBitmap的引用：

private SkBitmap _targetBitmap;
private SKRect _imageDrawRect; // 保存图片在CanvasView上的实际绘制区域

在CanvasView的Draw方法中绘制图片时，计算并保存_imageDrawRect：

protected override void OnPaintSurface(SKPaintSurfaceEventArgs args)
{
    SKImageInfo info = args.Info;
    SKSurface surface = args.Surface;
    SKCanvas canvas = surface.Canvas;

    canvas.Clear();

    if (_targetBitmap == null) return;

    // 计算图片的缩放比例，以保持比例居中适配CanvasView为例
    float scaleX = (float)info.Width / _targetBitmap.Width;
    float scaleY = (float)info.Height / _targetBitmap.Height;
    float scale = Math.Min(scaleX, scaleY);

    float scaledWidth = _targetBitmap.Width * scale;
    float scaledHeight = _targetBitmap.Height * scale;

    // 计算居中绘制的偏移量
    float left = (info.Width - scaledWidth) / 2;
    float top = (info.Height - scaledHeight) / 2;

    _imageDrawRect = new SKRect(left, top, left + scaledWidth, top + scaledHeight);

    // 绘制图片
    canvas.DrawBitmap(_targetBitmap, _imageDrawRect, null);
}

然后修改触摸事件处理方法：

void OnTouchEffectAction(object sender, TouchActionEventArgs args)
{
    if (_targetBitmap == null || _imageDrawRect.IsEmpty) return;

    Point touchPoint = args.Location;
    float touchX = touchPoint.X;
    float touchY = touchPoint.Y;

    // 判断触摸点是否在图片显示区域内
    if (!_imageDrawRect.Contains(touchX, touchY)) return;

    // 计算相对于图片显示区域的偏移比例
    float horizontalRatio = (touchX - _imageDrawRect.Left) / _imageDrawRect.Width;
    float verticalRatio = (touchY - _imageDrawRect.Top) / _imageDrawRect.Height;

    // 转换为原始图片的像素坐标
    int bitmapX = (int)(_targetBitmap.Width * horizontalRatio);
    int bitmapY = (int)(_targetBitmap.Height * verticalRatio);

    // 确保坐标在图片范围内，避免越界报错
    bitmapX = Math.Clamp(bitmapX, 0, _targetBitmap.Width - 1);
    bitmapY = Math.Clamp(bitmapY, 0, _targetBitmap.Height - 1);

    // 获取对应像素颜色
    SKColor color = _targetBitmap.GetPixel(bitmapX, bitmapY);
    // 后续处理颜色逻辑...
}

关键说明：

• 必须基于图片实际绘制的_imageDrawRect来转换坐标，它包含了图片缩放、平移后的所有显示参数
• 比例转换方式可以适配任何缩放模式（拉伸、保持比例、居中、填充等）
• 使用Math.Clamp确保坐标不会超出图片的像素范围，避免运行时异常

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