CODEWITHSUNDEEP
android
user1974368
user1974368

Reputation: 472

ImageView with rounded corners, border AND shadow behind everything?

I've managed to achieve a rounded ImageView with a shadows behind it but i didn't achieve the border. is there a way for it?

my result. wanted result.

code for imageView:

<FrameLayout
    android:id="@+id/image_view_container"
    android:layout_centerVertical="true"
    android:layout_toRightOf="@+id/coupon_item_index_text_view"
    android:background="@android:drawable/dialog_holo_light_frame"
    android:rotation="-7"
    android:layout_height="70dp"
    android:layout_width="90dp">

    <ImageView
        android:adjustViewBounds="true"
        android:scaleType="centerCrop"
        android:id="@+id/coupon_item_image_view"
        android:background="@drawable/rounded_border_corners"
        android:src="@drawable/pizza"
        android:layout_height="match_parent"
        android:layout_width="match_parent" />

</FrameLayout>

and the code for @drawable/rounded_border_corners:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:shape="rectangle">
    <corners android:radius="8dp" />
    <stroke android:width="1dp"
        android:color="@color/white" />
    <solid android:color="#00000000" />
</shape>

using CardView as @nilesh-rathod suggested with a few adjustments results in this. still seems like the shadow is missing. code: 

<android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    card_view:cardElevation="2dp"
    card_view:cardUseCompatPadding="true"
    card_view:cardCornerRadius="8dp"
    card_view:cardBackgroundColor="@color/white"
    card_view:contentPadding="2dp"
    android:id="@+id/image_view_container"
    android:layout_centerVertical="true"
    android:layout_toRightOf="@+id/coupon_item_index_text_view"
    android:rotation="-7"
    android:layout_height="70dp"
    android:layout_width="86dp">

    <ImageView
        android:adjustViewBounds="true"
        android:scaleType="centerCrop"
        android:id="@+id/coupon_item_image_view"
        android:background="@drawable/rounded_border_corners"
        android:src="@drawable/pizza"
        android:layout_height="match_parent"
        android:layout_width="match_parent" />

</android.support.v7.widget.CardView>

Upvotes: 0

Views: 1789

Answers (1)

AskNilesh
AskNilesh

Reputation: 69689

try this use android.support.v7.widget.CardView insted of FrameLayout

compile cardview dependencies

compile 'com.android.support:cardview-v7:26.0.0'

than use like below code

 <android.support.v7.widget.CardView
    android:id="@+id/image_view_container"
    android:layout_width="90dp"
    android:layout_height="70dp"
    android:layout_centerVertical="true"
    android:rotation="-7">

    <ImageView
        android:adjustViewBounds="true"
        android:scaleType="centerCrop"
        android:id="@+id/coupon_item_image_view"
        android:src="@drawable/bg"
        android:layout_height="match_parent"
        android:layout_width="match_parent" />

</android.support.v7.widget.CardView>

try this also use CircleImageView

dependencies {

compile 'de.hdodenhof:circleimageview:2.1.0'
 }

use this way

<de.hdodenhof.circleimageview.CircleImageView
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/profile_image"
    android:layout_width="96dp"
    android:layout_height="96dp"
    android:src="@drawable/profile"
    app:civ_border_width="2dp"
    app:civ_border_color="#FF000000"/>

Upvotes: 0

Related Questions