Dyanmic Tableview Mask?

TableView currently supports an optional mask file. I have a need where a fixed mask won’t work but a dynamically created mask would.

The API shows graphics.newMask as an option but:

The function returns a Mask object that can be applied to any display object using object:setMask()

The TableView is a widget, not a display object. Is there a way to dynamically create a mask for the TableView widget?

There really isn’t away to do this dynamically at this time.

Its a feature I think a lot of people could use, perhaps using

http://feedback.coronalabs.com

you could file a feature request there and get people to vote it up and see what happens.

There really isn’t away to do this dynamically at this time.

Its a feature I think a lot of people could use, perhaps using

http://feedback.coronalabs.com

you could file a feature request there and get people to vote it up and see what happens.

I’d vote for this. I actually think two things are needed:

  1. Ability to create simple rectangular masks of arbitrary size without needing a source bitmap file.

  2. Ability for TableView and other widgets to use a mask object as an alternative to a mask bitmap file.

So for an app with a nav bar at the top and a tab bar at the bottom, I’m going to need a mask for my tableView (since it has a custom height).

And while I can position the bars at the top and bottom of the screen, and can specify the tableView.height based on the space that’s left, I still have to have a separate mask file for each screen resolution I want to support?

So I need one for iPhone 3/4, a different one for the iPhone 5, one for iPad 1/2/mini, another one for iPad 3/4, and then (I can’t count that high) one for each Android resolution?

If that’s true, that’s insane.

Please tell me I’m missing something.

 Jay

@ Jay

That’s the way I see it as well.  :unsure:

However, as long as the aspect ratios are the same, you should be good. That means you should be able to use the same masks for all iPad’s. But, it’s a mess for Android.

I was hoping that creating masks with display.save()would save the day, but unfortunately it didn’t…

I’ve been toying with the idea of creating a plugin for this purpose…but it’s quite far down my priority list.

If the TableView would only constrain the dimensions to the x,y width, height there wouldn’t even be a need for a mask. The next best would be if a mask could be created dynamically - but Corona does not support this.

I think their priorities are with their cloud business not with widget basics for the rest of us.

You can sorta do masks on the fly except there is one problem. The display.save function adds a row of white pixels to the top and right of my test case. I am not sure if this is a known issue because I have never used display.save before this.

Because of that issue with display.save, the image created causes the mask to “leak”. If they fix that unintended bug with display.save, I think this would work fine.

I added this code to the end of the listview1 sample code to test it.

-- create rectangle to be our mask local myMask = display.newRect(0,0,100,100) myMask:setFillColor(255,255,255) myMask:setStrokeColor(0,0,0) myMask.strokeWidth=4 myMask:setReferencePoint(display.CenterReferencePoint) myMask.x = display.contentWidth/2 myMask.y = display.contentHeight/2 -- save rectangle as image file display.save(myMask,"tempmask.jpg") -- delete rectangle myMask:removeSelf() myMask = nil -- load image file as mask myMask = graphics.newMask( "tempmask.jpg",system.DocumentsDirectory) -- set as a mask to the group holding our tableview widgetGroup:setMask(myMask) -- position our mask widgetGroup:setReferencePoint(display.CenterReferencePoint) widgetGroup.maskX = 0 widgetGroup.maskY = display.contentHeight/2  

I went to the feedback area and gave 3 votes for scrollView & tableView widgets to have automatic masks:

http://feedback.coronalabs.com/forums/188732-corona-sdk-feature-requests-feedback/suggestions/3577113-automatic-masks-for-scrollview-and-tableview-widge

Hi all,

We’re aware that many people want “dynamic masks” for use with widgets and we’re discussing how to implement it cross-platform. Whatever the solution is, it will come in the core graphics update. Most likely, it will not be “dynamic masks” per se, but a method to restrict rendering to a rectangle that’s parallel to the screen (in other words, you won’t be able to rotate this to some odd angle). I can’t state all of the specifics at this point, but I want to give some sense of what’s reasonable and what can be expected.

Brent

@Brent - Such masks should allow for people that make apps that use device screen percentages for their layout and not just absolute values! I am currently involved with such an app and thus don’t have to worry so much about the many device screen sizes.

Thanks for a Staff input!

@anderoth

I have the same sort of issue with my masked images/groups. I sent a bug in yesterday of a simple case, and Tom explained most of it… I used a black background rect in my group, which got rid of some of the stray pixels, but I had white borders still too… I put together a test case today and sent it in that demonstrates the bug. Just as background info, my test case code was:

[lua]
– When using display.save with a masked group, a white border appears around the catpure

