是否可以像旧的Halo Button一样设置Spark Button？ （仅限CSS）

Question

我认为Adobe正在搞乱我，从所有的文档和教程中看起来，在Flex 4（Spark）中设计一个简单的按钮变得更加困难。我曾经能够让我的设计师创建CSS，因为它离Web标准CSS不太远。现在好像我需要按照this post中的概述制作皮肤？

以下是旧按钮样式。

Button {
    fontFamily: "Arial, Helvetica";
    fontWeight: bold;
    fontSize: 11px;
    paddingTop: 0px;
    paddingBottom: 0px;
    highlightAlphas: 0.42, 0.13;
    fillAlphas: 1, 1, 1, 1;
    fillColors: #B9DEF8, #9AC3EB, #B9DEF8, #9AC3EB;
    color: #477199;
    textRollOverColor: #477199;
    textSelectedColor: #3399cc;
    borderStyle: none;  
}

谢谢！

Answer 1

为Spark按钮设置外观将是一种编程方法，您可以非常接近地模仿Halo mx：按钮。

如果您只是希望您的应用程序使用Halo主题，您可以使用Halo主题。

注意mx也很重要：按钮包括像图标这样的东西，Spark Button没有。

当你表示你只想使用CSS时，你将不得不潜入mx skin class：

mx.skins.halo.ButtonSkin

Spark主题：

光环主题：

基于你的CSS for spark：

<?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">

    <fx:Style>
        @namespace s "library://ns.adobe.com/flex/spark";
        @namespace mx "library://ns.adobe.com/flex/mx";

        s|Button
        {
            fontFamily: "Arial, Helvetica";
            fontWeight: bold;
            fontSize: 11px;
            paddingTop: 0px;
            paddingBottom: 0px;
            highlightAlphas: 0.42, 0.13;
            fillAlphas: 1, 1, 1, 1;
            fillColors: #B9DEF8, #9AC3EB, #B9DEF8, #9AC3EB;
            color: #477199;
            textRollOverColor: #477199;
            textSelectedColor: #3399cc;
            borderStyle: none;  
        }
    </fx:Style>

    <s:VGroup width="100%"
              height="100%"
              paddingTop="10"
              paddingLeft="10">

        <s:Button label="Hello, world!" />

        <mx:Button label="Hello, world!" />

    </s:VGroup>

</s:Application>

Answer 2

是的，有可能。

查看styles on the Spark Button以找出可以使用CSS修改的内容。