FlexモバイルプロジェクトのSparkスキンでCSSで埋め込みフォントを使用するにはどうすればいいですか？

Question

ショートの例では、問題を説明します。次のファイル（とOpenSans font）で通常のFlexモバイルプロジェクトを設定します。

Main.mxml

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark" 
      applicationDPI="160"> 
    <s:layout><s:VerticalLayout/></s:layout> 

    <fx:Style source="style.css"/> 

    <s:Label text="Static Label"/> 
    <s:Button label="Static Button" skinClass="MyButtonSkin"/> 
</s:Application> 

style.cssに

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

@font-face { 
    src: url("fonts/opensans/OpenSans-Bold.ttf"); 
    fontFamily: OpenSansBoldEmbedded; 
    embedAsCFF: true; 
} 

s|Label, 
s|Button 
{ 
    fontFamily: OpenSansBoldEmbedded; 
    font-lookup: embeddedCFF; 
} 

MyButtonSkin.mxml

<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"> 
    <!-- host component --> 
    <fx:Metadata> 
     [HostComponent("spark.components.Button")] 
    </fx:Metadata> 

    <s:Label id="labelDisplay" /> 
</s:Skin> 

結果は、単純なラベルは埋め込みフォントとスタイル、しかしされていることですボタンのラベルは表示されません。だから、次のようになります。私は色やフォントサイズなどの他のCSSプロパティを試みたし、それは両方のために働くhttp://img813.imageshack.us/img813/44/skinningtest.png

。埋め込まれたフォントだけがSparkスキンで動作しません。

は、私が埋め込まれたフォントで、ボタン内のラベルのスタイルを設定するために何を欠場か？

---

ソリューション

インポート（@フォントフェース）でと使用（.OpenSansEmbeddedBold）の属性たfontWeightとのfontStyleを使用してください。太字のフォントを埋め込んで使用するだけでは不十分です。

/* Import the different font weights and styles */ 
@font-face { 
     src: url("fonts/opensans/OpenSans-Regular.ttf"); 
     fontFamily: OpenSansEmbedded; 
} 

@font-face { 
     src: url("fonts/opensans/OpenSans-Bold.ttf"); 
     fontFamily: OpenSansEmbedded; 
     fontWeight: bold; 
} 

@font-face { 
     src: url("fonts/opensans/OpenSans-Italic.ttf"); 
     fontFamily: OpenSansEmbedded; 
     fontStyle: italic; 
} 

@font-face { 
     src: url("fonts/opensans/OpenSans-BoldItalic.ttf"); 
     fontFamily: OpenSansEmbedded; 
     fontWeight: bold; 
     fontStyle: italic; 
} 

/* Register fonts as styleNames for further use */ 
.OpenSansEmbedded 
{ 
     fontFamily: OpenSansEmbedded; 
} 

.OpenSansEmbeddedBold 
{ 
     fontFamily: OpenSansEmbedded; 
     fontWeight: bold; 
} 

.OpenSansEmbeddedItalic 
{ 
     fontFamily: OpenSansEmbedded; 
     fontStyle: italic; 
} 

.OpenSansEmbeddedBoldItalic 
{ 
     fontFamily: OpenSansEmbedded; 
     fontWeight: bold; 
     fontStyle: italic; 
} 

は

<s:Label text="Static Label" styleName="OpenSansEmbeddedBold"/> 

Answer 1

私は理由を正確に知っていない、あなたのMXMLでは、styleNameとして定義されたクラスを使用しますが、あなたのCSSのfontWeight: normal;を追加してみてください、これが役立ちます。私はこの結論にfontFamilyをVerdanaに変更し、そのボタンラベルが太字であることを見てきました。あなたがembedAsCFFを使用する必要があり、ボタンの

Answer 2

：偽

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

@font-face { 
    src: url("fonts/opensans/OpenSans-Bold.ttf"); 
    fontFamily: OpenSansBoldEmbedded; 
    embedAsCFF: true; 
} 

@font-face { 
    src: url("fonts/opensans/OpenSans-Bold.ttf"); 
    fontFamily: OpenSansBoldEmbeddedForBtn; 
    embedAsCFF: false; 
} 

s|Label 
{ 
    fontFamily: OpenSansBoldEmbedded; 
    font-lookup: embeddedCFF; 
} 

s|Button 
{ 
    fontFamily: OpenSansBoldEmbeddedForBtn; 
}