Add a single view to multiple windows

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

Hi all.

I have just learned that a view can only be added to 1 window add a time. I tried creating a view, and add it to two windows in a tabbed application. When i opened window 1 i saw the view. When i changed tab to window 2, the view has there also. Then when i swtiched back to window 1, the view was gone. I tried creating a button that added the view back to window 1, when the button was clicked. And what happened ? The view turned up on window 1 again and was gone from window2.

So! It is clear to me that a view can only belong to 1 window at a time. But why is this? What is the technical explaination to this?

Is there a pointer from all views to their parent window ? (or parent view for that matter in case of nested views)

Or do every window have pointers to all its views or a collection of views ??

Hope someone can explain this to me :)

Thanks

3 Answers

Accepted Answer

No offense, Nitin, but I don't think this is answering the question, and I'm not sure it's very good advice. You're mixing CommonJS and include, which serves only to make this topic even more confusing.

Yes, you could build a CommonJS module to create a view (a proper one that sets module.exports, unlike the code you've posted). You could then instantiate multiple objects from this module, and you could attach those views to as many windows as you want.

But that's not the question that Martin was asking. He's asking why a single view can't be attached to multiple windows. My answer: "Just Because". This is one of those things you have to accept at face value. As Martin is guessing, it probably has to do with all sorts of underlying bookkeeping that's going on, both inside Titanium, and inside the underlying native libraries.

But this shouldn't be a limitation in your app development. There's only one place where you might want to add a single view to more than one window, and that's when you're dealing with a MapView on android. You can only ever have one MapView in your app. So if you want it to show up in multiple windows, you need some clever coding to add/remove it from windows as appropriate.

You might be interested in the ManagedMapView module I built as part of the TitanUp library, which handles a lot of this adding/removing.

If you're dealing with other types of views, just create multiple instances of your views using CommonJS modules. The link I provided has lots of good info on using CommonJS properly with Titanium Mobile.

— answered 10 months ago by Jason Priebe
answer permalink
3 Comments
  • Thanks for the feedback :). Im writing a report about Titanium, so I would have liked to give a technical explaination to this issue, since i dont think my professor is gonna like the "Just because" statement ;). But again, thank you for your comment :)

    — commented 10 months ago by Martin Olsen

  • Your JSObject is proxied to a native object (ios or android).

    There are parent and child relationships at play here as well.

    — commented 10 months ago by Stephen Feather

  • It's basic physics. One object cannot be in two places at once. :)

    — commented 10 months ago by Shannon Hicks

Read more about here http://developer.appcelerator.com/question/140837/adding-same-view-in-two-different-parent-view

And the "technical" explanation is "Is like having the same cup of coffee on two tables in the same time" :)

Hi Martin,

Create one common.js file and put below code and call createViewForAllWindow and pass window in that function.

function createViewForAllWindow(win) {
    var viewAll = Ti.UI.createView({
        backgroundImage : 'view.png',
        width : 320,
        height : 44,
        top : 0
    });
//== set your height and width as per your requirement
    win.add(viewAll);
}
include common.js file and call this function in your window where you want to add view
Ti.include('common.js');
var viewObj = createViewForAllWindow(Ti.UI.currentWindow);
win.add(viewObj);

— answered 10 months ago by Nitin Chavda
answer permalink
2 Comments
  • Sorry i forgot to add one line.

    function createViewForAllWindow(win) {
        var viewAll = Ti.UI.createView({
            backgroundImage : 'view.png',
            width : 320,
            height : 44,
            top : 0
        });
    //== set your height and width as per your requirement
         return viewAll;
    }

    — commented 10 months ago by Nitin Chavda

  • -1 as incomplete, inaccurate posts like this only cause confusion within the community

    — commented 10 months ago by Stephen Feather

Your Answer

Think you can help? Login to answer this question!