widget.newPickerWheel (DatePicker event/Listener)

Hi Guys,

I would like to do something as described below with DataPicker,

After User pickup a date , say: Aug 15, 2011, then I would like automatically to display this Date in a Text object.
In the demo example Corona Provided, after press “Done” button, the Text is updated with the data picked from PickerWheel.

How can I do : after date is picked, the text is automatically updated with the Date Picked, is there any event it is triggered after date is pick, or any event Listener I can use for this ?

Thanks.

Mila

[import]uid: 83418 topic_id: 18639 reply_id: 318639[/import]

When you press the “Done” button an event is called for the button press. So at that point you can easily code myText.text = textFromPicker.

If you want to do it live (without the Done button), I’d guess you either need a Runtime listener that is constantly calling picker:getValues() (sounds like it could have some performance implications but might be worth a try?) or some trickery - maybe add an event listener to the widget that only updates the text…? [import]uid: 41884 topic_id: 18639 reply_id: 71604[/import]

Hi Richard,

Thank you very much for your Help.

I want it to be live without pressing a “Done” button to trigger updating the text.

Yes, I want to add an event listener for DatePicker, but what event this DatePicker can support, can you please give some guidance.

Thanks again.
[import]uid: 83418 topic_id: 18639 reply_id: 71611[/import]

In a normal function (like a button) there is a touch event. That means it’s an event triggered by a finger touch on the object you specify.

In PickerWheel there is also a touch event but it isn’t exposed to you (it’s built into the function instead).

So you have two options that come to my mind:

  1. Make a Runtime touch event. I’m oversimplifying but basically it’s going to listen for all touches, not just picker. Then you get it to listen for the picker and call getValues() whenever that happens.

local listenforPicker = function(event) if event.target == myPicker then myTextObject.text = myPicker:getValues() end end Runtime:addEventListener("touch", listenforPicker)

(I’m not entirely sure if the event.target part works, but that’s the basic idea, anyway…)

  1. Add another touch event to the Picker Wheel. This is cleaner but can make it difficult for you if you ever want to have buttons underneath the wheel.

local listenforPicker = function(event) myTextObject.text = myPicker:getValues() end myPicker:addEventListener("touch",listenforPicker)

This works if you’re not using focus or return true as normally Corona will accept all inputs at once (so in this case you’re literally pressing the picker and “listenforPicker” at the same time.)

I can’t be sure if either of these work, but those are the two approaches I would consider… [import]uid: 41884 topic_id: 18639 reply_id: 71620[/import]

Hi Richard,

Thank you soooooooo much for your detailed instructions.

I will test it.

Thanks gain.

Mila

[import]uid: 83418 topic_id: 18639 reply_id: 71673[/import]

Richard,

It seems there is NO “touch” even support for PickWheel,
I tried to put: Runtime:addEventListener(“touch”,listenforPicker),

When I click on PickWheel, there is no print out message from listenforPicker, if I click on other part of the screen out side the pickwheel, I got print out info “Picked”.

When I put:

picker:addEventListener(“touch”,listenforPicker)

There is no Print out info when I click on PickWheel or on other part of Screen.

Maybe I am doing something wrong,(I am testing this in Simulator), I am using Corona Demo example.

Thank you so much.

==========================
local function pickerinit()

local columnData = {}
columnData[1] = { “January”, “February”, “March”, “April”, “May”, “June”, “July”, “August”, “September”, “October”, “November”, “December” }
columnData[1].alignment = “right”
columnData[1].width = 150
columnData[1].startIndex = monthIndex

columnData[2] = {}
for i=1,31 do
columnData[2][i] = i
end
columnData[2].alignment = “center”
columnData[2].width = 60
columnData[2].startIndex = dayIndex

columnData[3] = {}
for i=1,25 do
columnData[3][i] = i+1990
end
columnData[3].startIndex = yearIndex

– create pickerWheel widget
picker = widget.newPickerWheel{
id=“pickerWheel”,
top=480, --258,
font=native.systemFontBold,
columns=columnData,
}

local listenforPicker = function(event)
print(“Picked”)
if event.target == picker then
print(“Picked”)
end
end

–picker:addEventListener(“touch”,listenforPicker)

Runtime:addEventListener(“touch”,listenforPicker)

– slide the picker-wheel up
transition.to( picker, { time=250, y=258, transition=easing.outQuad } )

–transition.to( picker, { time=250, y=258, transition=easing.outQuad,onComplete=listenforPicker } )
–transition.to( picker, { time=1500, alpha=0, x=(w-50), y=(h-50), onComplete=listenforPicker } )

end [import]uid: 83418 topic_id: 18639 reply_id: 71687[/import]

Tried out your code.

  1. Please use < code > and < / code > (without the spaces) to make your code appear as “code” in the forum. Makes it much easier to read :slight_smile:

  2. Your “Picked” problem is because you use print(“Picked”) both inside and outside of the “if” statement. Get rid of the first picked for accurate results.

  3. Isn’t there a warning about trying to move the picker on the picker docs? Or has that been resolved?

  4. Yeah, I see what you mean! It seems that widget.newPickerWheel is using return true and something else to block any other touch actions. I can’t click anything behind it or trigger runtime events when clicking on it.

I think the runtime one should probably be filed as a bug, if you have a chance. Not a fan of that operation.

  1. There is a cheat, however.
    Step 1: Make a box (display.newRect) that is the same size and position as your pickerWheel.
    Step 2: box.isVisible = false
    Step 3: box.isHitTestable = true
    Step 4: Add the event listener to the box.

I just tried that and it seems to work. I’d highly recommend also adding the following for general management though:

local pickerGroup = display.newGroup() pickerGroup:insert(pickerWheel.view) pickerGroup:insert(box)

This way you can manage both objects at once and not lose track of the invisible box… (It also ensures the box is above the wheel, which is required for this all to work…) [import]uid: 41884 topic_id: 18639 reply_id: 71746[/import]