首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 平面设计 > 图形图像 >

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

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

Android摄像头:只拍摄SurfaceView预览界面特定区域内容(矩形框)---完整实现(原理:底层SurfaceView+上层绘制ImageView)
最近一直在审视以前做过的东西,关于android摄像头预览,预览界面上呈现矩形框,在前文(

     废话不说了,稍候几天我会仿照上面360这个扫描二维码的界面做一个工程(结合PreviewCallback),公开出来。这次先谈用底层surfaceView+上层ImageView实现只拍摄矩形框中的图像。新建一个类继承ImageView,源码如下:

package yan.guoqi.rectphoto;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Paint.Style;import android.graphics.Rect;import android.util.AttributeSet;import android.widget.ImageView;public class DrawImageView extends ImageView{public DrawImageView(Context context, AttributeSet attrs) {super(context, attrs);// TODO Auto-generated constructor stub}Paint paint = new Paint();{paint.setAntiAlias(true);paint.setColor(Color.RED);paint.setStyle(Style.STROKE);paint.setStrokeWidth(2.5f);//设置线宽paint.setAlpha(100);};@Overrideprotected void onDraw(Canvas canvas) {// TODO Auto-generated method stubsuper.onDraw(canvas);canvas.drawRect(new Rect(100, 200, 400, 500), paint);//绘制矩形}}

布局文件里与前文http://blog.csdn.net/yanzi1225627/article/details/8577756这里一样,只是在帧布局里加一个上面自定义的DrawImageView,整个布局文件示下:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" >    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="@string/BestWish"        tools:context=".RectPhoto" />    <FrameLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content" >        <SurfaceView            android:id="@+id/previewSV"            android:layout_width="fill_parent"            android:layout_height="800px" />                <yan.guoqi.rectphoto.DrawImageView             android:id="@+id/drawIV"             android:layout_width="fill_parent"             android:layout_height="800px"            />    </FrameLayout>    <ImageButton        android:id="@+id/photoImgBtn"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:background="@drawable/photo_img_btn"        android:layout_gravity="center" /></LinearLayout>
      在主程序文件里,onCreate()函数里设置底层SurfaceView为底层且透明(如果不设也可以,默认就是如此):

mPreviewSV.setZOrderOnTop(false);

mySurfaceHolder.setFormat(PixelFormat.TRANSPARENT);//translucent半透明 transparent透明

     在主UI线程里的onCreate()函数里添加代码:

        //绘制矩形的ImageView
        mDrawIV = (yan.guoqi.rectphoto.DrawImageView)findViewById(R.id.drawIV);
        mDrawIV.onDraw(new Canvas());

       看上面的DrawImageView的函数里的onDraw,画的矩形是Rect(100, 200, 400, 500)。在onPictureTaken(byte[] data, Camera camera)函数里,先将图片旋转90度,大小成为宽×高(960×1280)。由于预览surfaceview的大小是宽×高(540×800),所以在onPictureTaken函数里将960×1280的图片缩放到540×800, 缩放相同大小后就可以用矩阵的坐标直接截取子图了。核心函数就是这两句:

        //将960×1280缩放到540×800
            Bitmap sizeBitmap = Bitmap.createScaledBitmap(rotaBitmap, 540, 800, true);
            Bitmap rectBitmap = Bitmap.createBitmap(sizeBitmap, 100, 200, 300, 300);//截取

     注意这个截取的函数参数和矩阵的坐标关系,分别是x轴 y轴起始坐标及 x轴宽度 y轴宽度。截取出来的图片大小应该是300×300. onPictureTaken()函数的源码如下:

public void onPictureTaken(byte[] data, Camera camera) {// TODO Auto-generated method stubLog.i(tag, "myJpegCallback:onPictureTaken...");if(null != data){mBitmap = BitmapFactory.decodeByteArray(data, 0, data.length);//data是字节数据,将其解析成位图myCamera.stopPreview();isPreview = false;}//设置FOCUS_MODE_CONTINUOUS_VIDEO)之后,myParam.set("rotation", 90)失效。图片竟然不能旋转了,故这里要旋转下Matrix matrix = new Matrix();matrix.postRotate((float)90.0);Bitmap rotaBitmap = Bitmap.createBitmap(mBitmap, 0, 0, mBitmap.getWidth(), mBitmap.getHeight(), matrix, false);//旋转后rotaBitmap是960×1280.预览surfaview的大小是540×800//将960×1280缩放到540×800Bitmap sizeBitmap = Bitmap.createScaledBitmap(rotaBitmap, 540, 800, true);Bitmap rectBitmap = Bitmap.createBitmap(sizeBitmap, 100, 200, 300, 300);//截取//保存图片到sdcardif(null != rectBitmap){saveJpeg(rectBitmap);}//再次进入预览myCamera.startPreview();isPreview = true;} 


涉及到的其他函数如saveJpeg()参见前文:



点击拍照,查看保存后的图片如下:

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

      反思:

1,SurfaceView为啥 无论translucent半透明还是 transparent透明基本没啥区别?而且surfaceview的setAlpha函数不能用。 

2,在这里surfaceview一定要在底层(默认如此),如果设成顶层会看不到红色矩形框。可以自己测试下。

3,最纠结的一点,第一副图片里的360扫描二维码的界面,底层的预览surfaceview是半透明的,底色是灰色的,只有中间的扫描矩形框是透明的,亮色。这一块究竟是怎么实现的??下午实验了n种方法愣是无济于事。我擦。。。如果有高人,希望能不吝指点下。 不过说实话,人家已经设计出来的产品界面看着就是好,不得不服阿。以后要多多模仿钻研这些成型产品的设计。

源码下载:http://download.csdn.net/detail/yanzi1225627/5063105                                           

欢迎android爱好者加群248217350,备注:yanzi

                                                                     ----------------------------------------本文系原创,转载请注明作者:yanzi1225627

    

热点排行