Как добавить Shadow Over TextureView вокруг focusArea - PullRequest
0 голосов
/ 07 января 2020

Я создаю сканер qr в Android Studio и использую cameraX Api и для предварительного просмотра с помощью TextureView. В макете я хочу тень на просмотр текстуры, как в большинстве приложений qr scanner.

мой текущий экран мой экран

и я хочу что-то вроде 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>

1 Ответ

0 голосов
/ 07 января 2020

Итак, я пришел к такому выводу: я добавил пользовательский класс макета следующим образом

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>

, поэтому выше я смог получить фоновый сканер, похожий на qr, добавив собственное наложение поверх текстуры.

...