前言
最近遇到拍照時(shí)帶取景框的需求鳄抒，于是自己寫了個(gè)簡單的取景框配合相機(jī)預(yù)覽界面實(shí)現(xiàn)拍照功能浴捆。本文涉及自定義view的內(nèi)容冬殃，還不太了解同學(xué)的可以移步https://hencoder.com/大牛系統(tǒng)介紹了Android自定義View相關(guān)知識(shí)結(jié)構(gòu)，可以讓你對自定義view有個(gè)清晰的認(rèn)識(shí)尚猿，感謝大牛的分享智绸。首先看下完成后的效果：
效果圖
正文
首先創(chuàng)建BackgroundView繼承自View野揪，通常實(shí)現(xiàn)三個(gè)構(gòu)造函數(shù)。
public BackgroundView(Context context) {
this(context, null);
}
public BackgroundView(Context context, @Nullable AttributeSet attrs) {
this(context, attrs, 0);
}
public BackgroundView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
mContext = context;
mPaint = new Paint();
TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.BackgroundView);
if (ta != null) {
mRectLeft = ta.getDimension(R.styleable.BackgroundView_rectLeft, defaultRectLeft);
mRectTop = ta.getDimension(R.styleable.BackgroundView_rectTop, defaultRectTop);
mRectRight = ta.getDimension(R.styleable.BackgroundView_rectRight, defaultRectRight);
mRectBottom = ta.getDimension(R.styleable.BackgroundView_rectBottom, defaultRectBottom);
mRectCornerRadius = ta.getDimension(R.styleable.BackgroundView_rectCornerRadius, defaultRectCornerRadius);
mRectOutColor = ta.getColor(R.styleable.BackgroundView_rectOutColor, defaultRectOutColor);
}
}
單個(gè)參數(shù)的構(gòu)造方法是在代碼中new對象用的瞧栗，帶AttributeSet參數(shù)的構(gòu)造是在xml中用的:
<com.example.customcamera.BackgroundView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:rectLeft="30dp"
app:rectTop="100dp"
app:rectRight="30dp"
app:rectBottom="300dp"
app:rectCornerRadius="10dp"
app:rectOutColor="#99ff0000" />
如果要自定義屬性需要在/res/values/attrs.xml中創(chuàng)建
<resources>
<declare-styleable name="BackgroundView">
<attr name="rectLeft" format="dimension" /><!--取景框左邊緣距離屏幕左邊的距離-->
<attr name="rectTop" format="dimension" /><!--取景框上邊緣距離屏幕上邊的距離-->
<attr name="rectRight" format="dimension" /><!--取景框右邊緣距離屏幕右邊的距離-->
<attr name="rectBottom" format="dimension" /><!--取景框下邊緣距離屏幕下邊的距離-->
<attr name="rectCornerRadius" format="dimension" /><!--取景框圓角半徑-->
<attr name="rectOutColor" format="color" /><!--取景框外部顏色斯稳，通常為半透明-->
</declare-styleable>
</resources>
name即屬性名，format即你要聲明的屬性是什么類型如尺寸為dimension迹恐、字符串為string平挑，Android Studio中有提示。attrs.xml中聲明的屬性在構(gòu)造方法中初始化：
public BackgroundView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
mContext = context;
mPaint = new Paint();
TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.BackgroundView);
if (ta != null) {
mRectLeft = ta.getDimension(R.styleable.BackgroundView_rectLeft, defaultRectLeft);
mRectTop = ta.getDimension(R.styleable.BackgroundView_rectTop, defaultRectTop);
mRectRight = ta.getDimension(R.styleable.BackgroundView_rectRight, defaultRectRight);
mRectBottom = ta.getDimension(R.styleable.BackgroundView_rectBottom, defaultRectBottom);
mRectCornerRadius = ta.getDimension(R.styleable.BackgroundView_rectCornerRadius, defaultRectCornerRadius);
mRectOutColor = ta.getColor(R.styleable.BackgroundView_rectOutColor, defaultRectOutColor);
}
}
接下來開始畫取景框，重寫View的onDraw方法super.onDraw是空實(shí)現(xiàn)可以直接刪掉通熄，如果是繼承自其它已經(jīng)實(shí)現(xiàn)了onDraw方法的View如TextView則不能刪除super.onDraw唆涝，至于你的代碼寫在之前還是之后要根據(jù)實(shí)際需求，寫在父方法之前則自定義的畫面在父控件繪制之前繪制唇辨，父控件的繪制會(huì)覆蓋你自己的繪制廊酣，否則相反。Android的繪制是通過Canvas和Paint實(shí)現(xiàn)的Canvas映射到實(shí)際生活中好比是塊畫布赏枚，Paint好比是作畫的畫筆亡驰，畫筆可以控制顏色、粗細(xì)饿幅、形狀等凡辱，google已經(jīng)為我們提供好了一系列api方便我們快速畫出想要的畫面。
@Override
protected void onDraw(Canvas canvas) {
mPaint.setAntiAlias(true);//抗鋸齒
mPaint.setColor(mRectOutColor);
// 取景框和全屏
RectF rect = new RectF(mRectLeft, mRectTop, screenWidth - mRectRight, screenHeight - mRectBottom);
Path path = new Path();
path.addRoundRect(rect, mRectCornerRadius, mRectCornerRadius, Path.Direction.CW);
Region region = new Region();
region.setPath(path, new Region(0, 0, screenWidth, screenHeight));
Region region1 = new Region();
Path path1 = new Path();
path1.addRect(0, 0, screenWidth, screenHeight, Path.Direction.CW);
region1.setPath(path1, new Region(0, 0, screenWidth, screenHeight));
region.op(region1, Region.Op.XOR);// 范圍取異并集
RegionIterator iterator = new RegionIterator(region);
Rect rec = new Rect();
while (iterator.next(rec)) {
canvas.drawRect(rec, mPaint);
}
}
Paint在構(gòu)造方法中已經(jīng)初始化栗恩，mPaint.setAntiAlias(true);設(shè)置抗鋸齒可以使不規(guī)則線條看起來更加平滑透乾，原理是給線條邊緣像素點(diǎn)一個(gè)顏色過渡由深到淺。由于需要中間取景框全透明磕秤，取景框以外的區(qū)域畫上一層半透明的陰影乳乌，所以我用一個(gè)中間圓角矩形和一個(gè)屏幕大小的區(qū)域取異并集得到的就是取景框以外的區(qū)域范圍然后用Canvas直接根據(jù)Paint設(shè)置的顏色、透明度等參數(shù)直接畫出取景框以外的背景即可市咆。
總結(jié)
本文雖然實(shí)現(xiàn)比較簡單但是要先有自定義View的基礎(chǔ)知識(shí)汉操，在這里再次感謝HenCoder朱凱老師的分享。文章中如有錯(cuò)誤歡迎指出蒙兰。
