UI - Getting a control's parent / Setting custom properties?

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

Hi folks,

i need to dynamically create components for displaying data with a given structure loaded from a webservice. By tapping on a smaller preview container (within a list) the user shall be directed to a detailed view. I've tried to solve this by creating a UI.View with some static children (Labels, ImageView) as the preview adding a click-listener to the View. But as in JavaScript the event.source will be the lowest control clicked I can't figure out how to get the actual view corresponding to the child being clicked as neither the controls have a "parent" property nor can I add a custom parent-property to them (or any other custom data), tested on AndroidVD 2.2. My research using Google didn't lead to any results, but maybe i'm just overseeing something so any help would be appreciated.

Best regards from germany

--Thiemo

5 Answers

Accepted Answer

why not use the getParent() function to get the controls parent? Unless I am missing something here

var win = Ti.UI.createWindow({ special:'this is special var'});
var myLabel = Ti.UI.createLabel({text:'child label'});
win.add(myLabel);
Ti.API.log( "parent special code: "+myLabel.getParent().special);

— answered 2 years ago by Aaron Saunders
answer permalink
1 Comment
  • Maybe because the getParent() method is not documented and most of us have no idea it exists? Is it supported on all objects? Both iOS and android (and Blackberry)?

    — commented 2 years ago by Doug Handy

>...neither the controls have a "parent" property nor can I add a custom parent-property to them (or any other custom data)...

I add custom properties to objects all the time, including sometimes tracking the parent object. Prior to SDK 1.5.0, I actually used the name "parent" but that evidently created an internal name collision on window objects. So I switched to "_parent" instead.

Without code, we are shooting in the dark to guess why you can't add custom properties to an object. Anytime you name something which is not a predefined property name, it should be just adding a custom property for you. But there are cases where there are properties not listed in the docs, and at SDK 1.5.0 or higher, "parent" is such a case for certain objects. So make sure you use a name that is unique.

The following is just keyed into the reply so is untested, but should give you the basic idea of something to help you get started.

var myWin = Ti.UI.createWindow({ title: "Demo" });
var myView = Ti.UI.createView({ _parent: myWin });
myWin.add(myView);
var myLabel = Ti.UI.createLabel({ _parent: myView });
myView.add(myLabel);
 
Ti.API.info('Parent of label is ' + myLabel._parent);
Ti.API.info('Parent of view is ' + myView._parent);
Ti.API.info('Window title is ' + myLabel._parent._parent.title);

Thiemo

When you create your loop that creates each view and child view that present your data on the screen, you can create custom properties in any of those objects and reference them later. See Programmatic row creation with Titanium Views and note the custom properties like temp_f, temp_c etc.

Then, note in the The Finished Weather App the click event that swaps the two units of temperature (ie in thisLabelTemp.addEventListener('click', function()).

These custom properties can hold identifiers for parent or child objects, in the form of an array index or even the respective object reference.

It's a bit complicated to explain, but hopefully the code examples will help.

Thank you for your quick replies!

I actually thought that this was rather a general problem, so i didn't give the source code in my previous post, but here we go (stripped down to the relevant part):

var controls        = {};
controls.eid        = event.eid;
controls.view       = Ti.UI.createView( {
    height              : me.ui.data.event_view_height,
    width               : me.ui.data.event_view_width,
    backgroundColor     : '#000',
    top                 : index * (me.ui.data.event_view_height+5),
    eid                 : event.eid
} );
controls.view.addEventListener( 'click', function(e) {
    var target  = e.source;
    if( "m_pParent" in target )
        target  = target.m_pParent;
    else
        me.tools.dbglog( e.source + " not having property m_pParent" );
 
    me.tools.dbglog( "event: "+target.eid+" ("+target+")" );
} );
controls.icon       = Titanium.UI.createImageView( {
    height      : 32,
    width       : 32,
    left        : 9,
    top         : 9,
    image       : me.constant.EVENT_ICON_FOLDER + event.icon,
    m_pParent   : controls.view
} );
[...]
controls.view.add( controls.icon );
return controls;
To explain it: This code is at the beginning of function to be called whenever i need another preview. The function receives the arguments "event" and "index" used to define some basic properties. As you can see i'm passing "m_pParent" to the ImageView to link to the nesting View. Within the click-function i try to check whether m_pParent exists or the view has been clicked directly. Against my expectations the output is showing the following:
[INFO] [13,85293] [I] ti.modules.titanium.ui.ImageViewProxy@43e896b8 not having property m_pParent
[INFO] [197,85490] [I] event: null (ti.modules.titanium.ui.ImageViewProxy@43e896b8)
i.e. my ImageView doesn't have the m_pParent defined. Am i just missing something here?

--Thiemo

Try replacing:

if( "m_pParent" in target )

with

if ( target.hasOwnProperty('m_pParent' ))

and see what happens.

Your Answer

Think you can help? Login to answer this question!