Flex CategoryAxis 字体样式修改
所属分类:
网页制作 / Flash
阅读数:
1033
收藏 0赞 0分享
在群里面有朋友问我,如何可以修改Flex Charts其中一个可视化标签:CategoryAxis的字体大小、颜色等方式。
CategoryAxis的定义:
CategoryAxis类允许图表表示由轴上的一组离散值组成的数据。通常可以使用CategoryAxis类定义一组沿图表的轴显示的标签。例如,按城市、年份、业务部门等呈现数据的图表。
CategoryAxis的继承关系:
CategoryAxis → AxisBase → EventDispatcher → Object
从上述关系可以看出CategoryAxis没有继承UIComponent、DisplayObject等可视化容器,同时CategoryAxis也没有一些关于文字设定方面的属性,例如fontsize、fontWeight、textDecoration等。
不过我们可以利用其他的方式来实现这个功能。
CategoryAxis有一个叫做labelFunction的属性,这个属性的定义:指定一个函数,用于定义为CategoryAxis的dataProvider中的各个项目生成的标签。
所以修改的原理:可以利用labelFunction得到每个Label,然后再对其进行修改。
片段代码:
<mx:horizontalAxis>
<mx:CategoryAxis id="ca"
categoryField="@date" title="August 2007" labelFunction="categoryAxisLabelFun" />
</mx:horizontalAxis>
private function categoryAxisLabelFun( item : Object, prevValue : Object, axis : CategoryAxis, categoryItem : Object) : String {
var temp : String = item as String;
return temp;
}
其中categoryAxisLabelFun的参数:
1、item:保存的就是Label里面文字信息。
2、prevValue:坐标轴上面,前一个类别的值。
3、axis:CategoryAxis的实例化对象。
4、categoryItem:是将要呈现的dataProvider中的项目。
所以与标签有关系的只有第一个参数:item。
以下代码分别是对CategoryAxis的标签进行修改的代码:
1、改变字体大小:
private function categoryAxisLabelFun( item : Object, prevValue : Object, axis : CategoryAxis, categoryItem : Object) : String {
var temp : String = item as String;
return '<font size="20">' + temp + </font>';
}
2、改变字体粗细:
private function categoryAxisLabelFun( item : Object, prevValue : Object, axis : CategoryAxis, categoryItem : Object) : String {
var temp : String = item as String;
return '<B>' + temp + </B>';
}
3、改变字体下划线:
private function categoryAxisLabelFun( item : Object, prevValue : Object, axis : CategoryAxis, categoryItem : Object) : String {
var temp : String = item as String;
return '<U>' + temp + </U>';
}
4、改变字体斜体:
private function categoryAxisLabelFun( item : Object, prevValue : Object, axis : CategoryAxis, categoryItem : Object) : String {
var temp : String = item as String;
return '<I>' + temp + </I>';
}
5、改变字体颜色:
private function categoryAxisLabelFun( item : Object, prevValue : Object, axis : CategoryAxis, categoryItem : Object) : String {
var temp : String = item as String;
return '<font color="#ff0000">' + temp + </font>';
}
综上所述,其实我们利用了一个很简单的方式,使用HTML标签对其Label进行设置。
FLEX 仿Google联想框效果
FLEX--仿Google联想框效果--现在好多地方都用到了这样的效果,当然,现在Google下线了,不让用了,但是跟网上说的一样,想办法,它还是能出来的
收藏 0赞 0分享
FLEX 日期时间操作
找了很久,还是没有找到包含时间以下的东西,算了,还是麻烦一点,用日期加时间来处理吧.这里需要注意的是,它的时间日期跟其他语言是差不多的.所以要注意进行处理.
收藏 0赞 0分享
Flex 编程注意之性能优化、垃圾回收的一些总结
自从开始做Flex、ActionScript 3.0的项目,我就一直与垃圾回收、性能优化这些问题打交道,因此也总结了一些优化的方案,同时在一些QQ群中也得到了一些“高人”的指点,因此将此内容记录一下。
收藏 0赞 0分享
Flex 编程注意之Flex Complier参数
由于上一篇文章《Flex编程注意之Namespace的用法》引出了Flex编译时自带的两个参数:-namespace -include-namespace,正好想到可以写一篇关于Flex Complier时的一些自定义参数。
收藏 0赞 0分享
Flex Namespace的用法
自定义自己组件的namespace呢 去Adobe那边的compiler参数查找了一下,发现可以利用-namespace、-include-namespaces这两个参数来指定自己的URL。
收藏 0赞 0分享
查看更多