– Load the mask
local myMask = graphics.newMask(“160x240Mask.png”)

local myImage = display.newImageRect( “Bg02.png”, 640,960 )
myImage.x = 320
myImage.y = 480
    
local myObject1 = display.newRect( 10, 10, 100, 150 ) – Create a rectangle object
local myObject2 = display.newCircle( 10, 10, 50 )   – Create a circle object
local myBlackRect = display.newRect( 0, 0, 1000, 1000 ) – Create a rectangle object

myObject1:setFillColor(64,64,128,255)
myObject2:setFillColor(64,128,64,255)

local g = display.newGroup()

g:insert(myBlackRect)
g:insert(myImage)
g:insert(myObject1)
g:insert(myObject2)

g:setMask(myMask)
g:setReferencePoint( display.CenterReferencePoint )    
g.maskX = g.x
g.maskY = g.y     

g.maskX = 80
g.maskY = 120

– save the entire group as a new display object
    display.save(g, “test.png”, system.TemporaryDirectory)
    
– reload the just saved image    
    local combined = display.newImageRect( “test.png”, system.TemporaryDirectory, 160, 240 )

combined.x, combined.y = 220, 380
print(" new image w,h == ", combined.width, combined.height)

[\lua]

@anderoth

I sent in case 22962 for this bug last week, but nothing shows up in the bug database…

Not sure if it got canned or what… Anyone at CoronaLabs know what happened to 22962? I can resubmit today, write a new example, heck, I’ll even jump through a flaming hoop if that helps :slight_smile:

Just let me know, this bug makes it look like I am creating white picture frames around captured images :confused:

Hi @mpappas,

I just checked; this bug is still in the database and it’s being investigated. I recall some recent chatter on it too, so it’s being reviewed and hopefully there’s a resolution for it soon.

Thanks,

Brent

I’d vote for this. I actually think two things are needed:

  1. Ability to create simple rectangular masks of arbitrary size without needing a source bitmap file.

  2. Ability for TableView and other widgets to use a mask object as an alternative to a mask bitmap file.

So for an app with a nav bar at the top and a tab bar at the bottom, I’m going to need a mask for my tableView (since it has a custom height).

And while I can position the bars at the top and bottom of the screen, and can specify the tableView.height based on the space that’s left, I still have to have a separate mask file for each screen resolution I want to support?

So I need one for iPhone 3/4, a different one for the iPhone 5, one for iPad 1/2/mini, another one for iPad 3/4, and then (I can’t count that high) one for each Android resolution?

If that’s true, that’s insane.

Please tell me I’m missing something.

 Jay

@ Jay

That’s the way I see it as well.  :unsure:

However, as long as the aspect ratios are the same, you should be good. That means you should be able to use the same masks for all iPad’s. But, it’s a mess for Android.

I was hoping that creating masks with display.save()would save the day, but unfortunately it didn’t…

I’ve been toying with the idea of creating a plugin for this purpose…but it’s quite far down my priority list.

If the TableView would only constrain the dimensions to the x,y width, height there wouldn’t even be a need for a mask. The next best would be if a mask could be created dynamically - but Corona does not support this.

I think their priorities are with their cloud business not with widget basics for the rest of us.

You can sorta do masks on the fly except there is one problem. The display.save function adds a row of white pixels to the top and right of my test case. I am not sure if this is a known issue because I have never used display.save before this.

Because of that issue with display.save, the image created causes the mask to “leak”. If they fix that unintended bug with display.save, I think this would work fine.

I added this code to the end of the listview1 sample code to test it.

-- create rectangle to be our mask local myMask = display.newRect(0,0,100,100) myMask:setFillColor(255,255,255) myMask:setStrokeColor(0,0,0) myMask.strokeWidth=4 myMask:setReferencePoint(display.CenterReferencePoint) myMask.x = display.contentWidth/2 myMask.y = display.contentHeight/2 -- save rectangle as image file display.save(myMask,"tempmask.jpg") -- delete rectangle myMask:removeSelf() myMask = nil -- load image file as mask myMask = graphics.newMask( "tempmask.jpg",system.DocumentsDirectory) -- set as a mask to the group holding our tableview widgetGroup:setMask(myMask) -- position our mask widgetGroup:setReferencePoint(display.CenterReferencePoint) widgetGroup.maskX = 0 widgetGroup.maskY = display.contentHeight/2  

I went to the feedback area and gave 3 votes for scrollView & tableView widgets to have automatic masks:

http://feedback.coronalabs.com/forums/188732-corona-sdk-feature-requests-feedback/suggestions/3577113-automatic-masks-for-scrollview-and-tableview-widge