スクロール可能なビューがappceleratorで正しく表示されない

Question

私はappceleratorでスクロール可能なビューを実装しました。最初の画像と最後の画像のみが表示されます。中間画像はロードされません。理由は何ですか？

これは、スクロール可能なビューの.xmlファイルのコードです。

<Alloy> 
    <View class="container"> 
     <View class = " HeadingClass" > 
      <Label class="headingClass" top = "0%">Scrollable View And Animation Screen</Label> 
     </View> 
     <ScrollableView class = "scrollableViewClass" id="scrollableView"> 
      <ImageView class="imgView1" id="imgViewId1"></ImageView> 
      <ImageView class="imgView2" id="imgViewId2"></ImageView> 
      <ImageView class="imgView3" id="imgViewId3"></ImageView> 
      <ImageView class="imgView4" id="imgViewId4"></ImageView> 
      <ImageView class="imgView5" id="imgViewId5"></ImageView> 
     </ScrollableView> 
     <!-- <View class="imageAnimationView" id="imageAnimation"> 
      <ImageView class="animateImageClass" id="animateImage"></ImageView> 
     </View> --> 
    </View> 
</Alloy> <Alloy> 
    <View class="container"> 
     <View class = " HeadingClass" > 
      <Label class="headingClass" top = "0%">Scrollable View And Animation Screen</Label> 
     </View> 
     <ScrollableView class = "scrollableViewClass" id="scrollableView"> 
      <ImageView class="imgView1" id="imgViewId1"></ImageView> 
      <ImageView class="imgView2" id="imgViewId2"></ImageView> 
      <ImageView class="imgView3" id="imgViewId3"></ImageView> 
      <ImageView class="imgView4" id="imgViewId4"></ImageView> 
      <ImageView class="imgView5" id="imgViewId5"></ImageView> 
     </ScrollableView> 
     <!-- <View class="imageAnimationView" id="imageAnimation"> 
      <ImageView class="animateImageClass" id="animateImage"></ImageView> 
     </View> --> 
    </View> 
</Alloy> 

これは.tssファイルのコード

".container" : { 
    backgroundColor : "lightgray" 
}, 

".headingClass" : { 
    height : "5%", 
    width : "70%", 
    font: { 
     fontFamily: 'Arial', 
     fontSize: '14%', 
     fontWeight: 'bold' 
    }, 
    textAlign: Ti.UI.TEXT_ALIGNMENT_CENTER, 
}, 

".HeadingClass" : { 
    backgroundColor : "gray", 
    top : "5%", 
    height : "6%", 
    width : "100%" 
}, 

".scrollableViewClass" : { 
    top : "15%", 
    height : "30%", 
    width : "100%", 
    contentHeight: Ti.UI.SIZE, 
    contentWidth: Ti.UI.SIZE, 
    showPagingControl : true 
}, 

".imgView1" : { 
    image : "/Images/appceleratorImage1.png", 
    height : "100%", 
    width : "100%" 
}, 

".imgView2" : { 
    image : "/Images/appceleratorImage2.png", 
    height : "100%", 
    width : "100%" 
}, 

".imgView3" : { 
    image : "/Images/appceleratorImage3.png", 
    height : "100%", 
    width : "100%" 
}, 

".imgView4" : { 
    image : "/Images/appceleratorImage4.png", 
    height : "100%", 
    width : "100%" 
}, 

".imgView5" : { 
    image : "/Images/appceleratorImage5.png", 
    height : "100%", 
    width : "100%" 
} 

Answer 1

S 'の<ImageView>周りS' の<View>を入れてみてくださいです。 テスト目的のために、ページが表示されているかどうかを確認するために、backgroundColorを与えることができます。