Widget 2.0 is here! Bam!

Widget 2.0 is here! Bam!

It’s here! We rewrote Corona’s widget library from the ground up and it’s now available in Daily Build 1034.

IMPORTANT: Please refer to the updated documentation that accompanies each Daily Build. Several things have changed or have been renamed, so you should study it carefully. To assist you, we have included a Migration Guide, also bundled with the documentation in the applicable Daily Builds.

(Side note: There was a little snafu with the 1034’s Daily Build API docs. It’s now fixed!)

Features and Improvements

The most important thing we did was decide to start from scratch, which was critical in building a stable, rock-solid foundation. As a result, Widget 2.0 will be easier to extend and much more maintainable. (More on the woes of the 1.0 code, and a surprise, at the end.)

One of the major changes was integrating the notion of image sheets. The old widget library didn’t fully embrace image sheets, so in order to create a theme, you’d have to have a bunch of individual image files. It was a mess!

With the new widget library, we’ve fully embraced image sheets. Widget themes are now constructed with imageSheets to conserve texture memory and disk space.

In addition, we decided to ship an iOS theme and an Android theme. That means you no longer have to copy over extra widget asset files into your project. We always felt that was a little clumsy, especially when you realize that the widget framework was incomplete without those image assets. Now when you build for iOS, we pre-bake in the iOS image assets. And similarly, for Android.

We also added a ton of other features. Here are several examples to give you an idea of how much TLC we put into this:

  • Ability to create a 9-slice widget button.
  • Vertical sliders can now also be created, along with the previous horizontal sliders.
  • Widget buttons can now have their labels aligned to one of three constants via the new “labelAlign” property.
  • Vastly improved widget documentation.
  • Unified API naming conventions across the board.
  • Ability to be able to graphically theme a tab bar, (previously only gradients were supported).
  • Built-in ability to disable a widget button from receiving touch events, which is useful for login screens etc.
  • Built-in ability to insert widget buttons into a scrollView.

Bugs fixed

The code re-architecting of widgets allowed us to address a huge number of bugs:

  • 18143: Corona Docs Feedback – Add visuals, especially for widgets and UI items.
  • 18217: widget.newTableView category rolls do not scroll off the top of the form with the rows.
  • 18496: Missing widget documentation for switches, etc.
  • 18503: widget.newProgressView does not have correct referencePoint.
  • 18505: widget.newProgressView default value cannot reached or measured.
  • 18528: Segmented Control missing from the docs.
  • 18537: widget.newStepper() reference point is incorrect.
  • 18538: widget.newStepper() behaves strangely if moved after creation.
  • 18975: widget.newButton’s inside a scrollView widget, the events malfunction.
  • 19004, 19030: widget.newTableView() – hideBackground incorrect description.
  • 20003: On-Off switch widget fails on double-taps if onRelease method removes the switch.
  • 20341: Incorrect widget.newSpinner() imageSheet documentation.
  • 20462: widget.newTableView() documentation referencing depreciated APIs.
  • 20601: widget.newProgressView() is not documented.
  • 16094: widget.tableView:scrollToY / scrollToIndex etc. don’t take in account topPadding
  • 12749: widget.newSlider rotates visually, but ignores rotation functionally (we added the ability to * create vertical sliders).
  • 19031: Button Widget Bugs.
  • 18720: bottomPadding does not work on scrollview widget.
  • 20583: “release” and “moved” events not triggered by onEvent in a button in ScrollView.
  • 20468: Moved event phase not occurring in objects that are inside a scrollView.
  • 18750: ScrollView in Simulator goes way out of bounds.
  • 15112: widget.newTableView displayed on top of another widget.newTableView both are getting touch events*.
  • 15857: TableView rows dont scroll smoothly / “shake” on borders.
  • 18457: Problem on TableView function scrollToIndex on new CoronaSDK.2012.942.
  • 18778: Feature request: Scoll-event in tableview widget.
  • 19570: widget.tabbar button autospacing adds unnecessary padding.
  • 18886: Slider widget doesn’t return event phase.

Migrating from widget 1.0

Now, if you are migrating from widget 1.0, you’ll need to be aware that we made some API changes.

