組合框單擊事件與其容器衝突

Question

我想在單擊此HBox內的任何對象時更改HBox的樣式。我爲HBox的單擊事件設置了句柄，然後我發現在這個HBox的組合框中選擇項目非常困難。

當我點擊組合框時，它會下拉它的項目列表，並且HBox樣式發生變化，然後combobox會很快下降，我沒有時間在Combobox中選擇一個項目。

這是我的代碼，有什麼辦法可以避免這個問題嗎？

<mx:Repeater id="itemRepeater"> 
    <mx:HBox id="itemHBox" styleName="active" click="onItemClick(event);"> 
     <mx:ComboBox id="cb1" dataProvider="{dp}" close="closeHandler(event);"/> 
     <mx:TextArea id="itemText" /> 
    </mx:HBox> 
</mx:Repeater> 

private function onItemClick(e:MouseEvent):void { 
    for (var k:Number=0; k < total; k++) { 
     itemHBox[k].styleName = "Inactive"; 
    } 
    // Change edit style 
    itemHBox[e.currentTarget.instanceIndices].styleName = "active"; 
} 

Answer 1

設置styleName無效HBox並迫使它的孩子來檢查它們的大小和重新佈局，這就是爲什麼ComboBox隱藏它的下拉列表。

相反，你可以使用精確的樣式值：

private function onItemClick(e:MouseEvent):void { 
    for (var k:Number=0; k < total; k++) { 
     itemHBox[k].setStyle("backgroundColor", 0xFFFFFF); 
    } 
    // Change edit style 
    itemHBox[e.currentTarget.instanceIndices].setStyle("backgroundColor", 0xFF0000); 
}