Flex Canvas 子项随机调整大小

Posted 2023-02-23

技术标签:

【中文标题】Flex Canvas 子项随机调整大小【英文标题】：Flex Canvas child Randomly resizes 【发布时间】：2011-01-31 15:56:33 【问题描述】：

我有一个包含所有需要显示的组件的视图堆栈的应用程序。导航在主应用程序中定义。所有组件都基于canvas。

主应用程序如下所示：

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:components="components.*">
 <mx:VBox   horizontalCenter="0" verticalGap="0" backgroundColor="#FFFFFF">
  <mx:Image id="header" verticalAlign="top" />
  <mx:ViewStack id="body" horizontalCenter="0" verticalCenter="0"  >
   <components:HomePage id="hp" />
   <components:CollectionSelection id="cs" />
   <components:SearchEngine id="se" />
   <components:SearchResult id="sr" />
   <components:Tray id="tr" />
   <components:Order id="or" />
  </mx:ViewStack>
  <mx:Image id="footer" verticalAlign="bottom" maintainAspectRatio="false" />
 </mx:VBox>
</mx:Application>

我从 TRAY 组件中得到一个奇怪的行为。

这是组件托盘的代码（我只留下了显示信息）：

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml">
 <mx:Image id="bg" 
  horizontalCenter="0" verticalCenter="0" 
    
  maintainAspectRatio="false"/>

 <mx:HBox >
  <mx:Button x="20" y="20" label="BACK"/>
  <mx:Spacer />
  <mx:LinkBar 
   itemClick="linkbar_itemClick(event)"
   styleName="GLBLinkBTN"
   separatorColor="#FFFFFF"
   separatorWidth="1"
   >
   <mx:dataProvider>
    <mx:Object label="CLEAR"/>
    <mx:Object label="LOGOUT"/>
   </mx:dataProvider>
  </mx:LinkBar>
 </mx:HBox> 

 <mx:VBox id="mainBox" horizontalCenter="0" verticalCenter="0" verticalGap="0">
  <mx:HBox   backgroundColor="#60524D" verticalAlign="bottom" paddingBottom="5">
   <mx:Label styleName="TRTitle" paddingLeft="15"/>
   <mx:Spacer />
   <mx:Label styleName="TRItems" paddingRight="15"/>
  </mx:HBox>
  <mx:HorizontalList id="hlist"
   dataProvider="TrayData.instance.itemsCollection" 
   columnCount="TrayData.instance.hlistColumns"
   rowCount="1"
   itemRenderer="components.TrayItem"
   horizontalScrollPolicy="off"
   rollOverColor="#FFFFFF"
   selectionColor="#FFFFFF"
   horizontalCenter="0" verticalCenter="0"
   borderStyle="none"
   horizontalScrollPosition="TrayData.instance.hsPosition"
   />
  <mx:HBox  backgroundColor="#E7DDDB"  verticalAlign="middle" paddingLeft="20" paddingRight="20">
   <mx:Box  verticalAlign="middle" horizontalAlign="left">
    <mx:Button id="leftBtn" />
   </mx:Box>
   <mx:Spacer />
   <mx:Box  verticalAlign="middle" horizontalAlign="right">
    <mx:Button id="rightBtn" />
   </mx:Box>
  </mx:HBox>
 </mx:VBox> 
</mx:Canvas>

所有组件都正常显示。但是，有时，托盘组件中的 vbox“mainBox”随机未按应有的方式显示：水平列表缩小，而不是完全显示其项目，我得到每个项目的水平和垂直滚动条...... 我目前正在尝试重现这种行为（以获取打印屏幕），但我知道，它工作正常...... -_-' 一旦我得到它不应该的工作，我就会上传一张图片。

这是 itemRenderer 的代码（以防万一……）：

<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" >
 <mx:HBox  paddingTop="0" paddingBottom="0" paddingRight="3">
  <mx:Spacer />
  <mx:Box   verticalAlign="middle" horizontalAlign="center">
   <mx:Button  />
  </mx:Box>
 </mx:HBox>
 <mx:VBox paddingLeft="20" paddingRight="20" verticalGap="15" paddingBottom="15">
  <mx:Canvas id="thumbnail">
   <mx:Image id="thumbnailBG" />
   <mx:Image id="thumbnailIM" />
  </mx:Canvas >
  <mx:VBox  verticalGap="7">
   <mx:HBox  >
    <mx:Label  opaqueBackground="#ECE5E2"/>
    <mx:Label paddingBottom="5"/>
   </mx:HBox>
   <mx:HBox  >
    <mx:Label  opaqueBackground="#ECE5E2"/>
    <mx:Label />
   </mx:HBox>
   <mx:HBox  >
    <mx:Label  opaqueBackground="#ECE5E2"/>
    <mx:Label />
   </mx:HBox>
   <mx:HBox  >
    <mx:Label opaqueBackground="#ECE5E2"/>
    <mx:Label />
   </mx:HBox>
   <mx:HBox  >
    <mx:Label  opaqueBackground="#ECE5E2"/>
    <mx:Label />
   </mx:HBox>
   <mx:HBox  >
    <mx:Label  opaqueBackground="#ECE5E2"/>
    <mx:Label />
   </mx:HBox>
   <mx:HBox  >
    <mx:Label  opaqueBackground="#ECE5E2"/>
    <mx:Label />
   </mx:HBox>
   <mx:HBox  >
    <mx:Label  opaqueBackground="#ECE5E2"/>
    <mx:Label />
   </mx:HBox>
   </mx:VBox>
  <mx:Button />
 </mx:VBox>

</mx:VBox>

非常感谢您的帮助。

问候， BS_C3

嗨！我终于再次得到了随机行为。这里有一些屏幕截图...... 代码没变……

这是正常行为：

alt text http://www.freeimagehosting.net/uploads/d1df2950af.png

这是随机行为：

alt text http://www.freeimagehosting.net/uploads/fcf1a603f4.png

FI：我在刷新应用程序时恢复了正常行为。

希望这能帮助你理解我的问题>_

问候。

【问题讨论】：

【参考方案1】：