In the latest daily build docs, there is a migration guide linked from the top of the widget library index that tells you how to go about updating your code to take full advantage of widget 2.0.

The short story is you should pay attention to the following APIs:

  • widget.newButton()
  • widget.newPickerWheel()
  • widget.newScrollView()
  • widget.newTabBar()
  • widget.newTableView()

In the migration guide, we show you side-by-side examples of what the code looked like before and after so that your transition will be as painless as possible.

Known Issues

Of course, no release is perfect. Here are the issues we’re already looking into:

  • TableView categories currently don’t push each other on/off screen.
  • TableView’s/ScrollView’s are missing scroll bars.
  • Grouping of radio buttons.
  • Adding the Tab Bar to the default widget themes.
  • WidgetDemo doesn’t look quite right on Android-based devices due to bad math related to status bar height.

One more thing…

We realize that some of you may be close to shipping or are unable to deal with the various widget 2.0 API changes. Therefore, we are open sourcing Widget 1.0 code today!

The Corona Widget 1.0 sources are now available on GitHub.

This lets you use the old widget library (even though we think you’re better off using Widget 2.0). Just download ‘widget-v1.lua’ from GitHub and put the following line at the top of each Lua file that’s using widgets:

local widget = require "widget-v1"

To tell you the truth, we look at the Widget 1.0 code and feel embarrassed by it – we even debated whether or not we should release this code to you. However, I felt it was important to get this into your hands for exactly the reason I mentioned above — to minimize disruptions to those of you trying to ship apps.

Now with that said, I also had to appease our engineering team’s sense of pride. So if you go to GitHub, you’ll see the following disclaimer in the ‘Readme’ file:


We should warn you that this code is very spaghetti-like. It’s not clean and is highly unmaintainable. It is really an anti-pattern for any budding framework writer. When you read this code, you should see right away why we struggled so much to maintain the old widget code, and why we ultimately decided to rewrite the widget library.

* * *

As I alluded to yesterday, we have been working on a ton of stuff. This is just the first of many “2.0” items that we’re shipping to you!

