implementing 9 slice in love2dcs?

Questions about the LÖVE API, installing LÖVE and other support related questions go here.
Forum rules
Before you make a thread asking for help, read this.
Post Reply
Shadowblitz16
Citizen
Posts: 73
Joined: Wed Oct 28, 2015 11:18 pm

implementing 9 slice in love2dcs?

Post 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.
User avatar
zorg
Party member
Posts: 3468
Joined: Thu Dec 13, 2012 2:55 pm
Location: Absurdistan, Hungary
Contact:

Re: implementing 9 slice in love2dcs?

Post 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.
Me and my stuff :3True Neutral Aspirant. Why, yes, i do indeed enjoy sarcastically correcting others when they make the most blatant of spelling mistakes. No bullying or trolling the innocent tho.
Shadowblitz16
Citizen
Posts: 73
Joined: Wed Oct 28, 2015 11:18 pm

Re: implementing 9 slice in love2dcs?

Post by Shadowblitz16 »

thankyou I will look into this.
Shadowblitz16
Citizen
Posts: 73
Joined: Wed Oct 28, 2015 11:18 pm

Re: implementing 9 slice in love2dcs?

Post by Shadowblitz16 »

@zorg
wait so how do I translate image coordinates to screen coordinates?
User avatar
zorg
Party member
Posts: 3468
Joined: Thu Dec 13, 2012 2:55 pm
Location: Absurdistan, Hungary
Contact:

Re: implementing 9 slice in love2dcs?

Post 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.
Me and my stuff :3True Neutral Aspirant. Why, yes, i do indeed enjoy sarcastically correcting others when they make the most blatant of spelling mistakes. No bullying or trolling the innocent tho.
User avatar
HDPLocust
Citizen
Posts: 65
Joined: Thu Feb 19, 2015 10:56 pm
Location: Swamp
Contact:

Re: implementing 9 slice in love2dcs?

Post 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).
Science and violence
Post Reply

Who is online

Users browsing this forum: Ahrefs [Bot], Amazon [Bot] and 3 guests