我正在Android Studio中构建一个qr扫描仪,并使用cameraX Api,并使用TextureView进行预览。在布局中,我希望像大多数qr扫描仪应用程序一样,在textureview上形成阴影。
我当前的屏幕是 我的屏幕
我想要像phonepe qr这样的东西
所以我如何在焦点区域周围添加覆盖。是否有可能在布局中使用或我必须使用CustomView?
我当前的布局是
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<data>
</data>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorGrey">
<TextureView
android:id="@+id/texture_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:visibility="visible"
app:layout_constraintTop_toTopOf="@+id/included"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
/>
<include
android:id="@+id/included"
layout="@layout/custom_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"/>
<View
android:id="@+id/texture_view_border"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/scanner_border"
app:layout_constraintBottom_toTopOf="@id/guideline_horizontal_mid"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toStartOf="@id/guideline_vertcal_right"
app:layout_constraintStart_toEndOf="@id/guideline_vertcal_left"
app:layout_constraintTop_toBottomOf="@id/guideline_horizontal_up" />
<TextView
android:id="@+id/qr_code_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="Scan QR code"
android:textAppearance="@style/TextAppearance.AppCompat.Medium"
android:textColor="@color/colorWhite"
app:layout_constraintStart_toStartOf="@id/guideline_vertcal_left"
app:layout_constraintEnd_toEndOf="@id/guideline_vertcal_right"
app:layout_constraintTop_toBottomOf="@id/texture_view_border"
/>
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_vertcal_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.1" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_vertcal_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.90" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_horizontal_up"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.20" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_horizontal_mid"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.80" />
<View
android:id="@+id/scanner_bar"
android:layout_width="0dp"
android:layout_height="2dp"
android:background="@color/colorLoginPrimary"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="@id/texture_view_border"
app:layout_constraintEnd_toEndOf="@id/texture_view_border"
app:layout_constraintStart_toStartOf="@id/texture_view_border"
app:layout_constraintTop_toTopOf="@id/texture_view_border" />
<View
android:layout_width="30dp"
android:layout_height="5dp"
android:background="@color/colorLoginPrimary"
app:layout_constraintStart_toStartOf="@id/texture_view_border"
app:layout_constraintTop_toTopOf="@id/texture_view_border" />
<View
android:layout_width="5dp"
android:layout_height="30dp"
android:background="@color/colorLoginPrimary"
app:layout_constraintStart_toStartOf="@id/texture_view_border"
app:layout_constraintTop_toTopOf="@+id/texture_view_border" />
<View
android:layout_width="30dp"
android:layout_height="5dp"
android:background="@color/colorLoginPrimary"
app:layout_constraintEnd_toEndOf="@id/texture_view_border"
app:layout_constraintTop_toTopOf="@id/texture_view_border" />
<View
android:layout_width="5dp"
android:layout_height="30dp"
android:background="@color/colorLoginPrimary"
app:layout_constraintEnd_toEndOf="@+id/texture_view_border"
app:layout_constraintTop_toTopOf="@id/texture_view_border" />
<View
android:id="@+id/view"
android:layout_width="30dp"
android:layout_height="5dp"
android:background="@color/colorLoginPrimaryDark"
app:layout_constraintBottom_toBottomOf="@id/texture_view_border"
app:layout_constraintStart_toStartOf="@id/texture_view_border" />
<View
android:layout_width="30dp"
android:layout_height="5dp"
android:background="@color/colorLoginPrimary"
app:layout_constraintBottom_toBottomOf="@id/texture_view_border"
app:layout_constraintEnd_toEndOf="@+id/texture_view_border" />
<View
android:layout_width="5dp"
android:layout_height="30dp"
android:background="@color/colorLoginPrimary"
app:layout_constraintBottom_toBottomOf="@+id/texture_view_border"
app:layout_constraintStart_toStartOf="@id/texture_view_border" />
<View
android:layout_width="5dp"
android:layout_height="30dp"
android:background="@color/colorLoginPrimary"
app:layout_constraintBottom_toBottomOf="@+id/texture_view_border"
app:layout_constraintEnd_toEndOf="@id/texture_view_border" />
</androidx.constraintlayout.widget.ConstraintLayout>
所以我想出了这一点:我添加了一个自定义布局类,如下所示
public class CircleOverlayView extends LinearLayout{
private Bitmap bitmap;
public CircleOverlayView(Context context) {
super(context);
}
public CircleOverlayView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CircleOverlayView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
@TargetApi(Build.VERSION_CODES.LOLLIPOP)
public CircleOverlayView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
}
@Override
protected void dispatchDraw(Canvas canvas) {
super.dispatchDraw(canvas);
if (bitmap == null) {
createWindowFrame();
}
canvas.drawBitmap(bitmap, 0, 0, null);
}
protected void createWindowFrame() {
bitmap = Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888);
Canvas osCanvas = new Canvas(bitmap);
RectF outerRectangle = new RectF(0, 0, getWidth(), getHeight());
RectF innerRectangle = new RectF(getWidth() * .10f, getHeight() * .20f, getWidth() * .90f, getHeight() * .70f);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setColor(getResources().getColor(R.color.colorBlack));
paint.setAlpha(150);
osCanvas.drawRect(outerRectangle, paint);
paint.setColor(Color.TRANSPARENT);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OUT));
//osCanvas.drawRect(innerRectangle,paint);
osCanvas.drawRoundRect(innerRectangle, 45, 45, paint);
/* paint.setColor(Color.TRANSPARENT);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OUT));
float centerX = getWidth() / 2;
float centerY = getHeight() / 2;
float radius = getResources().getDimensionPixelSize(R.dimen.fab_margin);
osCanvas.drawCircle(centerX, centerY, radius, paint);*/
}
@Override
public boolean isInEditMode() {
return true;
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
super.onLayout(changed, l, t, r, b);
bitmap = null;
}}
然后在我的布局中将其添加到textureView上
<data>
</data>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="@+id/included"
layout="@layout/custom_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextureView
android:id="@+id/texture_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/included" />
<com.example.studentapp.utils.CircleOverlayView
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@id/texture_view" />
<View
android:id="@+id/texture_view_border"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/scanner_border"
app:layout_constraintBottom_toTopOf="@id/guideline_horizontal_mid"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toStartOf="@id/guideline_vertcal_right"
app:layout_constraintStart_toEndOf="@id/guideline_vertcal_left"
app:layout_constraintTop_toBottomOf="@id/guideline_horizontal_up" />
<TextView
android:id="@+id/qr_code_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="Scan QR code"
android:textAppearance="@style/TextAppearance.AppCompat.Medium"
android:textColor="@color/colorWhite"
app:layout_constraintBottom_toTopOf="@id/guideline_horizontal_mid"
app:layout_constraintEnd_toEndOf="@id/guideline_vertcal_right"
app:layout_constraintStart_toStartOf="@id/guideline_vertcal_left" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_vertcal_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.1" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_vertcal_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.90" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_horizontal_up"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.20" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_horizontal_mid"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.80" />
<View
android:id="@+id/scanner_bar"
android:layout_width="0dp"
android:layout_height="2dp"
android:background="@color/colorLoginPrimary"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="@id/texture_view_border"
app:layout_constraintEnd_toEndOf="@id/texture_view_border"
app:layout_constraintStart_toStartOf="@id/texture_view_border"
app:layout_constraintTop_toTopOf="@id/texture_view_border" />
</androidx.constraintlayout.widget.ConstraintLayout>
因此,通过在Textureview上添加自定义叠加层,我能够获得像qr扫描仪一样的音素。
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。