walter
63 Comments
  • IcySpark
    Posted at 18:41h, 22 February

    Built-in ability to insert widget buttons into a scrollView.

    How do you go about this, as I’m having problems getting this working, as the button wont release the focus back to the scrollView.

    • danny
      Posted at 19:17h, 22 February

      Hey IcySpark.

      are you using multi-touch in your app?

  • Naomi
    Posted at 19:28h, 22 February

    Thank you, Walter, for the detailed info about widget v2.0. I also appreciate you posting the link to widget v1.0 with disclaimer. I decided to drop back to 1030 due to one issue (which is v2.0’s inability to dynamically set/change the onRelease property of widget buttons). Even though I’d like to be able to try out latest changes and fixes being made to new daily builds, I’ll probably stay with daily build 1030 for now. I just hope by the time I really need to use more recent build, additional fixes and updates are made to widget v2.0 so that, perhaps, I don’t have to require widget v1.0 after all. At least I now know that I can use the fall back if I needed it.

    Thanks again.

  • Mike M
    Posted at 22:12h, 22 February

    Are widgets like tableView now working with storyboard effects?

  • Mike M
    Posted at 22:28h, 22 February

    One more thing…

    It was intended that the new tableView will support the possibility to rerender the hole tableView (it was told me as a response to a bug report) . But I didn’t found the method. Is there a undocumented feature?

    Thanks.

    • danny
      Posted at 15:38h, 25 February

      Hey Mike, sorry for the late reply. I missed your question.

      Can you elaborate on your request. My main questions:

      1) What is the use case for re-rendering the whole tableView?
      2) What exactly would be re-rendered?
      3) By re-rendering do you mean that the tableView should be destroyed and recreated?

      I just want to better understand what your intentions for this request are.
      Thanks!

      • Mike M
        Posted at 06:07h, 27 February

        The use case is to add a button to every row of the tableView if a edit-button in the toolbar has been hit. In my case if you hit an entry of the tableview, you come to the normal content. If you press the edit button, you will come in an edit mode of each entry. Like the edit button at the iOS phonebook recents list.

        Should possibly work like this:

        local list — the tableView
        local flag

        local function buttonHandler(event) –toolBarButton Handler
        flag = true
        list.reRender
        end

        local function onRowRender(event)
        if flag then
        — put something new in the row
        end
        end

        Hope that makes clear what I mean, my english is not the best, cause Im german. Thanks for looking into that.

        • danny
          Posted at 09:19h, 27 February

          Hey Mike.

          I understand what you want to do now. I will try and get this ability added asap.

          Thanks!

          • Mike M
            Posted at 23:31h, 27 February

            I’m looking forward to it. thanks!

          • ShivaP
            Posted at 10:46h, 28 February

            Yes, I need something like this too. Right now I have to delete all the rows and add them again. Ability to re-render all rows or a subset of them would be very helpful.

  • open768
    Posted at 02:29h, 23 February

    Hah like the spaghetti warning disclaimer! Happens everywhere, though game coders typically sacrifice structure and maintainability for speed – and speed of execution and speed to market is usually more important. Maybe you guys can post coding standards out of all this to help others learn.

  • Mitaten
    Posted at 02:48h, 23 February

    How is the performance of the new widgets compared to the old ones? Is it worth migrating to if you don’t need any of the new stuff?

    Awesome nonetheless 🙂

  • IcySpark
    Posted at 03:10h, 23 February

    @Danny No multitouch.

    I just had a look at the button tables when printed and noticed this:

    _insertedIntoScrollView false

    What does this do? And how do we access it?

    • danny
      Posted at 04:25h, 23 February

      Hey IcySpark.

      I don’t recommend modifying any widget properties that are prefixed with an underscore “_”.

      They are all handled internally and modifying them yourself could lead to unexpected bugs.

      That being said, I haven’t seen the issue you mentioned with buttons not releasing focus back to the scrollView. I will take a look, in the meantime if you wouldn’t mind posting a bug so I can keep track of it here: http://developer.coronalabs.com/content/bug-submission

      Thanks

  • Brian Burton
    Posted at 16:45h, 23 February

    Perfect timing Walter! I was just getting ready to write the widgets chapter of my new book!
    Thanks to you and the Corona Labs team for such great features and big improvements!

  • Francisco
    Posted at 01:47h, 24 February

    I would like to know how to create a custom theme using Widgets 2.0, because right now there is not any example inside the WidgetDemo project.

    Inside the API you can read: “See the WidgetDemo sample to see how a theme file is structured and can used in a real app.” That’s OK but I can’t find that sample. I use Widgets 1.0 with a custom theme and it would be cool to know how is done with 2.0 too.

    Cheers!

  • Jack01
    Posted at 05:43h, 24 February

    Where exactly are the docs / guide for Widget 2.0 to be found? I downloaded 1035 but the only thing I can find is the samplecode.

  • Jack01
    Posted at 05:48h, 24 February

    Aaah ok a zip of the docs can be downloaded at https://developer.coronalabs.com/downloads/daily-builds

  • Alex M
    Posted at 22:12h, 24 February

    Wow walter, as the CTO, CEO or whatever you are now, you sure have a way with words. First as the former CTO and now CEO what does this say about you when you talk about your own code calling it embarrassing, especially when widgets was something that came after beta and not an early rushed addition to corona? It is nice to see how you deliberately go out of your way to belittle your own teams work. What is it to imply that 2.0 is not spaghetti code or anti-pattern when it is clearly completely broken, look at all the complaints, it might be the most broken thing you have ever released.
    You might as well call the code and your team worthless.

    • Walter
      Posted at 22:37h, 24 February

      Alex, what’s with all the anger? That leads to the dark side!

      All products I’ve worked on (e.g. Adobe Illustrator, Apple’s pre-Cocoa-ified Final Cut Pro, Macromedia Flash, etc) have had their fair share of unsavory bits – code that nobody wants to touch, especially when the original author has moved on.

      I’ve heard similar horror stories about other famous products as well.

      For us, the big difference is (a) we’re releasing it for the benefit of those who need to continue to code against the old version and (b) we’re being very matter of fact about the quality of the 1.0 code – I’d be more worried if we didn’t have the self-awareness to say so!

      • Alex M
        Posted at 00:15h, 25 February

        Anger? Walter clearly Adobe or Apple any company that you have had the privilege to work for has never opened up their source code and called it spaghetti code, or anti-pattern, which is just an indirect way of saying they have bad programmers.

        If your releasing it for the benefit of those who need to keep going with the old version it was not needed for you as CEO/CTO and leader of the company to stoop so low and almost directly call your subordinates incompetent, even if it’s someone who left your company and ‘moved on’ as you say.

        You could have mentioned it and moved on but blaming budding programmers makes it sound like you are failing as a leader. No wonder so many staff have left your company, if you blame them all like this it’s just poor leadership.

        • Rob
          Posted at 00:38h, 25 February

          @Alex M; who said this code wasn’t developed by Walter himself? You seem to have info about who coded this, as you refer to them as “budding programmer”?
          Care to share?

          • Alex M
            Posted at 16:16h, 25 February

            @Rob, I suppose you didn’t read. Walter said explicitly it was the code of someone who had moved on and the term ‘budding programmers’ you highlighted comes from his own readme file, hence the quotation marks. wowow.com? Nice, hiding behind a fake url.
            @Dean, some of us get stuck using corona because we are so far into a project we can’t simply abandon it when we realize how bad the SDK actually is, or we have apps that require updates in the meantime even if we are working on porting them. I notice you get your panties in a bunch with me but look at all the negative comments, you don’t have a fit when others talk about the countless bugs and issues they face. All I can say is a leader would have taken responsibility and not blamed others, especially those who left. It makes the whole thing completely unsavoury and if you took time to read the other comments before jumping on me you’d see others have issues too, whether they sugarcoat them or not.

        • IcySpark
          Posted at 04:14h, 25 February

          Alex, I think you are being overly harsh. Yes there are issues with widget v2, but they can be worked around and will be fixed in time. Also even apple release buggy iOS updates that have been tested rigorously, so please give these guys a break. They could have left the widgets the way they were, but instead are trying to improve them for everyones benefit.

        • Walter
          Posted at 19:08h, 25 February

          Alex, the Readme statement was a warning to the community. We don’t think these are best practices, so anyone who wants to write one should view this with that in mind.

          Also, my point was that spaghetti code happens all the time, even on products we all love. It’s not supposed to be an indictment. The key is to recognize what to do about it, which is what we are doing.

          Anyway, I can see that something deep is bothering you. Let’s chat about it offline and see if we can figure it out. My e-mail is walter at coronalabs

        • Rob
          Posted at 21:31h, 25 February

          Actually Alex you are wrong, Walter referred to “any budding framework writer” in respect to someone taking the current 1.0 to learn from or build on, and not as you say was describing the developer of the widget 1.0.
          Wow seems like I ruffled your feather that you checked the link? Whats your link?

    • Dean
      Posted at 23:51h, 24 February

      Sweet another Alex M masterful post to enjoy this evening.
      Actually this time I am going to resist the urge to be sarcastic and just ask an honest question, and I wish deep Deep inside that you would honor me with a reply.

      What do you get out of just going out of your way to bash everything that Corona does? I have not read a single post from you that isn’t totally negativity and under handed remarks.

      I mean if you don’t like the product so much why don’t you just go somewhere else? Do you really have that much time on your hand?
      What do you expect to achieve out of this?

      If your intention is to discredit Corona, I am afraid that this is not working, because without doubt everyone here (with the exception of one other, you know who you are) totally ignores what you say or considers it total nonsense.

      I think we all appreciate constructive comments, even a few digs at Corona here and there, but your systematic bashing is neither useful nor constructive.

      Can you give us some insight?

  • Master Preenz
    Posted at 00:31h, 25 February

    I have installed the daily build and it was nice BUT when I tried to use widget.newButton() and set default and over parameters with image, no image appears.

    • danny
      Posted at 17:11h, 25 February

      Please consult the latest daily build docs.

      Some parameters have changed as have some methods for various widgets.

      default => defaultFile
      over => overFIle

      Thanks!

  • Jack01
    Posted at 02:21h, 25 February

    “In addition, we decided to ship an iOS theme and an Android theme. ” Ok, but what is exactly in those shipped themes, any documentation about that? Or how to make your own theme?

    • IcySpark
      Posted at 04:08h, 25 February

      I’m sure one of Corona’s tutorials will soon explain how to do this hopefully. Im thankful for CoronaLabs releasing the source code of widget v1 as it allows us to still use it with the new daily builds, so cudos for that

  • danny
    Posted at 04:47h, 25 February

    AlexM: Saying widgets 2.0 is completely broken is an extremist statement. There have been a handful of minor bugs reported and one missing method, no show stopping issues have been reported thus far.

    @Jack01:

    I am aiming to have a guide made this week that explains how to create your own widget themes and what is contained in the default widget themes that we now provide.

    Thanks for your patience!

  • Mike M
    Posted at 07:32h, 25 February

    I also dont’t understand why v2 is already released (with a “BAM!”) with all that bugs. And essential features are apparent not included at all, even though they where often requested by users and promised with the update. And my requests referring to this above are not even answered.

    • danny
      Posted at 15:39h, 25 February

      Mike, sorry about missing your question.

      Please see my reply to your question above.

  • Jack01
    Posted at 08:27h, 25 February

    @danny, allright thx for your reaction and efforts.

  • Francisco
    Posted at 11:04h, 25 February

    @danny yeah thanks for your efforts! I personally can’t wait to read that guide, because using my own theme is essential for my app! hehe 😉

    I would want to add that I’m happy to be able to continue using widgets 1.0 in the meantime, thx for that detail guys!

  • Pezzolo
    Posted at 14:58h, 25 February

    I’ve got over 40 applications that use your widget.
    And they won’t work with your new widget version.

    What I’m looking for is a way to have the old “widget” to be called as require “widget” and the widget v2.0 to be required as require “widget2”. Is that possible?

    • Walter
      Posted at 11:17h, 26 February

      Yes, you can do that super easily. See bottom of the blog post. Just include widget-v1.lua in your project and then replace all ‘require “widget”‘ calls with: local widget = require “widget-v1”.

  • Joris Verschoor
    Posted at 00:53h, 26 February

    Sorry.. Moved on.. Too little too late.
    Find me at moai and cocos2d

    • David Rangel
      Posted at 15:50h, 26 February

      Joris – sorry to hear that. But thanks for reading and hopefully we will have you back in the not too distant future.

      David

  • danny
    Posted at 12:40h, 26 February

    Just an update for everyone.

    The majority of bugs and issues people have brought up thus far have been fixed and the fixes will be available in the next daily build.

    Thanks

  • Jordan Schuetz
    Posted at 13:20h, 26 February

    This will be nice! Thanks for the new library. It’s awesome that it’s for Android too….but was this really necessary “It is really an anti-pattern for any budding framework writer”. LOL your calling your engineers out!

    • Walter
      Posted at 13:33h, 26 February

      Thanks! Goal was to warn (see above). Also motivated us to rewrite for widget 2.0 🙂

  • Aaron Isaksen
    Posted at 14:20h, 26 February

    where is the migration guide in the daily docs? I can’t find it.

    • danny
      Posted at 02:52h, 27 February

      If you look under the widget* section you should see “V2.0 Migration Guide”.

      Or alternatively scroll down to the bottom of the api index page and you will see it there.

  • Norvin Altamirano
    Posted at 22:56h, 26 February

    Hey, I’m implementing own buttons and I need the ability to take focus in a scroll view. How are you going to support that? I mean you’re forcing us to use the widget buttons right? I can’t find anything related to this and no answer to first posted question.

    • Norvin Altamirano
      Posted at 23:54h, 26 February

      Never mind, I’ve fixed it. just created a takeFocus implementation for the use of others just call the code previously present on v1:

      display.getCurrentStage():setFocus( nil )
      target.isFocus = false

      — set event.target to scrollView and start back at “began” phase
      event.target = self._scrollView._view
      event.phase = “began”
      self._scrollView._view.touch( self._scrollView._view, event )

      I hope it’s helpful for someone.

      • yhx
        Posted at 00:14h, 12 April

        very nice!
        thanks!

  • Mike M
    Posted at 06:09h, 27 February

    Thanks danny for the reply. I answered your questions above.

  • mick
    Posted at 19:43h, 27 February

    When will this be release for free version ?

    • Ross
      Posted at 13:23h, 08 March

      Yes, For those of us evaluating if Corona could actually be used for a business app (and the current widget library leads me to say only if you want to a lot of work arounds), when can we put 2.0 to the test? High Hopes for 2.0!

  • Daniel
    Posted at 20:22h, 27 February

    My old widgets are no longer working with the new widgets, I recompiled but it didn’t work. Can you please post an example of how it should work or some other tutorial because the Tuesday tutorial also doesn’t work like others said in the comments there already.

  • Robert de Boer
    Posted at 21:05h, 27 February

    @Joris
    If you moved on, why are you still hanging around here lol.

    You know you love Corona! The grass isn’t always greener on the other side 🙂

    Dutch greetings 🙂

  • ShivaP
    Posted at 10:51h, 28 February

    Thanks for this. I am close to release my new app. The question I have is if I am using build 1025 then do I still need to add the require widget-v1 or is that step applicable on build 1034 and newer?

  • Dougi
    Posted at 02:25h, 01 March

    Great new widgets. However, just ran the widget demo on my HTC sensation Android phone to test it and the widget.newTableView() is still really unresponsive. I’ve had loads of feedback from users about it being unusable.

    You have to press for a really long time for the item selection to work.

    Am I doing something wrong or is this bug?

    I also found an issue with the picker wheel. Using storyboard I created a picker wheel, then slide it off screen, then click on the backbutton to open another storyboard scene and the app bombs out.

    Thank you very much for these great new widgets. They will make life a LOT easier.

    • Winicius Siqueira
      Posted at 19:23h, 04 March

      This is true. The rows on the widget.newTableView() takes a few seconds to respond.

      Any daily build software (or experimental software, if you are familiar with Debian) is usually buggy and is waiting for the community to test and report bugs. I tried daily build 1041 and I was not satisfied with the widgets because the demo that showcased it was laggy. I’m sure once the bugs are removed it will be a pleasant experience to use and develop with.

      Thanks Corona Labs.

  • JCH_APPLE
    Posted at 09:50h, 18 March

    Any way to re-enable “tabBar:deselectAll()”

    Or just disable 1 button in a tabBar ? setSelected allow to select but how to “unselect” ?

  • Paul
    Posted at 14:28h, 27 March

    Don’t suppose there’s any plans to support ARMV6 for Android? I’d come on board if there was!

  • stuart warren
    Posted at 08:17h, 28 March

    Has anyone documented the button theme functionality?

    If you follow the examples, and then add a theme, it blows up. Apparently, the themes override what you tell it in the code, or enable / disable certain features.

    I feel like a mouse in a maze with documentation that does not match the code I am running, code that does not run reliably, and minimal tech support. When I cold boot my machine and run a minimal stub code app from the simulator, it first thinks it is running on a Droid, then it shuts down and starts back up as an iPad as it was initially supposed to do. so far I don’t have enough confidence in Corona to release an app to the public.

    In the docs, there is no easy way to go back up, once you drill down. The see-also fields are almost never used, and most of it is written for people who don’t need docs.

    When a coder makes a change that changes the docs, they should define the changes so docs appear when the code does. There is very little value in releasing code in advance of the docs that describes it. every coder should be responsible for making sure the docs work as described with their code, and sit with the writer to make the two meet.

  • Paulo
    Posted at 12:35h, 03 April

    Is there a way to dynamically change the defaultFile/overFile option?

    I just want to create a button to switch on/off the music theme. But I’d like to use my own images, there are 4, mute default-ON/OFF and over-ON/OFF.

  • Peter Chen
    Posted at 07:37h, 17 May

    When I apply the widget-v1, I found the widget.newSpinner is not included in the library. So could you update the widget-v1? Thanks very much.

  • Peter Chen
    Posted at 07:39h, 17 May

    When I applied the widget-v1.lua, I found widget.newSpinner is not available within this program. Could you help us to update this code? Thanks very much.