I'm attempting to customise the look of a Button using a 9-patch drawable with no padding defined within in (no pixels on the right or bottom inside the 9-patch editor).
Is there a simple way to apply a 9-patch drawable to a button and maintain the button's default size. For example, when I apply the 9-patch to the Easy button shown below, it is a different size to the other default styled buttons, which share the same layout, except for the 9-patch style.
Mdpi layout:
Hdpi layout:
So basically, is there a way to make the Easy button the same size as Medium and Hard, on both mdpi and hdpi screens, without making a new 9-patch for each density, and working out the correct padding.
Thanks in advance for your help, I can provide more information if required.
Well after some more research it seems that it isn't easily possible to use one 9-patch drawable for all screen densities.
The link below states you need different drawables for each density:
Custom Color Buttons for Android
3.1. Create images 9-patch images for the different colors that you need and put them into drawable-hdpi and drawable-mdpi (yes, you will need two versions if you want your buttons to look good on different devices).
If anyone knows any different though, your help would be much appreciated.
Related
hi.
I have a problem with android layout.
gif is what designer want I make. and I made things successfully but menu.
png(alpha image) is our menu image. last 40px of height is want to display.
and if user touch that 40px of image is coming down just like gif image shows.
I don't have any idea how can make that. Constraint Layout doesn't support negative value.
ps. png is based on 1080 height resolution. but I will add dynamic resolution calcaulator function, so don't mind about 40px. 40 just mean 'want to display part of imageview'
SOLVED.
make imageview in constraint layout xml and inflate it.
then you can set x,y location programmatically.
I confused it. because when I tried it, It doesn't work. you must know view has relative location.
I'm creating a bar at the top of my app much like the one above.
The graphics are embedded into the background and the numbers that represent the level etc is using TextViews.
As you can see the TextView has to be pixel(dp) perfect to fit in the center of the white bar thingy. With some margins or padding i can achieve that.
But how do games like that keep the same pixel perfect across all devices?
I know about resource qualifiers and such but some devices within the same bucket have different sizes.
Is there a good way or trick to achieve the perfect centering across most devices?
In general Android will handle the relative sizes across devices as long as you do everything in relative units and include 9-patch or images for each screensize.
For your question of how to handle images attached to a TextView, you can accomplish this a few ways.
A TextView will allow you to attach a drawable to it on the top, bottom, left, and right. You can do this with code using the various setCompoundDrawable* methods. For example, this will add a drawable to the right and left of the TextView.
txtScore.setCompoundDrawables(R.drawable.imageLeft, null, R.drawable.imageRight, null)
You can also do this in XML with the drawableLeft, etc properties. You may need to mess with padding and bounds for the drawables.
<TextView
android:id="#+id/txtScore"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:drawableLeft="#drawable/imageLeft"
android:drawableRight="#drawable/imageRight"
android:drawablePadding="10dp"
android:singleLine="true"
android:text="125"/>
There are a number of different options in code as well if you look over those setCompoundDrawable type APIs for the TextView.
Your other option is to create your own View that does all of the work for you, but may be overkill if you only use it in one spot.
Again, you will really want to consider a 9-patch image or create an image for each screensize in the drawable folders. This will allow Android to determine which image to use for each device.
I want to have a splash screen, something like a full picture, which doesn't crop in heigth or width on different smartphone screens.
Now I achieved a splash screen with android:scaleType="fitXY", but now the image is cropped on top or bottom or if the devices screen size changes to another aspect ratio it is cropped on the left and right.
What do I have to do? I've already read the android developer article Supporting Multiple Screens, but I don't get it how to achieve this.
A simple picture in the middle of the screen is just simple to get, but a picture which fills the screen is hard to get. Can you help me pls?
you should use center_crop per this purpose. From the doc
Scale the image uniformly (maintain the image's aspect ratio) so that
both dimensions (width and height) of the image will be equal to or
larger than the corresponding dimension of the view (minus padding).
There is no way to create one single asset and expect it to do not be cropper and to do not create black areas when the application is deployed in different screen sizes.
The android platform is designed to work dynamically with multiple screen sizes that any manufacture can change at any time, including new resolutions that you haven't thought about it yet.
Android can specify minimums for screen hight/width categories in which your resources will fall, but those are generics.
In order to use them, you will have to specify qualifiers in your drawables and create a different splash screen for every qualifier, as for example if you use drawable-w420dp, all the resources there will be used when the screen has a minimum width of 420dp (notice that are not pixels)
So you have two options:
You can use one single splash image and design margins of that image flexible enough in order to cope with the image being cropped in certain cases. You can play with different scaleTypes in your ImageView and take as a reference this website http://etcodehome.blogspot.co.uk/2011/05/android-imageview-scaletype-samples.html even though as commented before, "center-crop" will be your best shot.
You can programatically use a specific image for a specific resolution.
2.1 Put in the assets directory, all the splash images that you want for all the specific resolutions or aspect ratios that you want to use
2.1 Get the screen size of the device with Get screen dimensions in pixels
2.2 Now you can load from the assets the image that you want dynamically
Use the below code
android:layout_width="match_parent"
android:layout_height="match_parent"
which will fill the entire screen.
Try Using Width and Height of image to "match_parent"
I need to know how my game can handle all these screen sizes i have seen a few options including:
Re sizing the elements to fit the screen
Making assets in lots of different sizes
I'd like to know which is more efficient ?
What are my other options ?
How would i go about making it work ?
So far i am just making my screen fit to the android device i'm testing on and this could lead to failure in the future if i do not set this handler up
Thanks
well if you are using libgdx then you dont have to worry about screen sizes. just use its camera class and set its viewports accordingly . refer this link for camera
Also you dont need to make android handlers for it.
This website talks about how to handle this problem http://developer.android.com/guide/practices/screens_support.html.
It claims the best practices are:
Use wrap_content, fill_parent, or dp units when specifying dimensions in an XML layout file
Do not use hard coded pixel values in your application code
Do not use AbsoluteLayout (it's deprecated)
Supply alternative bitmap drawables for different screen densities
The problem is not with the dimensions of the screen, rather the density of the screens. Using dp to set the size for elements is the most common way.
I want to have an image on the android screen where different parts of the image can be clickable. What I mean is that, If its an image of 3 circles, I want to be able to click each of these circles,
Then I can add different functionalities to each of these clickable circles.
For an instance in this image below I want to be able to click each distinct color. Is it possible to have on-touch-listener and get you the color ? and can it be an image or has to be drawn in Java OR XML ?
I found a really good widget that helps you make any image muli-clickable. They have some good notes on how to use their widget as well.
The widget has a similar approach as Image mapping in html. The good thing about this widget is that the image can be zoomed and it will not lose the coordinates or areas associated to specific clicks.
Here is the link to their website. the guy who made the widget apparently had similar problem and came up with this widget.
Another solution would have been
creating an ImageView containing the png file referenced
making the whole ImageView clickable
setting an OnTouchListener to the ImageView which overrides the onTouch method
check the colors of the image pixel at the touch position
This is often done with an invisible mask image with one color for each zone (see the popular detailed tutorial), but here the image itself has distinct colors for each zone which makes it more interesting.