Is this normal 9patch behaviour? and how can I avoid it? - android

I'm working on a search bar that's supposed to stretch full width of the screen, so I'm thinking 9patch rather than 5 different assets, right?
This is what it looks like
9patch asset:
I tried settting android:padding=0dp, also dynamically with setpadding(0,0,0,0);
I've updated the 9patch to allow content all over the image (the bottom and right lines - at max length)
Does anyone have any idea why this behaviour?

If you means that your EditText gets extra padding.
Please set it in Java , not in layout.
EditText text = (EditText)findViewByid(R.id.myedittext);
text.setPadding(0,0,0,0);
View will get extra padding if you set a 9patch background to it.

Eventually I resized my 9patch asset like so:
And my theory is that the 9patch gets split in the middle(horizontally) and the content is inserted, rather than simply surround the content.
So if you have a 10px 9patch and a 10px content, you would get a 20px result, instead of my former belief that it would be something like 12px.
Hope this helps :)
P.S. I will vote the correct answer to whomever comes with something more than a "theory"

Related

How to position widgets inline in Android?

I am trying to achieve something like this in Android:
which is a Spinner between two TextView widgets, aligned by baseline within RelativeLayout.
So far looks fine, as long as everything fits into one line. The tricky part is having it wrapped if there's too much text (e.g. i18n), or the screen is too small — and RelativeLayout is powerless here, the line simply overflows the screen.
Basically I need something like "display: inline; vertical-align: baseline" in HTML. Any ideas how to achieve this will be much appreciated.
For text size use sp as size parameter. Rest give spinner size in dp. It will automatically adjust.

Preventing Pixelation of Images, indenting listViews and adding Rounded corners

I have a few issues and questions regarding some UI development on Android. Firstly look at this image:
Firstly at image A) This is a image that I insert and repeat horizontally to give the zig-zag shape at the top of the screen regardless of screensize and above that a textField with no content and a background color - But as I'm sure you can is that the two colors don't match up quite as perfectly as it should even though they both have the same hex color value (#BF0426). And secondly, you can also see some serious pixelation on that zig-zag image. How do I fix these 2 problems?
And then at image B) Here I have a simple listView. What I would like to do, is firstly indent it a bit on both sides, and round the corners of the top and bottom item. So basically I want it to look like the blue border drawn on the screenshot. (Your typical iOS listView). How do I go about doing this?
Thanks in advance for any tips!
For the image. Just out of curiosity, why wouldnt you simply extend your image to include the top pixels as well? In other words, build your repeating image such that it incorporates the pixels that you are trying to create using the empty textview. This will at least take care of the color missmatch, as the color will all be generated from the same place. In terms of the pixelation. Are you truly repeating the image, or are you spreading the image. A spreading will definitely cause what you are seeing.
For your tableview:
For the left and right indent, you can simply use the margin or padding attributes of tableview item. There are generic padding and/or margin attributes (which will pad all of the top, bottom, left and right), or there are separate padding and/or margin attributes for each top, bottom, left, and right. Here is a great link on padding versus margin that you may want to read.
Difference between a View's Padding and Margin
Example attribute (as called in an XML file) for bottom margin
android:layout_marginBottom
setMargins(left, top, right, bottom) // for setting margins programmatically
Example attribute (as called in an XML file) for top padding
android:paddingTop
setPadding(left, top, right, bottom) // for setting padding programmatically
For the custom top and bottom, you should be able to use the following tutorial
http://www.softwarepassion.com/android-series-custom-listview-items-and-adapters/
From here, you should be able to detect the item as the first and last item and set the background property (image) to a background image that has a rounded top or rounded bottom. This is how I do it on the iPhone. I have also implemented things that LOOK like tableviews but are simply vertical layouts with my own custom views that I have made to look like what you are wanting.
One thing to consider is the file format you use is going to mutate the image as you save it (lossy compression), so a .jpg with a certain color may look different than a .bmp with the same color. Make sure you author using the same application and/or export settings when trying to match up images.
Also, if you created your image with a DPI that is not compatible with the android display it can cause serious pixelation in detail areas, especially with gradients and drop shadows.

Large Text Shadow on Android

I have an app where I am trying to add text shadow to a TextView. The problem is: the shadow is always very thin. I'd like it to be thicker.
I am trying to generate "memes", as some of you might know from the "fun sites" on the internet. My goal is something like this font:
http://d24w6bsrhbeh9d.cloudfront.net/photo/4324188_460s.jpg
I am using the same exact font, Impact. The problem is, when I add a black border shadow, the shadow is not visible enough and it's not wide enough. It's barely barely noticeable.
I am defining a FrameLayout, with the picture on the bottom and two text fields, one on the top and one on the bottom. The shadow is barely visible for both of them.
I have been using the parameters, shadowDy, shadowDx, etc. I know the shadowRadius is the parameter that actually defines the border size, but I have been experimenting both with values above 1 and below 1, and I can't seem to get any good results. There are minimal changes in size and shadow density, but nothing useful.
I have considered another option, which is a last resort, which is drawing the text twice, a bigger black font in the BG and align the character spacing so that the black text becomes the shadow of the white text on the front.
Thank you in advance !
You won't be able to accomplish that effect with the basic TextView shadows. I'd look at adding a stroke instead:
https://stackoverflow.com/a/2151964/321697
http://developer.android.com/reference/android/graphics/Paint.Style.html

header image dimensions layout and layout-land

i cant seem to figure out how to get my header to look correctly.. there's either white space in one view or the other.
is there a way to use two separate images with different dimensions?
I either get it looking like this
screenshot1 http://m4x.co/m/s1.png screenshot2 http://m4x.co/m/l1.png
or.
screenshot3 http://m4x.co/m/s2.png screenshot4 http://m4x.co/m/l2.png
but.. i want
screenshotideal1 http://m4x.co/m/s1.png screenshotideal2 http://m4x.co/m/l2.png
To get rid of the white space you can use negativ margin in picture style <img src='some_picture.png' style='margin-left:-10px; margin-right:-10px;'>.

Adjusting center of nine-patch png

I have a nine-patch png that I'm using as a popup bubble. It looks like this:
I'm putting it in an TextView of width fill_parent so the bubble expands the width of the screen. As one might expect, the pointer at the top is then centered horizontally in the middle of the screen.
What is the easiest way to adjust the location of the pointer so that it's, say, 5/8ths of the way over from the left instead of centered?
I can re-cut the png if necessary.
UPDATE: Cubic has a very simple solution to the problem that I can't believe I missed. It works very effectively for my current problem. However, one downside with this solution is that it can't be adjusted on the fly. If I need to put the pointer in one place for one view, but a different place for another view, I need to cut two different PNGs. Is there a solution that can be adjusted at runtime?
You have a balanced stretch at the moment with one dot on each side. Can you try adding more to the left or right?

Categories

Resources