Question

我正在开发Windows 10，开始学习Titanium SDK 6.0.1.GA和Alloy 1.9.8，我想显示一个ImageView，其中填充了从库中选择的图像，这个组件放在我的View中.xml像这样：

<Alloy>
    <Window class="container">
        <ActionBar id="actionBar" platform="android" title="Contact Details"></ActionBar>
        <Menu>
            <MenuItem id="saveContactMenu" title="Save" onClick="saveContact"/>
        </Menu>
    <View class="contact-details-holder">
      <View class="contact-photo-holder" onClick="openOptions">
        <ImageView id="photo" class="contact-photo"/>
      </View>
      <View class="contact-info-holder">
        <Label class="label">Nombre</Label>
        <Label id="fullname" class="text"/>
      </View>
      <View class="address-info-holder">
        <View class="address-holder">
          <Label class="label">Direccion</Label>
          <Label id="address" class="text"/>
        </View>
        <View class="map-holder">
        </View>
      </View>
      <View class="contact-info-holder">
        <Label class="label">T</Label>
        <Label id="phone" class="text"/>
      </View>
    </View>
        <OptionDialog id="photoDialog" title="Select source" onClick="handleSelectedOption" cancel="3">
        <Options>
            <Option>Camera</Option>
            <Option>Photo Gallery</Option>
                        <Option>From the Web</Option>
            <Option>Cancel</Option>
        </Options>
    </OptionDialog>
    </Window>
</Alloy>

.tss是：

'.container' : {
  width : Ti.UI.FILL,
  height : Ti.UI.FILL,
  backgroundColor:'white'
}

'.contact-details-holder' : {
  width : Ti.UI.FILL,
  height : Ti.UI.SIZE,
  layout: "vertical"
}

'.contact-photo-holder': {
        width : Ti.UI.FILL,
        height : '44 dp',
    top: 0,
    backgroundColor: "pink"
}

'.contact-photo': {
    width : Ti.UI.SIZE,
  height: Ti.UI.SIZE
}

'.contact-info-holder' : {
  width : Ti.UI.FILL,
  height: Ti.UI.SIZE,
  top: 0,
  layout: "vertical",
  backgroundColor: "lime"
}

'.label': {
    width : Ti.UI.SIZE,
    height:  Ti.UI.FILL,
  left : 0,
  font: {
      fontFamily:'Helvetica',
      fontSize: '12dp',
      fontStyle: 'normal',
      fontWeight: 'normal'
  },
    color: '#343434'
}

'.text': {
    width : Ti.UI.SIZE,
    height:  Ti.UI.FILL,
  left : 0,
  font: {
      fontFamily:'Helvetica',
      fontSize: '12dp',
      fontStyle: 'normal',
      fontWeight: 'normal'
  },
    color: 'black'
}

View的宽度设置为Ti.UI.FILL，高度设置为44 dps，而ImageView的宽度和高度设置为Ti.UI.SIZE，我希望图像大小为原始图像和视图将在其顶部剪辑，仅显示图像的中心，但它显示如下图像：

我在tss中应用了错误的样式吗？

Answer 1

试试这个

.XML

<View class="contact-photo-holder" onClick="openOptions">
  <View id="photoContainer">
    <ImageView id="photo" class="contact-photo"/>
  </View>
</View>

.tss

"#photoContainer":{
    width : Ti.UI.FILL,
    height : Ti.UI.SIZE
}
"#photo":{
    left: 0,
    right : 0,
    height : "auto"
}

如何在其父级内正确缩放Titanium ImageView？

1 个答案: