【问题标题】:How to make image view with rounded edge at bottom with shadow如何在底部带阴影的圆形边缘制作图像视图
【发布时间】:2020-10-23 20:32:02
【问题描述】:

我想让我的 ImageView 在底部弯曲并带有阴影效果。

类似于这张图片

但我不知道该怎么做。

每当我在 Google 或 StackOverflow 上搜索时,它都会向我显示与弯角相关的结果,但我希望底部有弯曲的边缘。

【问题讨论】:

    标签: android imageview shapes cardview


    【解决方案1】:

    你可以使用layer-list

    例如,

    <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
        <item
            android:left="-150dp"
            android:right="-150dp"
            android:top="-200dp">
            <shape xmlns:android="http://schemas.android.com/apk/res/android"
                android:shape="oval">
                <solid android:color="#C72C2F" />
            </shape>
        </item>
    </layer-list>
    

    它是这样显示的。

    然后在后台使用这个,

    <?xml version="1.0" encoding="utf-8"?>
    <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">
    
        <LinearLayout
            app:layout_constraintTop_toTopOf="parent"
            android:background="@drawable/round"
            android:elevation="30dp"
            android:layout_width="match_parent"
            android:layout_height="700dp"/>
    
    </androidx.constraintlayout.widget.ConstraintLayout>
    

    它是这样的。

    还有做阴影效果,我用android:elevation做阴影,如果你增加值,它可以做更多的深度。

    显然为显示图像添加了图像视图。我相信你可以做到。

    【讨论】:

    • 这是完美的,但是如何在这个形状内添加图像而不是仅仅红色图像是动态添加到视图中的,而不是来自资源。这就是我尝试过的photos.app.goo.gl/QHbosfA1G5iKWg5q6
    • 你用过图片库吗?例如Glide?
    • 那么你必须制作像透明孔一样的图像。这意味着红色部分应该是透明的,并且使部分是白色的。并在此设置图像。喜欢stackoverflow.com/a/11227247/10778405
    • 我觉得设计师可以做到
    猜你喜欢
    • 2021-05-01
    • 1970-01-01
    • 2020-12-29
    • 1970-01-01
    • 2013-02-20
    • 2015-10-17
    • 1970-01-01
    • 2016-08-31
    • 1970-01-01
    相关资源
    最近更新 更多