Anyone have a glossy button shader?

Seems like a simple thing to either make or find, but I can’t seem to quite get the time to hack it out…does anyone have one already? I’d embed it into Cider2.

Well, it’s not a shader, but it’s glossy…Added a gist of a simple glossy button maker with parameters.

https://gist.github.com/AntonioCiolino/5367189

image here: (zoomed)
http://twitter.com/antoniociolino/status/322460862038290432/photo/1

Looks nice. I’ve written some code for a nine-patch, dividing an image into nine meshes, so that it can stretch a button image without messing up the round corners.

yeah, I’m trying to figure out how to hack a “masking” feature…I don’t see offhand how to do that yet.

I did see something like that in the blendmodes, but I haven’t figured out how to do it exactly right yet.

I am not sure what you are looking for but adding something like
col.rgb*=1.0*(vTexCoord.y-(vTexCoord.x-0.5)*(vTexCoord.x-0.5));
In the codea generated new shader will provide the lighter top of a picture. I guess you can also generate a rounded button from a mesh by making the corner things transparent

@corneliuhoffman, it’s getting the top ellipse to be lighter only that I’m struggling with. I got the POC in the gist code, but I can’t quite firgure out how to make an ellipse in a shader, which is much preferred (and doesn’t mess with setContext())

Mine makes a little lighter parabola.

Is that going in the fragment shader? Seems to not work there.

I get the idea you’ve put together - have the coords control how far down the “lighter” area is. Nice idea.

Supposed to be “col.rgb = col.rgb * (vTexCoord…”?

Yes that’s right, you might also consider + instead of times

I went ahead and made a mask as a bitmap with a thick, rounded line and apply that to a shader that checks for alpha values and gasp discards pixels with an alpha of 0.0 to resolve the rounded corners issue.

Wouldn’t it be better to make a mesh with rounded corners?

I amusing a mesh now to do the pixel manipulation and discard. Not sure how bad performace is with it, but it was easier to draw a line with a rounded cap and use that as a mask that it was to write code to generate a triangle fan…

On another note, I’m finding out that setContext is really really not happy with me (nor I with it)

If I attempt to setContext inside of a draw() that was called from another draw(), I basically get a cascading failure of epic proportions.

It looks like setContext(img), even when closed with a proper setContext() before being reassigned to a new image, doesn’t play nicely in the draw() loop.

I meant that you should do the whole thing with a mesh, rounded corners and all. Then you don’t have to worry about discard (which is slooooow) or about alphas.