如何在android中的相机预览上绘制矩形

Posted

技术标签:

【中文标题】如何在android中的相机预览上绘制矩形【英文标题】:How to draw rectangle on a camera preview in android 【发布时间】:2017-12-21 22:07:40 【问题描述】:

其实我不明白如何在相机预览上实现矩形。一切正常,但我不知道如何放置像这个链接这样的矩形边框。请任何人帮助我。谢谢。

package com.example.redsignal.eventbizz;
public class CameraActivity extends AppCompatActivity 

public static final String FRAGMENT_TAG = "camera";
private static final int REQUEST_CAMERA_PERMISSIONS = 931;
private static final int REQUEST_PREVIEW_CODE = 1001;
@Bind(R.id.settings_view)
CameraSettingsView settingsView;
@Bind(R.id.flash_switch_view)
FlashSwitchView flashSwitchView;
@Bind(R.id.front_back_camera_switcher)
CameraSwitchView cameraSwitchView;
@Bind(R.id.record_button)
RecordButton recordButton;
@Bind(R.id.cameraLayout)
View cameraLayout;
Button btn_orc, btn_qr;
@Override
protected void onCreate(Bundle savedInstanceState) 
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_camera);
    ActionBar actionBar = getSupportActionBar();
    actionBar.hide();
    ButterKnife.bind(this);
    btn_orc = (Button) findViewById(R.id.btn_orc);
    btn_orc.setOnClickListener(new View.OnClickListener() 
        @Override
        public void onClick(View v) 
            Intent intent = new Intent(CameraActivity.this, CameraActivity.class);
            startActivity(intent);
            TastyToast.makeText(CameraActivity.this, "BCR Mode", TastyToast.LENGTH_LONG, TastyToast.INFO);
            finish();
        
    );
    btn_qr = (Button) findViewById(R.id.btn_qr);
    btn_qr = (Button) findViewById(R.id.btn_qr);
    btn_qr.setOnClickListener(new View.OnClickListener() 
        @Override
        public void onClick(View view) 
            Intent intent = new Intent(CameraActivity.this, QRCameraActivity.class);
            startActivity(intent);
            TastyToast.makeText(CameraActivity.this, "QR Mode", TastyToast.LENGTH_LONG, TastyToast.INFO);
            finish();
        
    );
    if (Build.VERSION.SDK_INT > 15) 
        final String[] permissions = 
                Manifest.permission.CAMERA,
                Manifest.permission.RECORD_AUDIO,
                Manifest.permission.WRITE_EXTERNAL_STORAGE,
                Manifest.permission.READ_EXTERNAL_STORAGE;

        final List<String> permissionsToRequest = new ArrayList<>();
        for (String permission : permissions) 
            if (ActivityCompat.checkSelfPermission(this, permission) != PackageManager.PERMISSION_GRANTED) 
                permissionsToRequest.add(permission);
            
        
        if (!permissionsToRequest.isEmpty()) 
            ActivityCompat.requestPermissions(this, permissionsToRequest.toArray(new String[permissionsToRequest.size()]), REQUEST_CAMERA_PERMISSIONS);
         else addCamera();
     else 
        addCamera();
    



@OnClick(R.id.flash_switch_view)
public void onFlashSwitcClicked() 
    final CameraFragmentApi cameraFragment = getCameraFragment();
    if (cameraFragment != null) 
        cameraFragment.toggleFlashMode();
    


@OnClick(R.id.front_back_camera_switcher)
public void onSwitchCameraClicked() 
    final CameraFragmentApi cameraFragment = getCameraFragment();
    if (cameraFragment != null) 
        cameraFragment.switchCameraTypeFrontBack();
    


@OnClick(R.id.record_button)
public void onRecordButtonClicked() 
    final CameraFragmentApi cameraFragment = getCameraFragment();
    if (cameraFragment != null) 
        cameraFragment.takePhotoOrCaptureVideo(new CameraFragmentResultAdapter() 

                                                   @Override
                                                   public void onPhotoTaken(byte[] bytes, String filePath) 
                                                       Toast.makeText(getBaseContext(), "onPhotoTaken " + filePath, Toast.LENGTH_SHORT).show();
                                                   
                                               ,
                "/storage/self/primary",
                "photo0");
    


