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

原创 2015年11月18日 20:33:59

自定义 相机 及取景框 绘制

  1. 在相机预览组件上覆盖一层 自定义ImageView 重写 IamgeView的 ondraw() 方法。
    2.要实现第一步 首先要的到矩形框 左上角的 坐标(全屏下是marginLeft(左) marjinTop(上)-忽略单位) 还有 宽(width) 长(height) 来得到矩形区域 。
  2. 就是 重写ondraw()了 要用到 画布canvas 的方法 画矩形 drawRect 来完成 画出矩形 还需要 画笔Paint 来设置 属性 及 颜色 透明等等。 下面上代码

/* 
 * Copyright (c) 2015-2020 Founder Ltd. All Rights Reserved. 
 * 
 *zhx for  org
 * 
 * 
 */

package org.zhx.view.camera.widget;

import org.zhx.view.camera.util.DisplayUtil;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Paint.Style;
import android.graphics.Point;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.util.Log;
import android.widget.ImageView;

/**
 * 
 * 希望有一天可以开源出来 org.zhx
 * 
 * @version 1.0, 2015-11-15 下午7:11:49
 * @author zhx
 */
public class OverlayerView extends ImageView {
    private static final String TAG = OverlayerView.class.getSimpleName();

    private Paint mLinePaint;
    private Paint mAreaPaint;
    private Rect mCenterRect = null;
    private Context mContext;
    private Paint paint;
    private int widthScreen, heightScreen;

    public OverlayerView(Context context, AttributeSet attrs) {
        super(context, attrs);
        // TODO Auto-generated constructor stub
        initPaint();
        mContext = context;
        // 获取屏幕px值 组装成一个 point对象
        Point p = DisplayUtil.getScreenMetrics(mContext);
        widthScreen = p.x;
        heightScreen = p.y;
    }

    private void initPaint() {
        // 绘制中间透明区域矩形边界的Paint
        mLinePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        mLinePaint.setColor(Color.BLUE);
        mLinePaint.setStyle(Style.STROKE);
        mLinePaint.setStrokeWidth(5f);
        // 值不为0 那么透明取景框 周围就会有线 看需求 修改值就行 我的项目部需要 线 所以透明
        mLinePaint.setAlpha(0);

        // 绘制四周阴影区域 的画笔
        mAreaPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        mAreaPaint.setColor(Color.GRAY);
        mAreaPaint.setStyle(Style.FILL);
        mAreaPaint.setAlpha(100);
        paint = new Paint();

    }

    @Override
    protected void onDraw(Canvas canvas) {
        // TODO Auto-generated method stub
        Log.i(TAG, "onDraw...");
        if (mCenterRect == null)
            return;

        // 绘制阴影区域 2 为 4个角上短线的 高度
        canvas.drawRect(0, 0, widthScreen, mCenterRect.top - 2, mAreaPaint);
        canvas.drawRect(0, mCenterRect.bottom + 2, widthScreen, heightScreen,
                mAreaPaint);
        canvas.drawRect(0, mCenterRect.top - 2, mCenterRect.left - 2,
                mCenterRect.bottom + 2, mAreaPaint);
        canvas.drawRect(mCenterRect.right + 2, mCenterRect.top - 2,
                widthScreen, mCenterRect.bottom + 2, mAreaPaint);
        // 短线的颜色 和透明度
        paint.setColor(Color.WHITE);
        paint.setAlpha(150);
        // 50为 4角短线的长度
        canvas.drawRect(mCenterRect.left - 2, mCenterRect.bottom,
                mCenterRect.left + 50, mCenterRect.bottom + 2, paint);// 左下 底部

        canvas.drawRect(mCenterRect.left - 2, mCenterRect.bottom - 50,
                mCenterRect.left, mCenterRect.bottom, paint);// 左下 左侧

        canvas.drawRect(mCenterRect.right - 50, mCenterRect.bottom,
                mCenterRect.right + 2, mCenterRect.bottom + 2, paint);// 右下 右侧
        canvas.drawRect(mCenterRect.right, mCenterRect.bottom - 50,
                mCenterRect.right + 2, mCenterRect.bottom, paint);// 右下 底部

        canvas.drawRect(mCenterRect.left - 2, mCenterRect.top - 2,
                mCenterRect.left + 50, mCenterRect.top, paint);// 左上 顶部
        canvas.drawRect(mCenterRect.left - 2, mCenterRect.top,
                mCenterRect.left, mCenterRect.top + 50, paint);// 左上 侧边
        canvas.drawRect(mCenterRect.right - 50, mCenterRect.top - 2,
                mCenterRect.right + 2, mCenterRect.top, paint);// 右上 顶部
        canvas.drawRect(mCenterRect.right, mCenterRect.top,
                mCenterRect.right + 2, mCenterRect.top + 50, paint);// 右上 右侧

        // 绘制目标透明区域
        canvas.drawRect(mCenterRect, mLinePaint);
        super.onDraw(canvas);
    }

    public Rect getmCenterRect() {
        return mCenterRect;
    }

    /**
     * 设置 取景框 的矩形框 。
     * 
     * @param value
     *            矩形取景框
     * @return
     * @throws Exception
     * @author zhx
     */

