flex4圆角效果

阅读更多

Flex4中SkinnableContainer圆角边框设置
Flex4中BorderContainer有一个cornerRadius属性，通过设置该属性，即可实现圆角边框效果，但设置这个属性后，4个角都会变圆，有的时候可能会有这么一种需求：我只需要设置某一两个角变圆，或者几个圆角的弧度都不一样，这个时候，cornerRadius属性的设置显然就不能满足需求。
ps:在Flex4之前可以设置borderSides属性达到类似效果，如：borderSides="top left right"
在Flex4中borderSides属性貌似已经没有了（其实flex3中很多的属性，在flex4中都没有了，已经换了其他实现方式）
那么，在flex4中要如何做才能达到上面说的效果呢？
看代码：
首先，写一个skin：

    
    
    
        [HostComponent("spark.components.SkinnableContainer")]
    
    
    
    
        
        
    
    
    
    
    
        
            
        
        
            
                
                    
                    
                    
                
            
        
    
    
    

使用这个skin：

转自： http://www.cnblogs.com/syxc/archive/2011/01/03/1925030.html
圆角TextInput
在flex4中spark布局的样式都是用skin来控制，不像flex3中的mx可以使用属性来控制样式。所以spark控件已经没有了cornerRadius属性，所以要实现圆角输入框，就需要使用skin来实现。以下是实现代码，一看就明白。
DateFieldSkin:

Sample App:

    
        @namespace s "library://ns.adobe.com/flex/spark";
        @namespace mx "library://ns.adobe.com/flex/mx";

        .roundedTI
        {
            corner-radius:10;
            borderStyle: solid;
            borderSkin: ClassReference("DateFieldSkin");
        }

    

    

摘自： http://stackoverflow.com/questions/2264876/answer/submit