如何在 React Native 中从屏幕上的像素获取颜色？

Posted 2023-03-14

【中文标题】如何在 React Native 中从屏幕上的像素获取颜色？

【英文标题】：How can I get the color from a pixel on the screen in React Native?

【发布时间】：2016-07-25 15:14:12

【问题描述】：

我想渲染一张照片，并允许用户通过触摸它来选择颜色。但是我无论如何都找不到在触摸事件下检索绘制的像素。

有什么帮助吗？

【参考方案1】：

看这个例子..

使用 OntouchListener 检测您对 imageView 的触摸..

    @Override
    public boolean onTouch(View view, MotionEvent event) 

        float eventX = event.getX();
        float eventY = event.getY();
        float[] eventXY = new float[]eventX, eventY;

        int x = Integer.valueOf((int) eventXY[0]);
        int y = Integer.valueOf((int) eventXY[1]);

        Drawable imgDrawable = ((ImageView) view).getDrawable();
        Bitmap bitmap = ((BitmapDrawable) imgDrawable).getBitmap();

        //Limit x, y range within bitmap
        if (x < 0) 
            x = 0;
         else if (x > bitmap.getWidth() - 1) 
            x = bitmap.getWidth() - 1;
        

        if (y < 0) 
            y = 0;
         else if (y > bitmap.getHeight() - 1) 
            y = bitmap.getHeight() - 1;
        

        int touchedRGB = bitmap.getPixel(x, y);

        int r = Color.red(touchedRGB);
        int b = Color.blue(touchedRGB);
        int g = Color.green(touchedRGB);

        String rr = Integer.toString(r);
        String bb = Integer.toString(g);
        String gg = Integer.toString(b);

        String xyz = (rr+bb+gg);

        colorRGB.setText("touched color: " + "#" + xyz);

这里 xyz 是你的 rgb 颜色代码..

【讨论】：

我想我可以使用这种方法（读取图片帧上的 x+y，然后读取图像像素阵列中的相同位置），但是我正在寻找一种使用 react-本机 API。所以它也将与 ios 解决方案兼容。反正我会试试的。