Flex中如何通过LegendItem CSS selector上的fontWeight样式设置图表种字体weight的例子

By Minidxer | September 26, 2008

接下来的例子演示了Flex中如何通过LegendItem CSS selector上的fontWeight样式，设置图表种字体weight。

让我们先来看一下Demo（可以右键View Source或点击这里察看源代码）：


下面是完整代码(或点击这里察看)：

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application name="LegendItem_fontWeight_test"
  3.         xmlns:mx="http://www.adobe.com/2006/mxml"
  4.         layout="vertical"
  5.         verticalAlign="middle"
  6.         backgroundColor="white">
  7.  
  8.     <mx:Style>
  9.         LegendItem {
  10.             fontWeight: normal;
  11.         }
  12.     </mx:Style>
  13.  
  14.     <mx:XMLListCollection id="dp">
  15.         <mx:source>
  16.             <mx:XMLList>
  17.                 <product label="Product 1" data="3" />
  18.                 <product label="Product 2" data="1" />
  19.                 <product label="Product 3" data="4" />
  20.                 <product label="Product 4" data="1" />
  21.                 <product label="Product 5" data="5" />
  22.                 <product label="Product 6" data="9" />
  23.             </mx:XMLList>
  24.         </mx:source>
  25.     </mx:XMLListCollection>
  26.  
  27.     <mx:Panel styleName="opaquePanel"
  28.             width="100%"
  29.             height="100%">
  30.         <mx:PieChart id="pieChart"
  31.                 dataProvider="{dp}"
  32.                 showDataTips="true"
  33.                 height="100%"
  34.                 width="100%">
  35.             <mx:series>
  36.                 <mx:PieSeries id="pieSeries"
  37.                         field="@data"
  38.                         nameField="@label"
  39.                         filters="[]" />
  40.             </mx:series>
  41.         </mx:PieChart>
  42.         <mx:ControlBar width="100%">
  43.             <mx:Legend dataProvider="{pieChart}"
  44.                     direction="horizontal"
  45.                     horizontalGap="100"
  46.                     width="100%" />
  47.         </mx:ControlBar>
  48.     </mx:Panel>
  49.  
  50. </mx:Application>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: Other | No Comments » | Tags: , ,

你可能还对下列文章感兴趣:

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll