9-patch stretching when it shouldn't stretch, Android - android

I am trying to set a 9-patch image as the background for one of my activities but it is stretching unescessarily making everything get all wierd. I used draw9patch to create it and added one pixel to the bottom left and one pixel to the top right. I then save it into my drawables directory as intro_bg.9.png. I want to stretch the very bottom and stretch the far right side but only if it has too. If it doesn't then I would like it to stay in tact.
When I set it as the background of the parent layout however it stretches it both horizontally and vertically and it doesn't even show my buttons when I run it on my droid.
I've done the Google searches but there is no good info on how to get something like this working. What am I missing?
I have also tried some other configurations including using the padding sides(right and bottom) but that gave the same results.
Thanks
Code to set as background:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/intro_bg"
>
Looks like:
Should look like:

Your image is just too big to fit the layout. If you want it to be contracted you need to paint a line on the top and left borders -- the line marks region which will be contracted or stretched. I guess right now you have just dots on the borders.
Second option is to set the image as activity background, then it will be fitted in the screen. To do this add styles.xml to res/values folder:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="ExampleTheme" parent="android:Theme">
<item name="android:windowBackground">#drawable/intro_bg</item>
</style>
</resources>
Then apply the theme to your activity at the manifest. The intro_bg drawable even doesn't need to be a 9-patch.

Related

How can I add margin to background bitmap on Android

So I would like to create a checkered effect with my bitmap. So I am using this very small pixel grey color png. I need to add a margin or padding before it's repeated but I'm unsure how to do this. Any help will be welcome as I have just started learning Android development.
What it's doing right now is repeating the entire image, filling the window with one color.
Background.xml
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/bg"
android:tilemode="repeat">
</bitmap>
In my Activity Main XML I'm including the above XML
android:background="#drawable/background"
If I understand You correct and You want to make an effect like this
Using a single grey pixel and adding margin to next before repeating, it will be much easier if You don't use:
But just a:
With a pattern like this, You can repeat an image and You will get a checkered effect.

Delphi XE7 Android splash screen - background color

I can see Delphi XE7 comes with splash/startup image support for Android.
However, when I choose to center the image (which looks best) Delphi shows black color around it. I would prefer white since it fits better with the image and color theme of the app. There does no appear to be an opion for background color where you set splash/startup images.
How can I change this color?
If you want fill the black background with the same background color from your image you must use 9patch images. To make 9patch pngs use NinePatch (included in android sdk)
Once you hace the images, add to your project and set up like this:
splash tile mode: disabled
splash gravity: center
Then go to project -> deployment:
Uncheck splash_image_def.xml (to not deploy)
rename your splash_image.png to splash_image_def.9.png
If you are just wanting to change the background color of the splash screen, you can modify two files. colors.xml and splash_image_def.xml. You will find these in the Android/Debug/ (or Android64/Debug/) folder of your project. These get recreated each time you deploy your application so you will need to make backup copies of them.
In Project|Deployment, untick these items and create new entries for the copies you have made, making sure that you deploy them to the same location. You will end up with two entries for Debug and Release.
Edit colors.xml and add the new color that you want like so
<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<color name="notification_accent_color">#000000</color>
<color name="logoblue">#0094ff</color>
</resources>
Here I've added the logoblue color. Next edit splash_image_def.xml and change #android:color/black to #color/logoblue. It should look somewhat like the following
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" android:opacity="opaque">
<item android:drawable="#color/logoblue" />
<item>
<bitmap
android:src="#drawable/splash_image"
android:antialias="true"
android:dither="true"
android:filter="true"
android:gravity="center"
android:tileMode="disabled"/>
</item>
</layer-list>
There might be a simpler way of doing this, but this is what I've come up with through a bit of trial and error.
There is no background color property of splash images because this is supposed to be a part of the image. There are 4 different possible sizes for Splash Images on Android:
426 x 320
470 x 320
640 x 480
960 x 720
So, depending on your supported devices, you should have up to 4 images matching these sizes, with the background color being whatever you wish. Set it up to fill the entire screen, and make sure you're not using transparency. For Splash Gravity, select the fill option.
to change default black splashscreen, just open
splash_image_def.xml at debug folder,
and change "black" to white if you want change it to white, like this
<item android:drawable="#android:color/white" />
Note : Build it with no change at source code, layout or anything at RAD Studios. Just edit the file xml with notepad, save it, then rebuild.

Background image quality

I want to apply a background image to a linear layout and I have problems because the image loose from quality when stretched.
The image is composed by the fill color and some dots pattern applied over the background.
The image was made with Adobe Illustrator (png). Also I tried using nine-patch but does not work, the dots are stretched.
Should I make this background from code(override onDraw from the linear layout)?
I'm guessing you want to repeat that pattern, not stretch it. Create a drawable resource in xml form, representing your tiled background:
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:tileMode="repeat"
android:src="#drawable/background_image"
/>

ActionBar bottom align tab icons

i want to bottom align the tab icons but I have no clue how to achieve it :( I have already tried setCustomView without success. Although my custom layout has width and height set to match_parent it doesn't fill the whole tab and therefore i cannot bottom align my content.
Here are two images to illustrate what
i want to achieve
and what i actually get
Here is the custom tab view layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#f00">
<ImageView
android:id="#+id/icon"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitCenter"/>
</LinearLayout>
I have added the red background for debugging. And it really is only shown around the icon, and not the entire tab.
The 9-patch image of the tab background is:
So the fill area should be the whole image...
If I'm not wrong, you are using some 9patch image (probably generated using the ABS theme generator). The 9 patch image will determine where the region will be drawn and by default added some padding to it.
To know more about the 9 patch and how to deal with the "drawable region", please take a look of this website
Edit
Just in case you are too lazy to read the article in the link, a 9patch image will not only make a scalable background image, it will also able to determine the "Fill Area" of the content of its children. If the Fill Area is designed to be smaller than the whole image itself, padding will be added to fill the rest and hence producing what you see on the tab now.

Repeated Background creates whitespace - android

My problem is a whitespace that creates itself when I put an image in the background.
I made a new icon set. Put an image there and cropped it so it has no white border. And when I create a new image view it works it has no border around itself. But when I put it as a background on repeat it creates a whitespace.
It looks like this:
I cant post an image so look here: http://i.stack.imgur.com/AwNiz.gif
I am using a relative layout and I have created a file drawable and put an xml file in it in which I have this code:
<?xml version="1.0" encoding="utf-8"?>
<bitmap
xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/im"
android:gravity="center"
android:tileMode="mirror"/>
I tried it with 3 different pictures and it always does the whitespace when put on repeated background.
I wanted the background to simply connect without any whitespace.
Thanks in advance :)
I am using Eclipse.
What happens if you create a 9.png file and allow it to stretch to the edges? Looks like your bitmap is smaller than the space.

Categories

Resources