Titanium将自定义模板添加到列表视图

Question

我目前正在使用Titanium studio和Alloy构建应用程序.在我的一个Windows中,我试图通过按下某个按钮(允许用户检索图像或某个文件)在listView中动态添加ListItem.

我需要添加一些带有一些特定结构的listItem:一个应该显示dataType的图像,一个用于文件名的标签,另一个用于删除listItem的图像.这是我的模板:

ligneFichier.xml

<Alloy>
<ItemTemplate name="ligneFichier" id="ligneFichier">
     <View class="item-container">               
         <ImageView bindId="typeDonnee" />
         <Label bindId="nomFichier" />  
         <ImageView bindId="supprimer" />
     </View>
</ItemTemplate>
</Alloy>

然后,在我的页面的控制器中:

myController.js

var data = [];
        var tmp = {
            typeDonnee : {
                image : '/images/image.png'
            },
            nomFichier : {
                text : event.media.file.name
            },
            supprimer : {
                image : '/images/supprimer.png'                 
            }
            //I tried to use this line :
            //template: 'ligneFichier',
            //But it tells me that template is undefined
        };
        data.push(tmp);

        //My listView
        $.listeFichiers.sections[0].items = $.listeFichiers.sections[0].items.concat(data);

所以我尝试直接将模板与合金链接:

       <ListView id="listeFichiers" height="100" headerTitle="" template="ligneFichier">
            <ListSection id="photo" headerTitle="">

            </ListSection>
            <ListSection id="audio" headerTitle="">

            </ListSection>
        </ListView>

但是,当我添加一行时,它不使用我的模板,它甚至找不到文本,它只写'标签'.然后,在控制台中,有一条消息:

请对builtInTemplate使用'properties'绑定

所以我试图用'属性'替换绑定名称,但没有成功......这对某人意味着什么？不要犹豫,要求一些精确或告诉我,如果我忘了一些样品.

Answer 1

我认为合金无法识别您的模板,因为它是在单独的文件中定义的.尝试在同一个文件中定义它,如下所示:

 <ListView id="listeFichiers" height="100" headerTitle="" defaultItemTemplate='ligneFichier'>
  <Templates>
   <ItemTemplate name="ligneFichier" id="ligneFichier">
     <View class="item-container">               
        <ImageView bindId="typeDonnee" />
        <Label bindId="nomFichier" />  
        <ImageView bindId="supprimer" />
     </View>
  </ItemTemplate>
 </Templates>
   <ListSection headerTitle="Title">
     <ListItem typeDonnee:image="yourimage.png" nomFichier:text="FileName" supprimer:image="supprimer.png" />
   </ListSection>
 </ListView>

编辑:您可以使用require来添加模板:

在templateName.xml中:

 <Alloy>
   <ItemTemplate name="ligneFichier" id="ligneFichier">
     <View class="item-container">               
        <ImageView bindId="typeDonnee" />
        <Label bindId="nomFichier" />  
        <ImageView bindId="supprimer" />
     </View>
  </ItemTemplate>
  </Alloy>

然后将其添加到列表视图模板中

 <ListView id="listeFichiers" height="100" headerTitle="" defaultItemTemplate='ligneFichier'>
  <Templates>
   <Require src="templateName"/>
  </Templates>
   <ListSection headerTitle="Title">
     <ListItem typeDonnee:image="yourimage.png" nomFichier:text="FileName" supprimer:image="supprimer.png" />
   </ListSection>
 </ListView>

我测试过了:)