Single Context Apps, Adding Views - Alloy

You must Login before you can answer or comment on any questions.

Hi guys,

Might sound like a broad subject, but it's really just one focus area. I have downloaded the - Codestrong Alloy app from GITHUB from here: https://github.com/appcelerator/Codestrong, and noticed it uses a drawer file to append new views to the page, somewhat like this:

Ti.App.fireEvent('app:open.drawer', {
    controller:'myPage'
});
Now the 'controller' refers to myPage.xml - And this opens fine.

How Can i however close the drawer from myPage.js? Currently the only way to close it us using the close method within the drawer.js file itself.

Thanks in advance

— asked 8 months ago by Peter Vahaviolos
2 Comments
  • can you please be more specific? Maybe reference the where the code is in the codestrong app?

    — commented 8 months ago by Aaron Saunders

  • Sure, sorry for the somewhat vague nature.

    If you look on this file (main.js) https://github.com/appcelerator/Codestrong/blob/master/app/controllers/main.js

    You will notice that it uses an array of drawers and from line 15 down, it creates a controller and adds the view to the window from the drawer file.

    The whole structure of this app depends on this loading order index > main > drawer (and then each page opens in a drawer)

    I like this approach, but don't know how to create custom header titles, add new buttons to the header and so forth (the Codestrong example only has a back button in a somewhat hardcoded header)

    My original question was how to close the drawer, because I thought I could work backwards from there. I guess I just have had a little trouble understanding how Views and controllers break context e.g. using $.container.parent.add etc

    — commented 8 months ago by Peter Vahaviolos

1 Answer

you need to fire the 'app:close.drawer' event for close the drawer:

with your case, just pass your controller name in it is ok:

Ti.App.fireEvent('app:close.drawer', {
            controller:'myPage'
        });
you can find the releate source code in header.js

— answered 7 months ago by Winson Qiu
answer permalink
1 Comment
  • sorry, seems i gave you a wrong answer, for close the drawer, you should call $.closeDrawer() within drawer.js :(

    — commented 7 months ago by Winson Qiu

Your Answer

Think you can help? Login to answer this question!