android 如何设置一个像Instagram的圆形图像视图周围的边界?

zfciruhq  于 2023-02-13  发布在  Android
关注(0)|答案(2)|浏览(185)

我想设置一个圆形边框周围的圆形图像视图像instagram的故事,任何人可以帮助?这里是我的图像视图

<de.hdodenhof.circleimageview.CircleImageView
    android:id="@+id/profile_image"
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:layout_marginStart="10dp"
    android:layout_marginTop="8dp"
    android:src="@drawable/profile1"
    app:civ_border_color="#DBDBDB"
    app:civ_border_width="1dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />
s4n0splo

s4n0splo1#

也可以使用材质零部件库提供的**ShapeableImageView**。
比如:

<com.google.android.material.imageview.ShapeableImageView
    app:shapeAppearanceOverlay="@style/circularImageView"
    app:srcCompat="@drawable/...."
    app:strokeColor="@color/....."
    app:strokeWidth="1dp"
    ...
    />

与:

<style name="circularImageView">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">50%</item>
  </style>

注意:至少需要版本1.2.0-alpha03

lvmkulzt

lvmkulzt2#

圈出图片视图,如Instagram故事

我发现了一个新的方法,你也应该试试这个。我已经取得了很大的成功与这个方法。从这个你可以得到一个Instagram风格的圆形图像视图。

<RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">

            <de.hdodenhof.circleimageview.CircleImageView
                android:layout_width="80dp"
                android:layout_height="80dp"
                android:scaleType="centerCrop"
                android:layout_centerInParent="true"
                android:background="@drawable/instagram_boder_color.xml"/>

            <de.hdodenhof.circleimageview.CircleImageView
                android:id="@+id/profile_image"
                android:layout_width="75dp"
                android:layout_height="75dp"
                android:scaleType="centerCrop"
                android:layout_centerInParent="true"
                app:civ_border_color="@color/white"
                app:civ_border_width="3dp"
                android:background="@drawable/white_boder_color.xml"/>

        </RelativeLayout>

with:创建两个像这样的可绘制对象...
创建可绘制文件1 = instagram_boder_color. xml”,形状为android:形状=“椭圆形”

<gradient
    android:startColor="#DD129D"
    android:endColor="#FBC02D"
    />

创建可绘制的2 = white_boder_color. xml”,形状为android:形状=“椭圆形”

<solid android:color="#FFFFFF"></solid>

out put: boder color

相关问题