I am wondering as a new Android developer (10+ years C# OOP) which would be the better way to create a simple repeating background. The background will be consistent no matter the screen size, density, or orientation. I've read the Android Developers Dev Guide about things such as supporting multiple screens, nine patch drawables etc. I have seen tutorials such as this one (http://androidforbeginners.blogspot.com/2010/06/how-to-tile-background-image-in-android.html) telling you how you can use an image and get it to repeat.
Of course using an image then you have to provide multiple images for multiple densities or risk bitmap scaling and pixelation. For a complex background pattern I can see how this might be the way to go. But my pattern is a simple grid pattern so isn't there a better way using just xml?
I looked at GridView and TableLayout and both allowed me to set a background color, specify cell width / height, but I did not see a way to specify the grid line color.
For now I am using the slightly older 2.3.3 api as that is the largest version currently in use.
I don't suspect I'll need much hand holdong just some good solid advise from those who know better than I.
Thank You
JB
You can create a drawable like this:
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="AndroidPuzzlesSolver/#drawable/bg_tile"
android:tileMode="repeat"
android:dither="true" />
Place the above in a "background.xml" file at the drawable folder. Then you can use it in your layout like this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#drawable/background">
You can use a background with all Layouts.
I don't think there is an out-of-the-box way to do an alternate repeat, e.g. show one image at some places and another one in some others. If you want something like this, then you would probably need to implement your own View and override the onDraw method. You could use a FrameLayout to combine this background View with any other elements.
Related
I understand how to create gradients using start color, end color, etc like below:-
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<gradient
android:type="radial" android:gradientRadius="260"
android:startColor="#A74171" android:endColor="#690136"/>
</shape>
But I dont understand how to bring about more complex effects. For Eg:- I am faced with a task of making a textview look like a button where it will look a little raised at the center, something like the image attached .
How can such an effect be brought by code without using images?
Here's the good news: Something like the button, shown in the picture, already exists. Maybe in other colors, but with a little painting you should get there easily. Check out the design downloads
When there're good news, than there might be some news with - lets say - more work involved. This link to Drawable Resource gives you an overview of what is possible with XML.
When you get out of XML possibilities, you must create your own Drawable, which is described here which is extremely powerful.
You can always paint your own drawings, load them as bitmap and use them. There you must be very sensitive on the size of the bitmap and the good looking (painted with enough pixels). I mysef have not found the right mix up to now.
All in all, in my experience, even the most complex XML drawables are quite efficient, whereas my own Drawables, painted at runtime are always a cause for lagging on the UI-Thread.
I would like to have a pattern along the edge of a view. For this particular case, I would like it to be a jagged edge (like tearing parchment paper or tinfoil out of a roll). I would prefer a more general solution - perhaps at some point I would like waves along the top of a view, or a binder coil down the side. I would prefer to have some kind of repeating image rather than stretching an image.
Edit:
I would like a the pattern to occur just around the edge of the view (perhaps only on one edge). For example, a tear mark on the bottom or top of a receipt. The tear should not repeat up or down the image, just at the bottom edge.
Create a drawable (pattern_tile.xml) with the root element of a <bitmap>. Like this for instance:
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:dither="true"
android:src="#drawable/bgnoise_lg"
android:tileMode="repeat" >
</bitmap>
And the drawable image used in the code above is:
Then, in your XML, you set it like you set the usual background using this attribute:
android:background="#drawable/pattern_tile"
Oh. Almost forgot, I put these two files, in the drawable-nodpi folder. I don't want Android to ever scale the image for me.
Obviously, since your question is a little vague, you will have to use your own image instead of the example I have posted, play around with it a bit till you get the result that suits your needs.
NOTE: Such a thing is typically done when you have patterns that should repeat instead of filling up the screen or stretching. So make sure the image you use is such a pattern that can repeat and not look out of place.
I am new to android development so I don't have much experience.
I want to develop an app for children in which I want display images (png or bitmap) of a sky, mountain, river in a combined manner and children can change the color of the sky ( that means only the sky bitmap will change ).
I want to display all bitmaps one over another like a Photoshop layer so children can add a tree or a small mountain to the view by clicking a button.
Please guide me on how I can work on such image manipulation. Which techniques do I have to use for this?
Just a starting point:
All your bitmaps must have a transparent background.
Use a RelativeLayout and add your Bitmap on it (RelativeLayout allows you to place childs overlapping each other)
You can use margin to position bitmaps where you want in your RelativeLayout
EDIT
Here is a simple layout with 2 bitmaps (image1 and image2 both have a transparent background) overlapping each other.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:id="#+id/relativeLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<ImageView
android:background="#drawable/image1"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<ImageView
android:background="#drawable/image2"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</RelativeLayout>
It depends on your requirements. If you really want to create complex application I would recommend you to use a game engine. Like cocos-2dx, for example. It's free, cross-platform and there are a lot of graphics processing features out of box. There are layers, filters, animation... and it works very fast.
If you are android SDK fan then create a custom view and use it's canvas. It wont be easy. But if your app is simple enough you better stick with canvas.
I want to create a bookshelf that tiles horizontally and vertically. I have three images, ShelfLeft, ShelfMid, and ShelfRight. ShelfLeft starts each row/shelf, followed by X ShelfMids across the screen, capped off by ShelfRight at the end of each row.
There will be a default of 5 rows, and if more are needed, they shall be able to be added dynamically.
What is the best way to go about doing this?
Thanks.
I'd use a TableLayout. Use a cell for each of the "ends", and then another single cell for the tiled background.
To make a background repeat, create res/drawable/my_background.xml:
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/back"
android:tileMode="repeat" />
Then reference this as the background in your layout by specifying `android:background="#drawable/my_background".
(Source: http://androidblogger.blogspot.com/2009/01/how-to-have-tiled-background-cont.html)
Also worth noting: You might find the NinePatch class useful when creating your "ends".
I use several tiled drawables that are used as backgrounds for various layouts. For the most part the tiles work correctly but occasionally (once on every 4..5 runs) in some (but not all) of the backgrounds a single tile image gets stretched to fill in the background rather than repeat it (resulting in a very "fuzzy" background).
Tiles are declared in an xml drawable like this:
`bitmap android:src="#drawable/bg_tile_dark" android:tileMode="repeat"
xmlns:android="http://schemas.android.com/apk/res/android" />`
The tile drawable is used as a background image like this:
` RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/my_background_tile" >
`
....
/RelativeLayout>
This issue happens across multiple versions of Android and on different devices so there must be a trick to how to use tiles. Does anyone have experience using tile backgrounds or knows a workaround to force tiles to always repeat?