How can I achieve the corner edges on the image on the bottom right and left of the image? Not the rounded corners this i already achieve but the diagonal cut at the bottom left and right of the image I am only talking about the above image not the white one. I tried some libraries but didn't work. The part that i want to achieve is in black.I load the image using glide. Thanks.
Here is the image.
Here is my XML:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="wrap_content"
android:gravity="center">
<ImageView
android:id="@+id/promos_vouchers_background"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:contentDescription="@null"
android:scaleType="fitXY"
android:src="@drawable/voucher_background" />
<android.support.percent.PercentRelativeLayout
android:id="@+id/promos_vouchers_wrapper"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="@+id/promos_vouchers_header_panel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_heightPercent="28.18%"
app:layout_marginLeftPercent="7.13%"
app:layout_marginRightPercent="7.13%"
app:layout_marginTopPercent="2.14%">
<android.support.percent.PercentRelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/promos_vouchers_header"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
app:layout_widthPercent="100%"
app:layout_aspectRatio="178%"
android:contentDescription="@null" />
<ImageView
android:id="@+id/promos_vouchers_logo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
app:layout_widthPercent="100%"
app:layout_aspectRatio="178%"
android:adjustViewBounds="true"
android:contentDescription="@null"/>
</android.support.percent.PercentRelativeLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_marginEnd="10dp"
android:layout_marginRight="10dp"
android:gravity="center_vertical"
android:orientation="vertical">
<android.support.v7.widget.AppCompatTextView
android:id="@+id/promos_vouchers_price_label"
android:layout_width="65dp"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:layout_marginRight="30dp"
android:layout_marginEnd="30dp"
android:textColor="@color/promos_vouchers_price_label_text_color"
android:textSize="@dimen/promos_vouchers_price_label_text_size"
tools:text="até" />
<android.support.v7.widget.AppCompatTextView
android:id="@+id/promos_vouchers_price_value"
android:layout_width="65dp"
android:layout_height="50dp"
android:layout_marginTop="-40dp"
android:includeFontPadding="false"
android:textColor="@color/promos_vouchers_price_value_text_color"
android:textSize="@dimen/promos_vouchers_price_value_text_size"
tools:text="€4" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:id="@+id/promos_vouchers_description_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/promos_vouchers_header_panel"
android:orientation="vertical"
android:padding="12dp"
app:layout_heightPercent="40.36%"
app:layout_marginLeftPercent="7.13%"
app:layout_marginRightPercent="7.13%">
<android.support.v7.widget.AppCompatTextView
android:id="@+id/promos_vouchers_description_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:maxLines="7"
android:scrollbars="vertical"
android:textColor="@color/promos_vouchers_description_main_text_color"
android:textSize="@dimen/promos_voucher_description_text_size"
android:layout_marginStart="13dp"
android:layout_marginEnd="13dp"
android:layout_marginLeft="13dp"
android:layout_marginRight="13dp"
android:layout_above="@+id/promos_vouchers_description_final_date"
tools:text="Desconto de 2 cêntimos por lite em combústível evologic, é válido para qualquer posto com um limite mínimo de 1l e máximo de 50l." />
<android.support.v7.widget.AppCompatTextView
android:id="@+id/promos_vouchers_description_final_date"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="@+id/promos_vouchers_invisible_placeholder"
android:ellipsize="end"
android:maxLines="2"
android:textColor="@color/promos_vouchers_description_alt_text_color"
android:textSize="@dimen/promos_voucher_options_text_size"
tools:text="Data de Fim: 09-10-2015" />
<ImageView
android:id="@+id/promos_vouchers_invisible_placeholder"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:contentDescription="@null"
android:src="@drawable/voucher_invisible_placeholder" />
<ImageView
android:id="@+id/info"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignTop="@+id/promos_vouchers_description_final_date"
android:layout_marginTop="5dp"
android:clickable="true"
android:contentDescription="@null"
android:scaleType="fitStart"
android:src="@drawable/icon_info" />
</RelativeLayout>
<android.support.v7.widget.AppCompatButton
android:id="@+id/promos_vouchers_button"
android:layout_width="175dp"
android:layout_height="26dp"
android:paddingStart="24dp"
android:paddingLeft="24dp"
android:paddingRight="24dp"
android:paddingEnd="24dp"
android:text="@string/promo_vouchers_use_cupon"
app:layout_heightPercent="7.13%"
app:layout_marginBottomPercent="12.19%"
app:layout_marginLeftPercent="7.13%"
app:layout_marginRightPercent="7.13%"
style="@style/ActiveButton"
android:textAllCaps="false"
android:layout_below="@+id/promos_vouchers_description_container"
android:layout_centerHorizontal="true" />
<!--<ImageView
android:id="@+id/promos_vouchers_bar_code"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/promos_vouchers_description_container"
android:contentDescription="@null"
android:padding="10dp"
android:scaleType="centerInside"
app:layout_heightPercent="17.13%"
app:layout_marginBottomPercent="12.19%"
app:layout_marginLeftPercent="7.13%"
app:layout_marginRightPercent="7.13%" />
<TextView
android:id="@+id/promos_vouchers_bar_code_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/promos_vouchers_bar_code"
android:layout_centerHorizontal="true"
android:background="@color/promos_voucher_bar_code_text_background_color"
android:gravity="center"
android:letterSpacing="0.2"
android:paddingEnd="@dimen/promos_voucher_bar_code_text_padding"
android:paddingLeft="@dimen/promos_voucher_bar_code_text_padding"
android:paddingRight="@dimen/promos_voucher_bar_code_text_padding"
android:paddingStart="@dimen/promos_voucher_bar_code_text_padding"
android:textSize="@dimen/promos_voucher_bar_code_text_size"
app:layout_marginBottomPercent="0%"
tools:text="0006005316002094" />
<include
android:id="@+id/promos_vouchers_bar_code_loading"
layout="@layout/common_loading_progressbar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/promos_vouchers_description_container"
android:layout_centerHorizontal="true" />!-->
</android.support.percent.PercentRelativeLayout>
</RelativeLayout>
And the image is dynamically so i am using glide to load it.
Glide.with(context)
.load(banner.getBannerCover() != null ? banner.getBannerCover().getImage() : null)
.bitmapTransform(new RoundedCornersTransformation(context, context.getResources().getDimensionPixelSize(R.dimen.voucher_rounder_corner_radius), 0, RoundedCornersTransformation.CornerType.TOP))
.animate(R.anim.fade_in)
.into((ImageView) view.findViewById(R.id.promos_vouchers_header))
