Question

我已经嵌入了一些字体并在我的移动应用程序中使用它们，除了我尝试用于“ActionBar”的那些外，它们都在工作。他们在其他地方工作，用"Comic Sans MS"代替"titleCGF"将其更改为Comic Sans。那么为什么它不适用于我的自定义fontFamily？

    <fx:Style>
        @namespace s "library://ns.adobe.com/flex/spark";
        @font-face {
            src: url("assets/Comic_Book.ttf");
            fontFamily: comic;
            embedAsCFF: false;
        }
/******************************
        @font-face{
            src: url("assets/CGF_Locust_Resistance.ttf");
            fontFamily: titleCGF;
            embedAsCFF: false;
        }
        @font-face{
            src: url("assets/CGF_Locust_Resistance.ttf");
            fontFamily: titleCGF;
            embedAsCFF: true;
        }
**********************************/
        .titleStyle{
            fontFamily: titleCGF;
            color: #FFFFFF;
        }
        .comicMessage{
            fontFamily: titleCGF;
            color: #838689;
            fontSize: 14;
        }
        s|IconItemRenderer{
            fontFamily: comic;
            color: #FEBA03;
            fontSize:18;
        }
        s|ActionBar{
            defaultButtonAppearance: beveled;
            accentColor: #FEBA03;
        }
        s|ActionBar #titleDisplay{
            fontFamily: "titleCGF";

        }
    </fx:Style>

这就是我得到的：

FontView

编辑：我试图制作自己的皮肤，部分预先编写的代码是：

<!-- SkinParts
name=titleGroup, type=spark.components.Group, required=false
name=actionGroup, type=spark.components.Group, required=false
name=navigationGroup, type=spark.components.Group, required=false
name=titleDisplay, type=spark.core.IDisplayText, required=false
-->

当我尝试定义像前三个<s:Group .../>这样的东西时，它运行正常。但没有任何东西出现在spark.core.IDisplayText中。即，<s:IDisplayText .../>没有任何东西......

Answer 1

这是两次嵌入字体的示例，一次使用embedAsCFF = false并再次使用embedAsCFF = true。查看http://blogs.adobe.com/jasonsj/2011/08/embedding-fonts-in-flex-mobile-projects.html的完整说明。

编辑1：修正了字体文件名

/* StyleableTextField, regular */
@font-face {
    src: url("assets/COMIC.TTF");
    fontFamily: "comic";
    embedAsCFF: false;
}

/* StyleableTextField, bold */
@font-face {
    src: url("assets/COMICBD.TTF");
    fontFamily: "comic";
    fontWeight: bold;
    embedAsCFF: false;
}

/* Label, regular */
@font-face {
    src: url("assets/COMIC.TTF");
    fontFamily: "comicCFF";
    embedAsCFF: true;
}

/* Label, bold */
@font-face {
    src: url("assets/COMICBD.TTF");
    fontFamily: "comicCFF";
    fontWeight: bold;
    embedAsCFF: true;
}

s|Label
{
    fontFamily: "comicCFF";
}

s|ActionBar
{
    fontFamily: "comic";
}

s|LabelItemRenderer
{
    fontFamily: "comic";
}

Answer 2

我在flex 4中对mx按钮有同样的问题我所做的是在两个地方都提到字体粗体为粗体。然后它开始工作了。

<fx:Style>

@font-face
        { 
            src: url("assets/fonts/Quasari1.ttf");
            fontFamily: msd;
            embedAsCFF: true; 
            fontWeight : bold;

        }
mx|Button{   
            fontFamily: msd;
            fontSize:22;
            color: red;
            fontWeight : bold;
            textFieldClass: ClassReference("mx.core.UIFTETextField"); 
        } 
</fx:Style>
<mx:Button label="submit" >

Answer 3

我知道Flex 3上的Button有这个问题，因为它的默认字体是粗体，很多人都不认为嵌入字体的粗体版本。默认操作栏移动皮肤是否可能使用粗体/斜体/其他东西，您需要自己制作皮肤还是嵌入两者？

===========以下新内容==============

我还没有在这台机器上安装FB 4.5，但我认为您可以右键单击包浏览器并选择新建＆gt; Mobile As3皮肤（或该效果的单词）。该对话框将询问您要选择的组件，您应该浏览操作栏。我还没有这样做（因为我还没有需要移动开发），但它可能会创建一个as3文件，其中包含您开始使用的大部分内容。

您可能会在updateDisplayList中找到需要编辑的代码，它将引用titleDisplay。

HTH;

艾米

Answer 4

使用embedAsCFF嵌入单独的字体副本：true;并将其应用于皮肤中的标签，它将起作用。我不记得它的推理（截止日期= wtfever），但我知道这解决了这个问题。

真实的故事。 =）

P.S。确保粗体/斜体在样式上也是正确的。

Answer 5

尝试将此添加到ActionBar标记，以删除粗体样式：

creationComplete="event.currentTarget.titleDisplay.setStyle('fontWeight', 'normal')"

如果可行，那么您可以尝试更好的解决方案，例如扩展ActionBar类，或者以粗体样式嵌入字体。

Answer 6

这是我用来设置移动应用程序样式的样式表（Action Bar，TextAreas，Buttons和Labels。）它是从博客和论坛帖子中编译的。

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

@font-face
{ 
    src: url("styles/acmesab.TTF"); 
    fontFamily: comicStrip; 
    embedAsCFF: false; 
}

@font-face
{ 
    src: url("styles/acmesab.TTF"); 
    fontFamily: comicStrip2; 
    embedAsCFF: true; 
}

s|ActionBar
{
    chromeColor: #EEEEEE;
    titleAlign: center;
    defaultButtonAppearance: beveled;
}

s|ActionBar #titleDisplay
{
    fontFamily: comicStrip;
    fontWeight: normal;
    color: #000000;
    textShadowColor: #FFFFFF;
}

s|ActionBar.beveled s|Group#actionGroup s|Button 
{
    fontFamily: comicStrip;
    fontWeight: normal;
    color: #000000;
    textShadowColor: #FFFFFF;
}

s|ActionBar.beveled s|Group#navigationGroup s|Button 
{
    fontFamily: comicStrip;
    fontWeight: normal;
    color: #000000;
    textShadowColor: #FFFFFF;
}

.textArea
{
    fontFamily: comicStrip;
    fontSize: 14;
    skinClass: ClassReference("spark.skins.mobile.TextAreaSkin");
}

.button
{
    fontFamily: comicStrip;
    fontSize: 14;
    fontWeight: normal;
    skinClass: ClassReference("spark.skins.mobile.ButtonSkin");
}

.label
{
    fontFamily: comicStrip2;
    fontSize: 14;
    fontWeight: normal;
}

嵌入式字体在Flex移动ActionBar中无法使用

6 个答案: