Page 1 of 1

implementing 9 slice in love2dcs?

Posted: Sun Apr 28, 2019 11:04 pm
by Shadowblitz16
can someone explain the best method to create a 9slice object in lua?
I am having trouble converting [x,y,w,h] and [x1,y1,x2,y2] back and forth and I don't know what format the object should hold onto.

here are the features I need..
- the ability the specify a texture source rect and source margin on creation
- the ability to draw the 9patch with a x,y,w and h
- the ability to clip content that is too small for the margin.

I cannot just use a library because I am using love2dcs which is C# not lua, so I need to understand this so I can translate.

Re: implementing 9 slice in love2dcs?

Posted: Mon Apr 29, 2019 12:08 am
by zorg
I'd guess in a similar way you'd code it in any other language? The basics behind it don't change just because the implementation might...

The conversion i can help with, since it's relatively simple:

Code: Select all

function toTopleft(x1,x2,y1,y2)
    -- assuming that x1 and y1 are the ones having lesser coordinates on both axes.
    return x1, y1, x2-x1, y2-y1
end

function toVertices(x,y,w,h)
    -- assuming w and h cannot be negative
    return x, y, x+w, y+h
end
That said, a 9-slice has a bit more points one needs to bookkeep, but since you didn't specify that the margin wouldn't be uniform all around, it need not be side-specific.

drawing it is just drawing all 9 parts of it; can be done with either the xywh or x1y1x2y2 method, if you also add/subtract the margin dimensions from those, where applicable.

Code: Select all

A--B------C--D
|  |      |  |
E--F------G--H
|  |      |  |
|  |      |  |
I--J------K--L
|  |      |  |
M--N------O--P
clipping stuff could be done with a scissor, if you don't intend to rotate the object, otherwise, i'd say a stencil mask would be a choice.

Re: implementing 9 slice in love2dcs?

Posted: Tue Apr 30, 2019 5:42 pm
by Shadowblitz16
thankyou I will look into this.

Re: implementing 9 slice in love2dcs?

Posted: Thu May 02, 2019 5:57 pm
by Shadowblitz16
@zorg
wait so how do I translate image coordinates to screen coordinates?

Re: implementing 9 slice in love2dcs?

Posted: Thu May 02, 2019 7:27 pm
by zorg
Just a heads up, @-ing my nick does nothing to make me see a notification, if anything, quote my post and delete the quote's contents.

So, it depends how your image is laid out, but if you have one image containing all slices, then that's basically the same as an image atlas or sprite sheet or whatever you want to call it, and using quads would be one solution (And a spritebatch with quads another solution), since you would need to cut up the image as well.

Look up how quads work on the wiki, then after you have all 9 of them created (using the visual aid but with image coordinates), you should just draw them using the screen coordinates and dimensions (calculated again via the visual aid i posted previously) and that should give you what you want to see.

Re: implementing 9 slice in love2dcs?

Posted: Thu May 09, 2019 6:57 am
by HDPLocust
You need the nine-slice image and set of quads (for every slice), just scale quadded image to fit or quad:setViewPort (texture repeat mode) to repeat image patterns (it needs several slice-images for repeating).