flex4如何设置Panel的标题样式？

Question

in flex4 how to set style of a Panel's title? For example, how to set the title alignment to center? Any advice would help. Thanks in advance.

Answer 1

You just need to define a new skin for your panel and change the textAlign property in it.

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
           xmlns:s="library://ns.adobe.com/flex/spark" 
           xmlns:mx="library://ns.adobe.com/flex/mx" 
           minWidth="955" minHeight="600">

<s:Panel 
    width="200" height="150" 
    left="40" top="40" 
    title="This is my panel" 
    skinClass="assets.skins.MyPanelSkin"/>

</s:Application>

In your skin file you need to find this block:

    <!-- layer 3: text -->
    <!--- @copy spark.components.Panel#titleDisplay -->
    <s:Label id="titleDisplay" maxDisplayedLines="1"
    left="9" right="3" top="1" bottom="0" minHeight="30"
    verticalAlign="middle" textAlign="start" fontWeight="bold">
    </s:Label>

and change

textAlign="start"

to

textAlign="center"