Выбрать объект по идентификатору в Титаниуме

Как в Титаниуме выбрать объект по id?

Работая с Титаниумом, я создал представление с детьми. Я установил прослушиватель событий в родительском представлении, поэтому мне не нужно было создавать прослушиватель событий для каждого дочернего элемента. В прослушивателе событий я определяю, какое дочернее представление было нажато, используя e.source.id. Мне нужно изменить высоту представления при нажатии, а также изменить высоту предыдущего открытого представления. (Это все, чтобы показать активное представление со стилем подчеркивания.)

    var selectionView = Ti.UI.createView({
    title: 'Selection View',
    width: Ti.UI.Fill,
    left: 0,
    top: 0,
    backgroundColor: '#f5f5f5',
    layout: 'horizontal',
    height: 32,
    zIndex: 12
    });

    var selection_Type = Ti.UI.createView({
    title: "Type View",
    width: Ti.UI.Fill,
    layout: 'horizontal',
    backgroundColor: '#ABABAB',
    top: 0,
    height: 30
    });

Я не могу понять, как выбрать объект по имени идентификатора, чтобы я мог изменить его высоту.

//storing the id of the last clicked feed label so we can change it's height when it's no longer open
var feedSelector = 'selection_All';

selection_Type.addEventListener('click', function (e) {
Ti.API.info( ' ==== Select Destination Hit ==== '  + e.source.id);
if (e.source.id === feedSelector)   {
            //refresh the feed view
            Ti.API.info('Simulating feed refresh for...' + e.source.id);
        }
        else {
            //reducing active label height to simulatue 2px underline
            e.source.setHeight(28);

            //reset previous selected label height
            //here's the problem
            //i know how to do this in regular javascript/html
            //but I don't know how to access an object by it's id in Titanium

           //setting current label id in feedSelector so we can change it's height next time a button is clicked
           feedSelector = e.source.id;
           Ti.API.info('Changed value for feedSelector to...' + feedSelector);
}
        }
        }

        );

        var selection_All = Ti.UI.createLabel({
        id: 'selection_All',
        text: 'All',
        width: '14.9%',
        top: 0,
        center: 2,
        height: 28,
        backgroundColor: '#fff',
        textAlign: Titanium.UI.TEXT_ALIGNMENT_CENTER,
        color:'#073266',
        font:{fontFamily:'Trebuchet MS',fontSize:13}

        });

    var selection_Status = Ti.UI.createLabel({
        id: 'selection_Status',
        text: 'Status',
        width: '22%',
        top: 0,
        center: 0,
        height: 30,
        backgroundColor: '#fff',
        textAlign: Titanium.UI.TEXT_ALIGNMENT_CENTER,
        color:'#073266',
        font:{fontFamily:'Trebuchet MS',fontSize:13}
    });

    var selection_Article = Ti.UI.createLabel({
        id: 'selection_Article',
        text: 'Article',
        width: '23%',
        top: 0,
        center: 0,
        height: 30,
        backgroundColor: '#fff',
        textAlign: Titanium.UI.TEXT_ALIGNMENT_CENTER,
        color:'#073266',
        font:{fontFamily:'Trebuchet MS',fontSize:13}
    });

    var selection_Video = Ti.UI.createLabel({
        id: 'selection_Video',
        text: 'Video',
        width: '20%',
        top: 0,
        center: 0,
        height: 30,
        backgroundColor: '#fff',
        textAlign: Titanium.UI.TEXT_ALIGNMENT_CENTER,
        color:'#073266',
        font:{fontFamily:'Trebuchet MS',fontSize:13}
    });

    var selection_Audio = Ti.UI.createLabel({
        id: 'selection_Audio',
        text: 'Audio',
        width: '20%',
        top: 0,
        center: 0,
        height: 30,
        backgroundColor: '#fff',
        textAlign: Titanium.UI.TEXT_ALIGNMENT_CENTER,
        color:'#073266',
        font:{fontFamily:'Trebuchet MS',fontSize:13}
    });

    //creating selection type container and adding selection types
    selection_Type.add(selection_All);
    selection_Type.add(selection_Status);
    selection_Type.add(selection_Article);
    selection_Type.add(selection_Video);
    selection_Type.add(selection_Audio);
    selectionView.add(selection_Type);

Изменить: я выполнил то, что мне нужно было сделать, используя оператор switch, но было бы намного чище, если бы я мог получить объект по его идентификатору.

var feedSelector = 'selection_All';

selection_Type.addEventListener('click', function (e) {
Ti.API.info( ' ==== Select Destination Hit ==== '  + e.source.id);
if (e.source.id === feedSelector)   {
    //refresh the feed view if the feed is open and button is clicked
    //Ti.API.info('Simulating feed refresh for...' + e.source.id);
    alert('Refreshing feed');
}
else {
    //reducing active label height to simulatue 2px underline
    e.source.setHeight(28);
    switch (feedSelector)   {
        case 'selection_All':
            selection_All.setHeight(30);
            break;
        case 'selection_Status':
            selection_Status.setHeight(30);
            break;
        case 'selection_Article':
            selection_Article.setHeight(30);
            break;
        case 'selection_Video':
            selection_Video.setHeight(30);
            break;
        case 'selection_Audio':
            selection_Audio.setHeight(30);
            break;
    }

    feedSelector = e.source.id;
    Ti.API.info('Changed value for feedSelector to...' + feedSelector);
}
}

);


person TDave00    schedule 25.06.2014    source источник
comment
Если вы используете Titanium Studio, просто отладьте событие щелчка и проверьте объект события. В точках останова перейдите на вкладку Expressions, введите объект события e и проверьте его. Вероятно, элемент пользовательского интерфейса присутствует как свойство.   -  person kidwon    schedule 25.06.2014
comment
Я выполнил то, что мне было нужно, используя оператор switch. Это сработало, потому что в представлении было только пять объектов, которые мне нужно было изменить, но я до сих пор не знаю, как получить объект по его идентификатору.   -  person TDave00    schedule 25.06.2014


Ответы (1)


Если вы используете Titanium Studio, просто выполните отладку события click и проверьте объект события. В точках останова перейдите на вкладку Выражения, введите объект события e и проверьте его. Вероятно, элемент пользовательского интерфейса присутствует как свойство.

Другой способ:

var labelStore = {};


function createLabel(props){
   var label = Ti.UI.createLabel(props);
   labelStore[props.id] = label;

   return label;
}

function getLabelById(id){
   return labelStore[id];
}


var selection_Status = createLabel({
    id: 'selection_Status',
    ...
});

а затем при нажатии

var id = e.source.id;
var label = getLabelById(id);

.... Делайте то, что вы должны делать с лейблом

person kidwon    schedule 25.06.2014
comment
Разве нет эквивалента getObjectbyId(feedSelector), как в обычном javascript? - person TDave00; 25.06.2014
comment
Вы имеете в виду, как в API браузера DOM, а не в javascript вообще. Только если вы используете платформу Alloy и работаете с XML-документом. Я еще не встречал такой части в таком сценарии, но вы можете проверить документацию Titanium. - person kidwon; 26.06.2014