对角线切割ImageView

时间:2017-10-20 08:24:35

标签: android imageview diagonal

如何在图像左下角和左下角的图像上实现边角?这不是我已经实现的圆角,而是图像左下方的对角线切割我只谈到上面的图像而不是白色的图像。我试过一些图书馆,但没有用。我想要实现的部分是黑色的。我使用滑动加载图像。感谢。

这是图像。

enter image description here

这是我的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>

图像是动态的,所以我使用滑动加载它。

 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))

2 个答案:

答案 0 :(得分:0)

通过使用角边选择器实现那些角边缘。查看角落边缘的此链接:link

答案 1 :(得分:0)

这里你去..按照以下步骤

  1. 在您的drawable文件夹中,在您的文件中创建一个xml名为shape.xml的代码。

        

        <padding android:left="5dp"
            android:top="5dp"
            android:right="5dp"
            android:bottom="5dp"
            />
    
        <corners 
               android:bottomRightRadius="17dp" 
               android:bottomLeftRadius="17dp"
               android:topLeftRadius="17dp" 
               android:topRightRadius="17dp"
            />
    

    <shape>标记下添加此代码。

  2. 将以下行添加到Imageview作为xml属性。

    android:background="@drawable/shape"
    
  3. 输出看起来像..

    enter image description here