Memory heavy oval gradient

问题

As you may know it is not possible to draw an oval radial gradient using regular Android API.

This is what I want to achieve:

So I implemented this solution: draw a regular radial gradient on a square bitmap and then this bitmap will get stretched by the view itself (idea found here: https://stackoverflow.com/a/3543899/649910)

This works great however this solution takes a lot of memory, because of BitmapDrawable usage (see implementation details below).

Any ideas on how to avoid usage of such a big bitmap are welcome!

This my code:

public class OvalGradientView extends ImageView {

    private Drawable defaultBackgroundDrawable;

    public OvalGradientView(Context context) {
        super(context);
        init();
    }

    public OvalGradientView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public OvalGradientView(Context context, AttributeSet attrs, int defStyleAttr, Paint paint) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {
        setScaleType(ScaleType.FIT_XY);
        defaultBackgroundDrawable = getResources().getDrawable(R.drawable.default_background);
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
        int width = getWidth();
        int height = getHeight();
        Rect currentBounds = defaultBackgroundDrawable.getBounds();
        // check if we already have bitmap for these bounds
        if (currentBounds.right == width && currentBounds.bottom == height) {
            return;
        }
        // draw the drawable on square bitmap, it will be then stretched if needed to rectangular shape
        // as the view gets more rectangular
        defaultBackgroundDrawable.setBounds(0, 0, width, width);
        Bitmap defaultBackgroundBitmap = Bitmap.createBitmap(width, width, Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(defaultBackgroundBitmap);
        defaultBackgroundDrawable.draw(canvas);
        setImageBitmap(defaultBackgroundBitmap);
    }
}

And this is the drawable XML - default_background

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:startColor="#ffffff"
        android:endColor="#ff6600"
        android:gradientRadius="50%p"
        android:type="radial" />
</shape

回答1:

I wouldn't trust my own ability to create bitmaps like that, especially if they are full screen. Why not apply the xml shape as a background to the container view in xml as well? It will stretch to the proportions of the view if the width and height are match_parent

public class OvalGradientView extends ImageView {
    public OvalGradientView(Context context, AttributeSet attrs) {
        super(context, attrs);

        LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        inflater.inflate(R.layout.my_sexy_gradient, this, true);
    }
}

my_sexy_gradient.xml

    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:background="@drawable/default_background"/>

回答2:

I ended up with this implementation:

public class MyBackgroundView extends ImageView {

    public MyBackgroundView(Context context) {
        super(context);
    }

    public MyBackgroundView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public MyBackgroundView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    {
        setBackgroundResource(R.drawable.my_background);
        setScaleType(ScaleType.FIT_XY);
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);

        if (!changed) {
            return;
        }

        int width = right - left;
        int height = bottom - top;
        float aspectRatio = (float) width / height;
        if (aspectRatio > 1f) {
            setScaleX(aspectRatio);
        } else {
            setScaleY(1 / aspectRatio);
        }
    }
}

where my_background is:

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:startColor="@color/my_background_start_color"
        android:endColor="@color/my_background_end_color"
        android:gradientRadius="@fraction/my_background_gradient_radius_percent"
        android:type="radial" />
</shape>

Width and height of this view are both match_parent.

来源：https://stackoverflow.com/questions/40811308/memory-heavy-oval-gradient