Cider -- interface builder / code generator

124»

Comments

  • BriarfoxBriarfox Mod
    edited April 2013 Posts: 1,542

    @aciolino All appears to be correct, I've recopied the cider controls and cider into new projects, same issue. @Jmv38 did you have any luck getting the callback working?

  • Jmv38Jmv38 Mod
    Posts: 3,297

    No i didnt. I am focused on recoding my own lib with classes and subclasses for the moment..

  • Posts: 1,255

    Sorry, I apparently typed over a line in this version.

    In CiderControls, go to the TextButton tab then find the touched function. Insert this line right above the line "return true."

    if self.callback ~= nil then self.callback() end
    
  • Posts: 666

    Lol - think that's what I typed earlier :)

  • BriarfoxBriarfox Mod
    Posts: 1,542

    Ahh I saw self.callback = callback or nil and checked it off :)

  • Posts: 1,255

    Forgot to mention one of my favorite things in this version. Drag a Dial onto the screen and check properties. You can automatically generate code tying the dial to Gravity or UserAcceleration.

    It's a simple thing, but expect more of this sort of option going forward.

  • Posts: 7

    aciolino - Great work on Cider. Where can we download the latest? Are we free to use it in our commerical apps? What license are you putting it under?

    Thanks

  • Posts: 666

    Ask @Mark about cider. I'm sure it's open.

  • Posts: 1,255

    Yes, absolutely. I'm just happy that someone finds some value.

  • Posts: 1,255

    With several articles pointing toward a more flat look for iOS7, immitating Apple's standard controls may actually become easier and require less code.

    As soon as we get a glimpse (which probably means waiting for WWDC) I'll update the Cider controls to better mimic the new direction.

  • Posts: 666

    From what I saw on some concept videos and know of the code underneath, I'd say that about 60% of the painful UI stuff written goes away.

    @Mark, it's likely that stripping a lot of the bezel stuff out of the existing Cider controls is all that will really be needed; most of the controls in Cider spend time doing bezels that would get removed.

    I might start next week on retooling the dials. I'm curious about the best design mechanism for the on/off switch.

    As plain as it appears, I'm actually pretty excited to see the iOS 7 UI.

  • edited April 2013 Posts: 37

    Hey, so I have a quick issue and I'm unsure as to why it is occurring.

    So basically I made my uhh GUI/Interface or w/e you want to call it with Cider, then I used Print Code. I copied all that code and placed it into a project.

    I then got the controls class and placed that in as well. All worked out fine.

    Then 10 minutes later I try it and I got all this crap on my screen that I didn't even get in the code.

    Basically what I added was:
    1 text box
    1 slider
    3 buttons

    When I run it now, I'm getting a box that says Text Boxes, and 4 text boxes inside of that.
    A box that says Switches, but nothing inide of that.
    Then a box that says buttons that has everything else in it, Left/Center/Right, slider, Button B, The other slider thing, and Icon Button.

    None of this extra crap was in my code so I don't understand why it is now all of the sudden popping up... :(

    Code:

    displayMode(FULLSCREEN)
    
    function setup()
    
    textBox1 = TextBox('Choose Your Color:', 400, 660, 640, 690)
    
    textBox1.fontSize = 26
    
    ColorSlider = NotchSlider('Red;Orange;Yellow;Green;Pink', 340, 540, 700, 650)
    
    button1 = TextButton('New Game', 120, 340, 360, 460)
    
    button1.fontSize = 26
    
    button2 = TextButton('Continue Game', 400, 340, 640, 460)
    
    button2.fontSize = 26
    
    button3 = TextButton('Information', 680, 340, 920, 460)
    
    button3.fontSize = 26
    
    end
    
    function draw()
    
    background(194, 194, 194, 255)
    
    textBox1:draw()
    
    ColorSider:draw()
    
    button1:draw()
    
    button2:draw()
    
    button3:draw()
    
    end
    
    
    function touched(touch)
    
    textBox1:touched(touch)
    
    ColorSlider:touched(touch)
    
    button1:touched(touch)
    
    button2:touched(touch)
    
    button3:touched(touch)
    
    end
    
    
    function keyboard(key)
    
    if CCActiveTextBox then
    
    CCActiveTextBox:acceptKey(key)
    
    end
    
    end
    

    Can someone help me with my issue?

    Edit: So the issue seems to be depending upon the order in which I have Frame and Main
    Frame has to go first for whatever reason. And I think the reason is because it is actually pasting over top of whatever Frame is creating

  • Posts: 1,255

    I think you copied the main tab out of CiderControls, which provides a sample of each control.

    You don't need to copy any of the controls into your project. Just put CiderControls into a project of their own, the. Touch the + in the upper right and add the controls project as a dependency.

  • Posts: 37

    But if I was to send the code to my friend
    How would he get the dependency?

  • Posts: 1,255

    Just load it as two projects and then add the dependency — it doesn't take a sec.

    If you want to put it all in one project, be sure to delete the main tab in CiderControls.

  • Posts: 2,051

    @Mark, how do you set up Cider?

  • Posts: 1,255

    @JakAttak First copy the Cider code into a project. Then create a second project and insert the code for CiderControls into that one.

    Once you have both projects, go into the Cider project, touch the "+" at the upper right of the screen, and look for CiderControls under the Dependencies list. Select it.

    Cider should now run as intended.

    You know, it occurs to me that it's high time I documented this thing!

  • edited May 2013 Posts: 2,051

    @Mark When I select Cider Controls under Dependencies, it says 0 imported tabs

  • Posts: 1,255

    Hmm. Take a look on the CiderControls project and make sure the Codie's there. There should be 20 tabs.

  • Posts: 2,051

    @Mark All the code is in one tab

  • edited May 2013 Posts: 1,255

    @jakAttack That's not going to work.

    Both Cider and CiderControls should import to multiple tabs. At the start of each tab, you should see the

    --#

    text that signals the start of a new tab.

    Cider Controls
    https://gist.github.com/devilstower/5384106

    Cider
    https://gist.github.com/devilstower/5384102

    Go to the Gist page and select the complete text. Then come back to Codea, create a new project and select "paste into project" when it pops up. It should properly distribute the text across tabs. I just gave it a try again and everything went fine.

  • edited May 2013 Posts: 2,051

    Edit: Nevermind, I found it and got it working, thank you. Cider is excellent

  • Posts: 18

    Ok, so I downloaded Cider 1.6 and Cider Controls 1.5 and have put everything nice and tidy on their own tabs.

    When I try to run Cider I get errors all the way through. Its very weird. Many times inheritance seems not to want to propagate properly. When different classes call self:width() or self:height() it pops out an Error. So I fixed some of those, and then self:roundRec() doesnt want to work either. Any ideas on what might be going on? Is there an easy fix?

  • Posts: 666

    My guess is tab order. Make sure frame and control classes are the first tabs.

  • Posts: 1,255

    Check to make sure that the first two tabs are Frame then Control. Everything else shouldn't really matter (I don't think).

  • Posts: 18

    Thanks! That was it. I had no idea that it mattered.

  • Posts: 1,255

    I'm reworking Cider's core controls to make them match the appearance of iOS 7.

    Unfortunately, this will mean that existing apps using Cider will probably need some tweaking. For example, the default font in Cider at this point is the Helvetica Neue in normal or bold, and the new version will be the light stroke. To make this clear with noSmooth(), I've increased the standard fontSize of controls from 16 to 20. This has the general effect of making many controls a bit larger than they were before.

    Additionally, plain TextButtons look a good deal different (borderless and without curved corners) and to make them look good in an iOS7 style app, they need to be a bit higher than the old variety.

    Switches have also changed a good deal. The text placement and appearance is considerably different, as is their reaction to scaling.

    The SelectList container, which can display either a "checklist" or "multi select" style group of items, has some new flexibility and now uses embedded Switch controls. Code using the old calls should still work, but the appearance and behavior are different in both large and subtle ways.

    TextBoxes suck as much as they ever did, I'm afraid.

    In any case, I'll have an update in a few days, but if you're well along with an app using the existing Cider controls, I'd suggest you keep them as is.

    As to that... is anyone using these controls? It would be nice to get some sense of how much (or little) they're being used. Thanks.

  • BriarfoxBriarfox Mod
    edited June 2013 Posts: 1,542

    @mark Update sounds great! I use these and love them. Codea not having a GUI makes it hard to develop non-games. I use Cider regularly to overcome this.

  • Posts: 140

    @Mark, I would love to see an update. I also use the controls regularly. In fact, I keep this discussion bookmarked. Moreover, I've seen cases, on this forum, where people referred back to this discussion. For instance, someone asked, "How do you make a checkbook?" Several people pointed to Cider. How do you make a Start button? How do you make a text box? Is there a way to make a user interface in Codea? Someone will usually post a link to Cider. Honestly, to do this stuff in Codea without it would be a pain in the butt. I think Cider definitely fills a major Codea capability gap.

  • IgnatzIgnatz Mod
    Posts: 5,396

    Cider needs to be prominent on the wiki. Mark, if you confirm the permanent link, with a description, I'm happy to add this unless someone else wants to do it.

  • Posts: 68

    Please update Cider!

  • Posts: 63

    I will have to agree with The above comments and would like to see Cider as a sample with Codea so it's available to everyone from the start, I would not been able to do the projects I have started without Cider. Thanks @Mark for all your hard work. Please keep it up.

  • Posts: 666

    I agree that Cider should be in the samples, event though the coding style might be different then most people chose. as a toolkit, though, it's fantastic. I wouldn't have been inspired without it.

  • Posts: 1,976

    Is there any way you could use saveProjectTab() to write the code into a tab, for easier copying, pasting, and importing, rather than printing it out in the console?

  • Posts: 1,255

    Thanks, folks. I'm on the road this week, but I'll keep at it.

    @SkyTheCoder the current version should use the tab. As you said, much easier (and you can just stop Cider and press run again to test your code).

  • edited July 2013 Posts: 391

    Got a problem here with a simple textBox and button setup. When the textBox is tapped, the callback function works perfectly fine, but when the button is pressed, the callback function is not getting called. Here is the main tab of my current project:

  • edited July 2013 Posts: 391
    -- Main
    
    supportedOrientations(LANDSCAPE_ANY)
    displayMode(FULLSCREEN)
    noSmooth()
    
    function setup()
        imageState = {}
        imageCount = 0
        loadImages()
    end
    
    function setup2()
        -- menu variables
        currentMenu = 1
        textBox1000 = TextBox('Text Box', 380, 520, 570, 570)
        button1001 = TextButton('Button', 380, 440, 570, 480, test_Clicked)
    end
    
    function test_Clicked()
        print(textBox1000.text)
    end
    
    function touched(touch)
        button1001:touched(touch)
        textBox1000:touched(touch)
    end
    
    function keyboard(key)
        if CCActiveTextBox then
            CCActiveTextBox:acceptKey(key)
        end
    end
    
    function orientationChanged(newOrientation)
    
    end
    
    function draw()
        if imageStatus ~= "Ready" and imageTable ~= nil then return end -- this line must be at the top of draw()
        background(0)
    
        if currentMenu ~= 0 then
            textBox1000:draw()
            button1001:draw()
        else
            drawMap()
        end
    end
    

    I removed some of the unnecessary code. I also removed the test_Clicked callback from the textBox because I know that works, but I don't need any callback there. I've tried renaming the callback to other names in the button and still no go. I can rename it in the textBox and it works as expected. Any advice?

  • edited July 2013 Posts: 391

    Ok, I got it working now. Looks like the textButton class was missing a line in the touched function. I added:

    if self.callback ~= nil then self.callback() end
    

    Now it works as expected.

    Edit: I should have just scrolled to the top of this page, I would've found the fix much quicker, lol.

  • Posts: 1

    Can anybody help me? How do I use Cider controls in codea?

  • Posts: 666

    @Kamlesh, start reading this thread from the top. Also, what version of Cider Controls? If you are using 7, there is a separate thread for that version.

Sign In or Register to comment.