@OnClick(R.id.settings_view)
public void onSettingsClicked() 
    final CameraFragmentApi cameraFragment = getCameraFragment();
    if (cameraFragment != null) 
        cameraFragment.openSettingDialog();
    




@Override
public void onRequestPermissionsResult(int requestCode, @NonNull String[] permissions, @NonNull int[] grantResults) 
    super.onRequestPermissionsResult(requestCode, permissions, grantResults);
    if (grantResults.length != 0) 
        addCamera();
    


@RequiresPermission(Manifest.permission.CAMERA)
public void addCamera() 
    cameraLayout.setVisibility(View.GONE);
    cameraLayout.setVisibility(View.VISIBLE);

    final CameraFragment cameraFragment = CameraFragment.newInstance(new Configuration.Builder()
            .setCamera(Configuration.CAMERA_FACE_REAR).build());
    getSupportFragmentManager().beginTransaction()
            .replace(R.id.content, cameraFragment, FRAGMENT_TAG)
            .commitAllowingStateLoss();

    if (cameraFragment != null) 


        cameraFragment.setStateListener(new CameraFragmentStateAdapter() 

            @Override
            public void onCurrentCameraBack() 
                cameraSwitchView.displayBackCamera();
            

            @Override
            public void onCurrentCameraFront() 
                cameraSwitchView.displayFrontCamera();
            

            @Override
            public void onFlashAuto() 
                flashSwitchView.displayFlashAuto();
            

            @Override
            public void onFlashOn() 
                flashSwitchView.displayFlashOn();
            

            @Override
            public void onFlashOff() 
                flashSwitchView.displayFlashOff();
            



            @Override
            public void shouldRotateControls(int degrees) 
                ViewCompat.setRotation(cameraSwitchView, degrees);
                ViewCompat.setRotation(flashSwitchView, degrees);
            

            @Override
            public void onRecordStatePhoto() 
                recordButton.displayPhotoState();
            

        );

        cameraFragment.setControlsListener(new CameraFragmentControlsAdapter() 
            @Override
            public void lockControls() 
                cameraSwitchView.setEnabled(false);
                recordButton.setEnabled(false);
                settingsView.setEnabled(false);
                flashSwitchView.setEnabled(false);
            

            @Override
            public void unLockControls() 
                cameraSwitchView.setEnabled(true);
                recordButton.setEnabled(true);
                settingsView.setEnabled(true);
                flashSwitchView.setEnabled(true);
            

            @Override
            public void allowCameraSwitching(boolean allow) 
                cameraSwitchView.setVisibility(allow ? View.VISIBLE : View.GONE);
            

            @Override
            public void allowRecord(boolean allow) 
                recordButton.setEnabled(allow);
            

        );

    


private CameraFragmentApi getCameraFragment() 
    return (CameraFragmentApi) getSupportFragmentManager().findFragmentByTag(FRAGMENT_TAG);

  <?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="vertical"
    android:layout_
    android:layout_>

    <FrameLayout
        android:id="@+id/content"
        android:layout_
        android:layout_/>


    <RelativeLayout
        android:id="@+id/cameraLayout"
        android:visibility="gone"
        tools:visibility="visible"
        android:layout_
        android:layout_
        >

        <RelativeLayout
            android:layout_
            android:layout_
            android:layout_alignParentEnd="true"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:paddingTop="10dp">

            <com.github.florent37.camerafragment.widgets.CameraSettingsView
                android:id="@+id/settings_view"
                android:layout_
                android:layout_
                android:layout_alignParentLeft="true"
                android:layout_centerVertical="true"
                android:layout_marginLeft="15dp"
                tools:ignore="RtlHardcoded" />

            <com.github.florent37.camerafragment.widgets.FlashSwitchView
                android:id="@+id/flash_switch_view"
                android:layout_
                android:layout_
                android:layout_centerInParent="true" />

            <com.github.florent37.camerafragment.widgets.CameraSwitchView
                android:id="@+id/front_back_camera_switcher"
                android:layout_
                android:layout_
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"
                android:layout_marginRight="15dp"
                tools:ignore="RtlHardcoded" />

        </RelativeLayout>

        <!--android:background="#82000000"-->
        <RelativeLayout
            android:id="@+id/record_panel"
            android:layout_
            android:layout_
            android:background="@android:color/transparent"
            android:layout_alignParentBottom="true"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true">

            <com.github.florent37.camerafragment.widgets.RecordButton
                android:id="@+id/record_button"
                android:layout_
                android:layout_
                android:layout_centerInParent="true"
                android:layout_marginLeft="50dp"
                android:layout_marginRight="50dp" />
            <Button
                android:id="@+id/btn_qr"
                android:layout_
                android:layout_
                android:layout_marginTop="30dp"
                android:layout_toLeftOf="@+id/btn_orc"
                android:layout_toStartOf="@+id/btn_orc"
                android:background="@drawable/qr_scan" />

            <Button
                android:id="@+id/btn_orc"
                android:layout_
                android:layout_
                android:layout_alignParentEnd="true"
                android:layout_alignParentRight="true"
                android:layout_marginLeft="7dp"
                android:layout_marginRight="5dp"
                android:layout_alignTop="@+id/btn_qr"
                android:background="@drawable/bcr_scan"
                tools:ignore="RtlHardcoded" />

 </RelativeLayout>

    </RelativeLayout>

