I'm trying to set a background image in my Android application.
I have a JPEG image and I want to fill the screen with the height of the image, maintaining the same aspect ratio.
I tried by creating an XML bitmap file in drawable and setting it as:
android:background="#drawable/background_image"
This is the XML
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/wallpaper1_1920x1200"
android:tileMode="disabled"
android:gravity="center" >
</bitmap>
With the 'center' tag it doesn't stretch the image and it doesn't resize it.
Is there any way to show the full height of the image (and cropping sides) maintaining the original aspect ratio?
You can wrap your bitmap with Scale Drawable (http://developer.android.com/guide/topics/resources/drawable-resource.html#Scale)
And then use that drawable as a background for your layout.
<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="#drawable/wallpaper1_1920x1200"
android:scaleGravity="clip_horizontal"
android:scaleHeight="100%"
android:scaleWidth="100%" />
One solution might be to turn it into a 9 patch png file, allowing you to define where it can and can't stretch. See http://developer.android.com/guide/topics/graphics/2d-graphics.html, the section near the end on 9 patch images.
Related
I'm trying to create a background drawable made of a gradient that fills the entire view and a pattern with left gravity that resizes to fit vertically while keeping its aspect ratio.
This is what I currently have:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/myGradient"/>
<item>
<bitmap android:src="#drawable/myPattern"
android:gravity="left" />
</item>
</layer-list>
Both drawables are VectorDrawables.
This is meant to be the background of a wrap_content height view.
This does not resize the pattern, but rather centers it vertically. If I set the gravity to fill_vertical, it only resizes in that axis and the aspect ratio breaks.
Is there any way to achieve this in XML without using ImageViews or other layouts? Can it be done programatically? Or do I require a different layout?
I'm trying to center a drawable image with some padding on either side to use as a splash screen logo. The problem is it's either stretched across the entire screen or ignores any padding if I use gravity.
<?xml version="1.0" encoding="utf-8"?>
<item
android:drawable="#color/grey_3"/>
<item android:gravity="top|center_horizontal|center_vertical" android:drawable="#drawable/zc_logo_r"
android:top="100dp"
android:left="200dp"
android:right="200dp"
android:layout_margin="100dp"
>
</item>
I've tried using a bitmap, android:gravity="fill_horizontal" and various other suggestions on SO with the same result.
How can I scale and center the image in my xml?
As a reference, if you come across the same issue, I solved it with a square image in drawable folders (i.e. hdpi, mdpi, xhpi, xxhpi and xxxhdpi) instead of resizing a rectangular image which was too big in size and gets distorted.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/grey_3"/>
<item android:gravity="center">
<bitmap android:src="#drawable/splash_logo"/>
</item>
</layer-list>
It's probably easiest to turn your drawable image into a nine-patch.
The problem you're running into is that a layer-list doesn't have an intrinsic idea of it's size. The bounds are set when it is placed inside of a container. The xml attributes are set at compile-time so it's difficult to get dynamic values inside of the xml drawable.
If you can use an ImageView, then you can set your drawable in the src attribute and use padding, margins and scaleType to control the position an scaling of the drawable.
I have an android activity that has an image overlaying a background image.
The 2 images must line up(height only), so the height of the background image must not be scaled.
However, on wide displays, i need to stretch the width of this background to fit the screen.
Currently I have set the Activity background like this.
<?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"
android:id="#+id/layRoot"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/meditation_bg">
meditation_bg is a drawable resource. the code is
<?xml version="1.0" encoding="utf-8"?>
<bitmap
xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/morn_blur_bg"
android:gravity="top|center"
android:scaleType="centerCrop"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
The bitmap drawable resource is required to prevent the OS from scaling the image for me.
How can I control the width, without affecting the height of the image.
cheers,
I'd highly recommend taking a look into Picasso, They provide image caching, adjusting much much more easier.
I am displaying a tiny png drawable resource in an ImageView of larger dimensions than the original image. This is normal and what I want by the way :)
When the ImageView is displayed, the image is blurry, because of the scaling method used I suppose.
I would like to achieve an effect similar to :
http://www.41post.com/4241/programming/android-disabling-anti-aliasing-for-pixel-art
where the original image is upscaled without antialiasing.
Is there a way to achieve that directly with an ImageView of certain width and height (in dips) and a drawable, without having to use an intermediate Bitmap?
<?xml version="1.0" encoding="utf-8"?>
<bitmap
xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/image"
android:antialias="false" />
You need to create an drawable, copy the code above on an xml in the drawable folder, then on your layout instead of using your image as source use this xml. This way you disable the antialias for the image.
Edit: doing this in code.
BitmapDrawable draw = new BitmapDrawable(R.drawable.image);
draw.setAntiAlias(false);
imageView.setImageDrawable(draw);
Did you try turning off antialiasing in the layout?
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:antialias="false" />
I have the following code in a drawable bitmap xml file. And the background of a linearLayout set to it.
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/background_screen"
android:tileMode="repeat"
android:scaleHeight="10"
android:scaleWidth="10"
/>
The image tiles OK, but it doesn't scale. What do I have to do/fix to get it to scale?
Thanks
In my experience it is better to create different sized bitmaps for each density you are targeting. That way you don't have to worry about these scale attributes and get crisp results on any device.
These scale attributes are not defined for BitmapDrawables. They exist for ScaleDrawables which are meant to scale another drawable. Have a look at:
http://developer.android.com/guide/topics/resources/drawable-resource.html#Scale