时间戳

首页 > 解决方案 > 如何在 VideoView 周围绘制带有边框阴影形状的矩形？

android - 如何在 VideoView 周围绘制带有边框阴影形状的矩形？

问题描述

我有 VideoView，我想在 VideoView 周围绘制这个形状。

我想要： 我想要

我用我的 xml 代码制作：

垂直视频：

在此处输入图像描述

横向视频：

在此处输入图像描述

我的矩形边框与确切的 VideoView 尺寸不对应。当视频水平时，在顶部和底部点的背景中有溢出。垂直时，左右有溢出。它们的颜色也不匹配。

我不希望我的更改对视频分辨率产生负面影响。

我的矩形边框xml：

                <solid
                    android:color="@color/grey_300" />
            </shape>
        </item>

        <item
            android:bottom="2dp"
            android:left="2dp"
            android:right="2dp"
            android:top="2dp">

            <shape>

                <gradient
                    android:angle="270"
                    android:endColor="#ffffff"
                    android:startColor="#ffffff" />

                <stroke
                    android:width="1dp"
                    android:color="@color/grey_300" />

                <corners
                    android:radius="10dp" />

                <padding
                    android:bottom="10dp"
                    android:left="10dp"
                    android:right="10dp"
                    android:top="10dp" />

            </shape>
        </item>
    </layer-list>
</item>

和布局xml：

<RelativeLayout
        android:id="@+id/view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:background="@drawable/rect_border"
        android:elevation="5dp"
        android:outlineProvider="bounds">

        <VideoView
            android:id="@+id/video_loader"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_centerInParent="true"
            android:layout_gravity="center"
            android:background="@drawable/bg_rounded"
            android:gravity="center" />

        <ImageView
            android:id="@+id/icon_video_play"
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:layout_centerInParent="true"
            app:srcCompat="@drawable/ic_baseline_play_circle_filled_24" />
    </RelativeLayout>

标签： androidandroid-videoview

解决方案

尝试下面的代码片段以显示带有角边框的视频视图

矩形边框xml：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#00ffffff" />

        </shape>
    </item>

    <item
        android:bottom="1px"
        android:left="1px"
        android:right="1px"
        android:top="1px">
        <shape android:shape="rectangle">
            <stroke
                android:width="1dp"
                android:color="#6db23f" />
            <solid android:color="#ffffff" />
            <corners
                android:bottomLeftRadius="5dp"
                android:bottomRightRadius="5dp"
                android:topLeftRadius="5dp"
                android:topRightRadius="5dp"></corners>
        </shape>
    </item>

</layer-list>

布局xml：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:cardView="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:gravity="center_horizontal"
    android:background="@drawable/rect_border"
    android:orientation="vertical" >

    <androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        cardView:cardBackgroundColor="#ffffff"
        cardView:cardElevation="2dp"
        cardView:cardUseCompatPadding="true">

        <VideoView
            android:id="@+id/contentImageView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:adjustViewBounds="true"
            android:background="@drawable/bg_rounded" />

    </androidx.cardview.widget.CardView>

</LinearLayout>

推荐阅读