iphone - Positioning stretched UIImages correctly -

i creating uisegmentedcontrol replacement works own custom images. because separators need different colors on both sides decided give middle item 2 borders.

now display uisegmentedcontrol replacement, calculate available width 1 item (frame.size.width / numberofitems). create uibutton custom background image (the stretchable middle segment image). next thing position everything. because 1px separators need visible when select item, give every item 1px larger frame should have. next item overlaps 1px left.

segmentrect = cgrectmake(indexofobject * (self.frame.size.width / numberofsegments), 0, (self.frame.size.width / numberofsegments) + 1, self.frame.size.height); 

using result nearly perfect custom uisegmentedcontrol (retina):

now things pretty ok, changes when adding more/less segments. 300px wide control way, each segment gets 25px of space. if change number let's 13, shows up:

notice different border between '3' , '4'. (easier spot on non-retina because of pixel doubling) think caused not nice amount of space each segment gets. (300 / 13 = 23,0769) 1 should think stretchable image accommodate this, no? separators 1px in width , change frame 1px, 2 separators should placed exactly on top of each other, not case here.

does have explanation why happens , more important way fix this?

all coordinates floats (cgfloat's, actually) default, if you're handing system non-integer coordinates try best draw between pixels, using anti-aliasing. weird 3/4 border due this.

one solution give segments integer-sized widths. may sound bit nasty, since might not same width in order fill space (i.e. if overall width not divisible number of segments), code following shows how can done without trouble:

int totalwidth = self.frame.size.width; float dx = (float)totalwidth / numsegments; float lastx = 0.0; (int = 0; < numsegments; ++i) {   int thiswidth = round(lastx + dx) - round(lastx);   cgrect segmentframe = cgrectmake(round(lastx), 0, thiswidth, height);   /* segmentframe */   lastx += dx; } 

i technique because automatically evenly distributes widths larger others (all widths within 1 pixel of each other).

this code not including 1-pixel overlaps, easy add.

another benefit if uilabel's or uiimageview's have integer coordinates (in coordinate system of entire screen), tend more crisp.