Titanium中的自定义表头视图

Question

我想创建一个自定义表头View，但我希望重复该视图 我有3个部分，在所有3个部分中，我想查看表格的相同标题视图。

这是我的代码：

 var section1HeaderView = Ti.UI.createView({ height: 40,backgroundColor:'#00928F' });
var section1HeaderLabel = Ti.UI.createLabel({ text: 'I am the header, hear me roar!',color:'black' });
section1HeaderView.add(section1HeaderLabel);

var sectionFruit = Ti.UI.createTableViewSection({ headerView: section1HeaderView });
sectionFruit.add(Ti.UI.createTableViewRow({ title: 'Apples' }));
sectionFruit.add(Ti.UI.createTableViewRow({ title: 'Bananas' }));

var sectionVeg = Ti.UI.createTableViewSection({ headerTitle: 'Vegetables' });
sectionVeg.add(Ti.UI.createTableViewRow({ title: 'Carrots' }));
sectionVeg.add(Ti.UI.createTableViewRow({ title: 'Potatoes' }));

var table = Ti.UI.createTableView({
  data: [sectionFruit, sectionFruit,sectionFruit]
});

$.win.add(table);

输出：

如果您注意到它正在使用height属性而不是背景颜色属性，也没有添加标签？

Answer 1

这不回答“为什么我不能对多个部分使用相同的headerView”（可能是Titanium或本机的一些限制？）问题，但它确实解决了你的问题。

var headerViewArray = [];
for(var i =0; i<3;i++){
    var headerView = Ti.UI.createView({ height: 40,backgroundColor:'#00928F' });
    var headerLabel = Ti.UI.createLabel({ text: 'I am the header, hear me roar!',color:'black' });
    headerView.add(headerLabel);    
    headerViewArray.push(headerView);
}

var fruitData = [{'title':'Apples'},{'title':'Bananas'}];
var vegData = [{'title':'Carrots'},{'title':'Potatoes'}];
var meatData = [{'title':'Chicken'},{'title':'Beef'}];

var sectionFruit = Ti.UI.createTableViewSection({ headerView: headerViewArray[0] });
_.each(fruitData, function(item){
    sectionFruit.add(Ti.UI.createTableViewRow(item));
})

var sectionVeg = Ti.UI.createTableViewSection({ headerView: headerViewArray[1] });
_.each(vegData, function(item){
    sectionVeg.add(Ti.UI.createTableViewRow(item));
})

var sectionMeat = Ti.UI.createTableViewSection({ headerView: headerViewArray[2] });
_.each(meatData, function(item){
    sectionMeat.add(Ti.UI.createTableViewRow(item));
})

var table = Ti.UI.createTableView({
  data: [sectionFruit, sectionVeg, sectionMeat]
});

$.index.add(table);
$.index.open();