钛添加自定义模板列表视图 [英] Titanium Adding custom template to a listview

查看:212
本文介绍了钛添加自定义模板列表视图的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我目前正在建设有钛工作室和合金的应用程序。
在我的Windows之一,我试图通过$ P $动态添加的ListItem在ListView pssing一些按钮(允许用户检索图像或某些文件)。

I'm currently building an application with Titanium studio and Alloy. In one of my Windows, I'm trying to dynamically add ListItem in a listView by pressing some button (allowing the user to retrieve an image or some file).

我需要添加一些的listItem一些特殊的结构:应该以显示数据类型为文件名的标签,而另一幅图像删除ListItem中的图像。
这是我的模板:

I need to add some listItem with some particular structures : An image supposed to show the dataType, a label for the file name, and another image to delete the listItem. Here is my template :

ligneFichier.xml

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

,然后在我的网页控制器:

And then, in the controller of my page :

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);

于是,我就在模板与合金直接链接:

So I tried to link the template with alloy directly :

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

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

            </ListSection>
        </ListView>

但是,当我加一条线,它不使用我的模板,它甚至不查找的文字,只写标签。
然后,在控制台中,有一个消息:

But, when I add a line, it doesn't use my template, it doesn't even find the text, it only write 'label'. And then, in the console, there is that message :

请使用属性为builtInTemplate结合

Please use 'properties' binding for builtInTemplate

所以,我想通过'属性',但没有成功更换绑定名称...
这是否意味着某人做某事?不要犹豫,要求一些precisions或者告诉我,如果我忘了一些样本。

So I tried to replace the binding name by 'Properties' but with no success... Does this mean something to someone? Do not hesitate to ask for some precisions or to tell me if I forgot some sample.

推荐答案

我认为,因为它是在一个单独的文件中定义的合金无法识别您的模板。
尝试在这样的同一个文件来定义它:

I think that alloy can't recognize your template because it was defined in a separate file. Try to define it in the same file like this :

 <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>

编辑:您可以使用需要来添加您的模板:

EDIT : You can use require to add your template :

在templateName.xml:

in templateName.xml :

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

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

then add it to your listview templates

 <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>

我已经测试它:)

I have tested it :)

这篇关于钛添加自定义模板列表视图的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