如何在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中的相机预览上绘制矩形的主要内容,如果未能解决你的问题,请参考以下文章