Imagesheet For On/off Switch

sjerrett · April 11, 2013, 4:51pm

Forgive me if this information is out there, but I cannot find it. Can anyone help me figure out what my imagesheet file should look like for an on/off switch? I don’t quite understand how the frames should work.

As I understand it, there’s a frame representing the background of the switch (i.e. the blue & white part with the text), a frame for the handle, and an “overlay” frame – I assume this is a mask?

Does anyone have a sample where they’ve implemented a custom switch that I could look at? I’m really lost.

-s.

soroush8 · May 7, 2013, 12:20pm

This is something I’ve been looking for too but I haven’t found anything useful either.

Could a Corona Admin please take a look at this. The documentation on this is severely lacking.

dweezil · May 9, 2013, 3:04pm

Anyone?

sjerrett · May 9, 2013, 3:35pm

Hey guys – if you take a look at the Corona github, they have the Widget 2.0 source, including all assets. Take a look at https://github.com/coronalabs

In particular, these are the four frames used in the default on/off switch:

I haven’t tried it yet, but I can’t see why it shouldn’t work. You can take a look at the code and see exactly how Corona has implemented it.

soroush8 · May 11, 2013, 10:06am

Hi sjerrett,

This is great, at least I now know what the different images should look like. I’ll give it a try and will write back if it works.

Thanks.

sjerrett · May 12, 2013, 1:47am

I tried it, but I found it was impossible without modifying the actual widget code. In widget_switch.lua around line 740 or so,

if "onOff" == opt.switchType then &nbsp;

there are a bunch of lines that set opt.OnOff frames from the customOptions table. So for example:

opt.onOffBackgroundFrame = customOptions.backgroundFrame or themeOptions.backgroundFrame &nbsp;

The customOptions table has keys starting with onOff, but this block doesn’t, so it fails. It should be:

opt.onOffBackgroundFrame = customOptions.onOffBackgroundFrame or themeOptions.backgroundFrame &nbsp;

Furthermore, within that block, there are typos where default is typed “defualt”

Also, in method “createOnOffSwitch()” there is the following block of code that checks if opt.themeData is set, and if so, sets all the frame variables to theme frames. Otherwise, it should set them to the custom frames:

if opt.themeData then &nbsp; local themeData = require( opt.themeData ) &nbsp; offFrame = themeData:getFrameIndex( opt.onOffHandleDefaultFrame ) &nbsp; onFrame = themeData:getFrameIndex( opt.onOffHandleOverFrame ) &nbsp; backgroundFrame = themeData:getFrameIndex( opt.onOffBackgroundFrame ) &nbsp; overlayFrame = themeData:getFrameIndex( opt.onOffOverlayFrame ) else &nbsp; print("else") &nbsp; offFrame = opt.onOffHandleDefaultFrame &nbsp; onFrame = opt.onOffHandleOverFrame &nbsp; backgroundFrame = opt.onOffBackgroundFrame &nbsp; overlayFrame = opt.onOffOverlayFrame end &nbsp;

However, opt.themeData will always be set at this point, so custom frames are never set. It should be a conditional based on whether custom frames exist. I changed the conditional to this:

if not opt.onOffHandleDefaultFrame then &nbsp; local themeData = require( opt.themeData ) &nbsp; offFrame = themeData:getFrameIndex( opt.onOffHandleDefaultFrame ) &nbsp; onFrame = themeData:getFrameIndex( opt.onOffHandleOverFrame ) &nbsp; backgroundFrame = themeData:getFrameIndex( opt.onOffBackgroundFrame ) &nbsp; overlayFrame = themeData:getFrameIndex( opt.onOffOverlayFrame ) else &nbsp; print("else") &nbsp; offFrame = opt.onOffHandleDefaultFrame &nbsp; onFrame = opt.onOffHandleOverFrame &nbsp; backgroundFrame = opt.onOffBackgroundFrame &nbsp; overlayFrame = opt.onOffOverlayFrame end &nbsp;

This seems to have done the trick; however, I have not tested it using the default switch (only with my custom imagesheet).

bruden01 · May 16, 2013, 3:30am

there also seems to be a typo in the widget code causing a crash

opt.onOffHandleDefaultFrame = customOptions.handleDefualtFrame or themeOptions.handleDefaultFrame

spelling of Default is spelled as Defualt

so if I do something like

backgroundFrame = 1,

backgroundWidth = 150,

backgroundHeight=30,

overlayFrame =2,

overlayWidth =75,

overlayHeight= 30,

handleDefualtFrame=3,

handleOverFrame =4,

The app crashes. Also not that I removed the onOff from the beginning of each var as its not in the code, so this gets me most of the way there, but is broken, so either an api doc bug or code bug.

Would like this to work as the default onOff switch does not seem to have an @2x for better resolution so it is not nearly as sharp as the other switches in settings on say iphone5.

soroush8 · May 7, 2013, 12:20pm