Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-19158] iOS: Slider and Switch controls cannot be updated in ListView with updateItemAt()

GitHub Issuen/a
TypeBug
PriorityNone
StatusOpen
ResolutionUnresolved
Affected Version/sn/a
Fix Version/sn/a
ComponentsiOS
Labelsalloy, ios, listview, slider, switch, updateItemAt
ReporterEd
AssigneeUnknown
Created2015-07-02T17:28:45.000+0000
Updated2018-02-28T19:55:15.000+0000

Description

I have some forms created with ListViews that use sliders and toggles. I am able to programmatically update items in the ListView either with the standard template and custom templates, but this fails when I try to update custom template items with a slider or switch control. To demonstrate the problem, I'm including sample code that shows the two controls in a ListView and two "reset" buttons that reset the slider and switch to default values with and without animation. I noticed the effect with and without animation is different. Without animation, the reset works the first time is done, but fails thereafter. With animation, it works at times, then it starts failing leaving the two controls in a strange state (not the value set by the user, nor the default value the reset applies) Expected behavior: ListSection.updateItemAt() should update the Switch and Slider controls with the set values (Slider = 1, Switch = off), and render them properly regardless of the animation setting, and how many times the row is updated. Also note how slider:value="75" is defined for the slider in the Alloy XML, yet it is not applied to the slider when rendered at startup.
<Alloy>
	<Window backgroundColor="#ffffff">
        <Button id="reset1" top="70" left="20" title="Reset w/o Anim" onClick="reset_onClick" />
        <Button id="reset2" top="70" right="20" title="Reset with Anim" onClick="reset_onClick" />
        <ListView top="150">
            <Templates>
                <ItemTemplate name="tSlider">
                    <Label id="slider_title" bindId="title" />
                    <Slider id="slider" bindId="slider" />
                </ItemTemplate>
                <ItemTemplate id="tSwitch" name="tSwitch">
                    <Label id="switch_title" bindId="title" />
                    <Switch id="toggle" bindId="toggle" />
                </ItemTemplate>
            </Templates>
            <ListSection id="ls" headerTitle="FORM">
                
                <ListItem template="tSlider" 
                    title:text="Slider"
                    title:top="10"
                    title:left="16"
                    slider:min="1" 
                    slider:max="100" 
                    slider:value="75" 
                    slider:top="50"
                    slider:width="220"
                    height="100" />
                    
                <ListItem template="tSwitch" 
                    title:text="Switch" 
                    title:left="16"
                    title:right="16"
                    toggle:value="true" 
                    toggle:right="10 " />
                    
            </ListSection>
        </ListView>
	</Window>
</Alloy>
function reset_onClick(e) 
{
	var item,
		animated = (e.source.id === 'reset2');

	Ti.API.info('Resetting slider and switch. animated: ' +  animated);
		
	item = $.ls.getItemAt(0);
	item.slider.value = '1';
	$.ls.updateItemAt(0, item, { animated: animated });
	
	item = $.ls.getItemAt(1);
	item.toggle.value = false;
	$.ls.updateItemAt(1, item, { animated: animated });
}

$.index.open();

Attachments

FileDateSize
iOS Simulator Screen Shot Jul 2, 2015, 10.09.20 AM.png2015-07-02T17:13:57.000+000039532

Comments

No comments

JSON Source