</FrameLayout>

【问题讨论】:

链接不起作用..您是想在预览上画一个矩形,还是希望矩形内的区域是您的二维扫描仪唯一工作的区域? 在预览上画一个矩形 其实我想预览一下名片扫描 lh3.googleusercontent.com/… 就像上面的例子 【参考方案1】:

要实现这一点,您只需将相机预览放入FrameLayout,然后在相机预览上方放置一个带有此矩形的透明View

首先我们要创建矩形:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <stroke
            android:
            android:color="@color/white"
            android:dashGap="8dp"
            android:dashWidth="8dp" />

    <corners android:radius="8dp" />

然后你可以把这个视图放在你的预览上:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_
    android:layout_>

        <!-- this is your preview - whatever it looks like -->
        <View   
            android:layout_
            android:layout_ />   

         <!-- overlay - customize padding and stuff  -->
         <View   
            android:layout_ 
            android:layout_
            padding="32dp"
            android:background="@drawable/your_shape" />  
</FrameLayout>

编辑:

查看您的布局后,只需放置 htis 视图即可解决任务:

     <View
        padding="32dp"
        android:layout_
        android:layout_
        android:layout_above="@id/record_panel"
        android:layout_alignParentTop="true"
        android:background="@drawable/your_shape" />

作为布局的最后一项,id 为cameraLayout

【讨论】:

在 sn-p 我的布局中 你必须用你的布局替换第一个视图 - 我不知道它是什么样子 谢谢 :) 大功告成 你能推荐一个老板卡扫描仪 非常好的解决方案,喜欢它的时候很简单:)【参考方案2】:

要在相机预览上绘制任何类型的视图,请制作一个 覆盖意味着绘制任何形状的画布,例如手机制作具有特定颜色的矩形画布,此覆盖将覆盖整个屏幕。

现在通过更改画布的 alpha 使其变得半透明。

现在绘制另一个您需要的形状的画布,如圆形和矩形,并使其透明。

代码如下:

   public class DrawOnTop extends View 
    int screenCenterX = 0;
    int screenCenterY = 0;
    int radius = 50;

    public DrawOnTop(Context context, int screenCenterX, int screenCenterY, int radius) 
        super(context);
        this.screenCenterX = screenCenterX;
        this.screenCenterY = screenCenterY;
        this.radius = radius;
    

    @Override
    protected void onDraw(Canvas canvas) 
        Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint.setColor(getResources().getColor(R.color.white));
        paint.setAlpha(130);
        paint.setStyle(Paint.Style.FILL);
        canvas.drawPaint(paint);
        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
        canvas.drawCircle(screenCenterX, screenCenterY, radius, paint);
        super.onDraw(canvas);
    
 

【讨论】:

以上是关于如何在android中的相机预览上绘制矩形的主要内容,如果未能解决你的问题,请参考以下文章

Android OpenGL基础相机预览及滤镜

如何裁剪矩形区域? [关闭]

在surfaceView上绘制

我如何在 Surfaceview 上绘制任何已经渲染相机预览的线?

如何绘制一个矩形到脸部的位置?

如何为自定义相机添加 取景框|扫描框 |预览框|矩形框