本文和大家重點(diǎn)討論一下使用Flex滾動(dòng)條過(guò)程中常見(jiàn)的一些問(wèn)題，F(xiàn)lex滾動(dòng)條雖然很好用，但總是會(huì)出現(xiàn)意想不到的問(wèn)題，這里向大家介紹一下，希望本文的介紹能讓你有所收獲。

Flex滾動(dòng)條問(wèn)題

Flex滾動(dòng)條雖然很好用，但總是會(huì)出現(xiàn)意想不到的問(wèn)題。前幾天說(shuō)了，拖動(dòng)后花屏的問(wèn)題，今天又發(fā)現(xiàn)了更惡心的問(wèn)題。當(dāng)你把容器的寬度調(diào)為100%后，verticalScrollbarPolicy用默認(rèn)的auto。這是如果你縮放窗口會(huì)出現(xiàn)Flex滾動(dòng)條，但問(wèn)題這是就出現(xiàn)了，只要出現(xiàn)了垂直Flex滾動(dòng)條，水平Flex滾動(dòng)條就是被迫出現(xiàn)。 

viewplaincopytoclipboardprint?  
<?xmlversionxmlversion="1.0"encoding="utf-8"?> 
<mx:Applicationxmlns:mxmx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"layout="absolute"xmlns:local="*"> 
<mx:Canvaswidthmx:Canvaswidth="100%"height="700"/> 
</mx:Application> 
<?xmlversionxmlversion="1.0"encoding="utf-8"?> 
<mx:Applicationxmlns:mxmx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"layout="absolute"xmlns:local="*"> 
 <mx:Canvaswidthmx:Canvaswidth="100%"height="700"/> 
</mx:Application> 
 

 這是是由于flex在計(jì)算前面的百分比時(shí)，把垂直Flex滾動(dòng)條的寬度也算上了，我一開(kāi)始以為是flex的bug。使其他的官方文檔中寫(xiě)了一句很華麗的話。 

"FlexconsidersscrollbarsinitssizingcalculationsonlyifyouexplicitlysetthescrollpolicytoScrollPolicy.
ON.So,ifyouuseanautoscrollpolicy(thedefault),thescrollbaroverlapsthebuttons.Topreventthisbehavior,
youcansettheheightpropertyfortheHBoxcontainerorallowtheHBoxcontainertoresizebysettingapercentage-basedwidth.
RememberthatchangingtheheightoftheHBoxcontainercausesothercomponentsinyourapplicationtomoveandresizeaccordingtotheirownsizingrules."  
 
--FromSizingComponentsintheFlex3help,under"UsingScrollbars"  
 

 就這樣回避了這個(gè)問(wèn)題。但有個(gè)辦法你可以解決這個(gè)問(wèn)題，重載validateSize方法

viewplaincopytoclipboardprint?  
//InyourApplication，moduleorwhereveryouneedthisworkaround.  
overridepublicfunctionvalidateSize(recursive:Boolean=false):void{  
super.validateSize(recursive);  
if(!initialized)return;  
if(height<measuredHeight)verticalScrollPolicy=ScrollPolicy.ON;  
elseverticalScrollPolicy=ScrollPolicy.OFF;  
}  
 

【編輯推薦】

1. FlexBuilder快捷鍵使用說(shuō)明
2. Flex2.0Beta1新功能出爐
3. 揭露Flex2.0的幾大誤區(qū)
4. FlexBuilder3.0與Eclipse3.4的***結(jié)合
5. 剖析Flex DataGrid分頁(yè)控件的兩種分頁(yè)形式用法