    public void setmCenterRect(Rect mCenterRect) {
        this.mCenterRect = mCenterRect;
        postInvalidate();
    }

}
  • 辅助类

    “` android
    package org.zhx.view.camera.util;

import android.content.Context;
import android.graphics.Point;
import android.graphics.Rect;
import android.util.DisplayMetrics;
import android.util.Log;

/**
*
* 希望有一天可以开源出来 org.zhx
*
* @version 1.0, 2015-11-15 下午5:23:57
* @author zhx
*/
public class DisplayUtil {

private static final String TAG = DisplayUtil.class.getSimpleName();

public static int dip2px(Context context, float dipValue) {
    final float scale = context.getResources().getDisplayMetrics().density;
    return (int) (dipValue * scale + 0.5f);
}

/**
 * 
 * @param value
 * @return int
 * @throws Exception
 * @author zhx
 */
public static int px2dip(Context context, float pxValue) {
    final float scale = context.getResources().getDisplayMetrics().density;
    return (int) (pxValue / scale + 0.5f);
}

/**
 * 
 * @param value
 * @return
 * @throws Exception
 * @author zhx
 */
public static Point getScreenMetrics(Context context) {
    DisplayMetrics dm = context.getResources().getDisplayMetrics();
    int w_screen = dm.widthPixels;
    int h_screen = dm.heightPixels;
    Log.i(TAG, "Screen---Width = " + w_screen + " Height = " + h_screen
            + " densityDpi = " + dm.densityDpi);
    return new Point(w_screen, h_screen);

}

/**
 * 
 * @param value
 * @return
 * @throws Exception
 * @author zhx
 */
public static float getScreenRate(Context context) {
    Point P = getScreenMetrics(context);
    float H = P.y;
    float W = P.x;
    return (H / W);
}

/**
 * 
 * @param value
 * @return
 * @throws Exception
 * @author zhx
 */

public static Rect createCenterScreenRect(Context context, Rect rect) {
    int x1 = DisplayUtil.dip2px(context, rect.left);
    int y1 = DisplayUtil.dip2px(context, rect.top);
    int x2 = DisplayUtil.getScreenMetrics(context).x
            - DisplayUtil.dip2px(context, rect.right);
    int y2 = DisplayUtil.getScreenMetrics(context).y
            - DisplayUtil.dip2px(context, rect.bottom);
    Log.i(TAG, x1 + "@" + y1 + "@" + x2 + "@" + y2);
    return new Rect(x1, y1, x2, y2);
}

}

“`
- 源码 提交Git@osc 维护 下载地址:http://git.oschina.net/zhoulinxue/ZCamera.git

相关文章推荐

玩转Android Camera开发(四):预览界面四周暗中间亮,只拍摄矩形区域图片(附完整源码)

杂家前文曾写过一篇关于只拍摄特定区域图片的demo,只是比较简陋,在坐标的换算上不是很严谨,而且没有完成预览界面四周暗中间亮的效果,深以为憾,今天把这个补齐了。 在上代码之前首先交代下,这里面存在着换...

Delphi7高级应用开发随书源码

  • 2003年04月30日 00:00
  • 676KB
  • 下载

Android摄像头:只拍摄SurfaceView预览界面特定区域内容(矩形框)---完整实现(原理:底层SurfaceView+上层绘制ImageView)

【后注:】下载代码的注意,我的手机是4.3寸的屏,华为U9200.如果不能运行的请修改参数。看前文的第四条。Y的,省的说我传的代码不能用   最近一直在审视以前做过的东西,关于android摄像头预览...

camera2自定义相机,拍取矩形框内照片

前段时间,公司项目有个要求,拍照要获取矩形里面的照片,而且还可以任意裁剪后再上传的,做出来后遇到了一个坑,在华为荣耀手机api为21的手机里无论怎么调,它返回的照片就是400*320的,其它手机没问题...
  • xhy61
  • xhy61
  • 2017年03月16日 16:57
  • 302

android Zxing 扫描区域的大小设置和自定义扫描view

自己改造的Zxing 扩大扫描范围  实现自定义扫描布局 主要是CodeView 里面很详细的代码自定义view  CameraManager里面的四个参数 MIN_FRAME_WIDTH 、MIN_...

android 自定义view 实现定制二维码扫描框

上一篇文章说到如何使用google的zxing开源框架android导入zxing进行二维码开发,本篇就讲讲如何通过自定义ViewFinderView这个类来制作我们自己的扫描框。首先在com\goo...

Android Zxing 扫描器 扫描框、扫描线定制样式

一、概述相信Adnroid开发都知道,世界上有四款扫描器,Zxing 、Zbar ,Barcode4J、OkapiBarcode 前二者应用较广泛,至于介绍与区别就在此阐述,网上有很多。此文主要介绍在...
  • hupei
  • hupei
  • 2016年07月08日 10:59
  • 7193

iOS - 自定义相机取景框

UIImagePickerController *imagePicker = [[UIImagePickerController alloc] init]; imagePicker.delega...

Delphi7高级应用开发随书源码

  • 2003年04月30日 00:00
  • 676KB
  • 下载

Delphi7高级应用开发随书源码

  • 2003年04月30日 00:00
  • 676KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:如何为自定义相机添加 取景框|扫描框 |预览框|矩形框
举报原因:
原因补充:

(最多只允许输入30个字)