Search code examples
androidimagebitmapimageviewscale

Preventing scale on bitmap created in execution time for ImageView - Android


I have a ImageView acting as a top banner on top of a webview. The image of this banner is created in execution time dependending on the resolution of the device. The height of the banner is always the same for each resolution. The only thing that changes is the width, which changes according to the orientation. But, since the width changes and the height doesn't, I end up having sort of 2 images with different proportion. And this is way the scale down/up won't work out for me.

Another problem is that everytime the user rotates the screen, the banner image is created again but Android seems not to update the image and thus I have a banner missing part of it.

I thought about having a real big image that will fit for both landscape and portrait orientation. But this seems not to be a good idea since Android keeps resizing the image everytime so it will fit on the space of the ImageView.

I'm running out of ideas here. Can someone suggest something?

Thanks, Rafael Ramos


Solution

  • What type of image are you using for this header? Using a fixed pixel size image is a bad idea, just because of how many resolutions you'll have to deal with. You should look into using a 9-patch image, if it's possible for the type of background you're trying to use. Then just set the layout_width to fill_parent, and it will automatically resize it as necessary.

    http://developer.android.com/guide/topics/graphics/2d-graphics.html#nine-patch

    EDIT: Hard to tell exactly what you've got, but I would suggest something like the below instead of an ImageView:

    <RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="{whatever height you have set}"
        android:id="@+id/header_relative_layout"
        android:background="@drawable/gradient"
        >
        <ImageView
            android:id="@+id/header_imageview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:layout_alignParentLeft="true"
            android:src="@drawable/header_image"
            />
        <TextView
            android:id="@+id/header_textview"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="@string/header_text"
            android:layout_toRightOf="@id/header_imageview"
            android:layout_marginLeft="10dp"
            />
    </RelativeLayout>
    

    gradient.xml (place in drawables folder)

    <shape 
        xmlns:android="http://schemas.android.com/apk/res/android" 
        android:shape="rectangle"
        >
        <gradient 
            android:startColor="#FFFF0000" 
            android:endColor="#80FF00FF"
            android:angle="270"
            />
    </shape>
    

    I haven't actually compiled this, but it should be fairly close. This way, you don't have to generate an image each time, and the width will fill automatically to take the full width of the screen.

    Does this help?