簡體   English   中英

更改背景圖像但保持可繪制到視圖 android xml

[英]Change background image but keep drawable to a view android xml

我有一個 Framelayout,它通過一個可繪制的 xml 文件有一些圓角

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle" >

    <!-- View background color -->
    <solid
            android:color="@color/colorPrimary" >
    </solid>

    <!-- The radius makes the corners rounded -->
    <corners
        android:topLeftRadius="20dp"
        android:bottomRightRadius="20dp" >
    </corners>
</shape>

在 FrameLayout 內,我有 2 個 TextView 和一個 imageView,它以編程方式加載了 bitmap。 問題是我已經盡一切努力為 ImageView 提供與 FrameLayout 相同的圓角,所以我決定用另一個簡單的 View 替換 ImageView(作為 FrameLayout 或 smth)並將 Z86BB33755628454AF74F88 的背景設置為視圖。 這也不起作用。

那么有沒有什么辦法可以設置帶有 xml 中的角的可繪制對象,以及稍后使用 bitmap 以編程方式更改背景以在加載新圖像時以某種方式保持圓角? 謝謝

解決方案

步驟 1. Go 到res/values文件夾,創建一個名為attrs.xml的 xml 文件

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="RoundedImageView">
        <attr name="topLeftCorner" format="dimension" />
        <attr name="topRightCorner" format="dimension" />
        <attr name="bottomRightCorner" format="dimension" />
        <attr name="bottomLeftCorner" format="dimension" />
    </declare-styleable>
</resources>

步驟 2.創建一個從 AppCompatImageView 擴展的 class,命名為RoundedImageView

public class RoundedImageView extends AppCompatImageView {

    private final Path path = new Path();
    private final float[] radii = new float[8];
    private final RectF rect = new RectF();

    public RoundedImageView(@NonNull Context context) {
        this(context, null);
    }

    public RoundedImageView(@NonNull Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        final TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.RoundedImageView);
        try {
            int topLeftCorner = a.getDimensionPixelSize(R.styleable.RoundedImageView_topLeftCorner, 0);
            int topRightCorner = a.getDimensionPixelSize(R.styleable.RoundedImageView_topRightCorner, 0);
            int bottomRightCorner = a.getDimensionPixelSize(R.styleable.RoundedImageView_bottomRightCorner, 0);
            int bottomLeftCorner = a.getDimensionPixelSize(R.styleable.RoundedImageView_bottomLeftCorner, 0);
            radii[0] = topLeftCorner;
            radii[1] = topLeftCorner;
            radii[2] = topRightCorner;
            radii[3] = topRightCorner;
            radii[4] = bottomRightCorner;
            radii[5] = bottomRightCorner;
            radii[6] = bottomLeftCorner;
            radii[7] = bottomLeftCorner;
        } finally {
            a.recycle();
        }
    }

    @Override
    protected void onDraw(Canvas canvas) {
        rect.left = 0;
        rect.top = 0;
        rect.right = getWidth();
        rect.bottom = getHeight();
        path.rewind();
        path.addRoundRect(rect, radii, Path.Direction.CW);
        canvas.clipPath(path);
        super.onDraw(canvas);
    }
}

步驟 3.從布局文件中使用它。

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#F00"
    android:gravity="center">

    <com.example.roundedimageview.RoundedImageView
        android:id="@+id/imageView"
        android:layout_width="240dp"
        android:layout_height="240dp"
        android:layout_gravity="center"
        android:scaleType="centerCrop"
        android:src="@drawable/ic_android"
        app:bottomRightCorner="20dp"
        app:topLeftCorner="20dp" />
</FrameLayout>

結果

在此處輸入圖像描述

益處

  • 您可以設置左上角、右上角、右下角、左下角的圓角半徑。

  • 使用 Glide、畢加索圖書館

限制

您可以使用庫輕松實現它。 但是還有另一種方法可以做。 您可以在 CardView 中使用您的圖像。 當您設置 cardCornerRadius 功能時,覆蓋 cardview 角的圖像角也將被圓角。

或者試試這個

    ImageView yourImageView = findViewById(R.id.yourImageView);

    Bitmap bitmap =((BitmapDrawable) ResourcesCompat.getDrawable(R.drawable.anyPicture)).getBitmap();
    Bitmap roundedImageBitmap = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), bitmap.getConfig());
    Canvas canvas=new Canvas(roundedImageBitmap);
    Paint paint = new Paint();
    paint.setAntiAlias(true);
    paint.setShader(new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP));
    canvas.drawRoundRect((new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight())), 100, 100, paint); // You can adjust the roundness here

    yourimageView.setImageBitmap(roundedImageBitmap);

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM