Question

我正在尝试将两行图像添加到Titanium中的ScrollView。我遇到的问题是只显示一行。

我的Alloy代码如下所示：

＆＃13;

<Alloy>	
	<Window class='container' statusBarStyle='Ti.UI.iPhone.StatusBar.LIGHT_CONTENT'>
		// Make ios status bar correct color
		<View height='20' top='0' left='0' backgroundColor='#01B6AC'></View>
		<View id = 'savedContents' layout='vertical' top='20'>
		</View>
		<Require type='view' src='bottomBar' id='bottomBar'/>
		<Widget id="fa" src="com.mattmcfarland.fontawesome"/>
	</Window>	
</Alloy>

＆＃13;

我的控制器代码如下所示：

＆＃13;

var scrollView = Ti.UI.createScrollView({
  contentWidth: 'auto',
  contentHeight: 'height',
  showVerticalScrollIndicator: false,
  showHorizontalScrollIndicator: false,
  width: '100%',
  height: 400,
  top: 0
});

for  (i=0; i < venueDetails.length; i++) {
  row = Ti.UI.createView({
    width:'100%',
    height:150,
    layout:'composite'
  });	

  image1 = Ti.UI.createImageView({
    image:'http://www.outnow.io/assets/img/small511by309/'+venueDetails[i]["image1"],
    width:'50%',
    height:150,
    left:0,
    top:0
  });

  row.add(image1);
  if (i+1 < venueDetails.length) {	
    image2 = Ti.UI.createImageView({
      image:'http://www.outnow.io/assets/img/small511by309/'+venueDetails[i+1]["image1"],
      width:'50%',
      height:150,
      left:'50%',
      top:0
    });
    row.add(image2);	
  }
  //$.savedContents.add(row);	
  scrollView.add(row);			
}
$.savedContents.add(scrollView);

＆＃13;

如果我将行视图直接添加到$ .savedContents视图（根据上面代码中注释掉的行），我会正确地看到所有行（每行两个图像）。如果我通过createScrollView执行此操作，我只能获得一行图像。我需要使用scrollView来使图像可滚动。

任何人都知道我做错了什么？

Answer 1

默认情况下，layout属性的值为composite。因此scrollView具有复合布局，因此您需要指定定位属性或＆＃34;引脚＆＃34;该视图（row）的（顶部，底部，左侧，右侧和中间）。在您的代码中，您只指定了宽度和高度，因此所有视图都将在父视图（ScrollView）中居中。

根据Titanium.UI.View-property-layout Reference：

复合（或绝对）。默认布局。定位了儿童视图基于其定位属性或＆＃34;引脚＆＃34; （上，下，左，正确和中心）。如果未指定任何定位属性，则孩子居中。

如何将图像网格添加到Titanium中的ScrollView

1 个答案: