草庐IT

android - @font-face 字体在所有 Android 版本上呈现不一致

coder 2023-12-24 原文

我正在尝试为阿拉伯语使用自定义的 Roboto 字体,但未能在 PhoneGap/Android 应用程序中正确呈现它:

  • 在 Galaxy ACE (Android 2.3.2) 上,我的应用程序可以正确呈现阿拉伯字符(参见图片#1)。
  • 在 Galaxy S3 和 S4 (Android 4.3) 上,我的应用程序使用默认字体呈现阿拉伯字符(参见图片#2)。

图片#1

图片#2

html 页面

<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

    <style type="text/css">
    @font-face {
        font-family: 'ArabicFont';
        src: url("fonts/KacstTitle.ttf") format("truetype");
    }
    @font-face {
        font-family: 'LatinFont';
        src: url("fonts/DejaVuSerif.ttf") format("truetype");
    }

    .arabicText {
        font-family: ArabicFont;
        direction: rtl;
    }
    .latinText {
        font-family: LatinFont;
        direction: ltr;
    }
    .center {
        text-align: center;
    }
    </style>

</head>

<body>
    <div id="main">
        <div id="libreOfficeRendering" class="center">
            <hr/>
            <label>LibreOffice Rendering</label>
            <hr/>
            <img src="images/libreOfficeRendering.png">
        </div>
        <br/>
        <br/>

        <div id="googleChromeRendering" class="center">
            <hr/>
            <label>Google-Chrome Rendering</label>
            <hr/>
            <img src="images/googleChromeRendering.png">
        </div>
        <br/>
        <br/>

        <div id="androidAndPhoneGabRendering" class="center">
            <hr/>
            <label>Actual Rendering</label>
            <hr/>
            <pre class="arabicText">أنا نص بحروف عربية (KacstTitle).</pre>
            <pre class="latinText">I'm a text in Latin characters (DejaVu Serif).</pre>
        </div>
    </div>
</body>

</html>

最佳答案

尝试测试这样的东西,看看它是否可能是 <pre> 的问题标签和/或 html :

<span class="arabicText">&#x623;&#x646;&#x627; &#x646;&#x635; &#x628;&#x62D;&#x631;&#x648;&#x641; &#x639;&#x631;&#x628;&#x64A;&#x629;</span>

<pre class="arabicText">&#x623;&#x646;&#x627; &#x646;&#x635; &#x628;&#x62D;&#x631;&#x648;&#x641; &#x639;&#x631;&#x628;&#x64A;&#x629;</pre>

<span class="arabicText">أنا نص بحروف عربية</span>

<pre class="arabicText">أنا نص بحروف عربية</pre>

如果其中任何一个在有问题的设备上正确呈现,也许它可以帮助缩小问题范围。

另一种可能性是我最近遇到的一件奇怪的事情,在某些浏览器中(看似随机),字体由 @font-face 定义除非我格式化 font-family 否则不会呈现名称​​在以后使用时包括标点符号完全相同。所以你可以尝试包装 font-family在所有情况下都用引号引起来:

@font-face {
    font-family: 'ArabicFont'; /* has quotes */
    src: url("fonts/KacstTitle.ttf") format("truetype");
}
.arabicText {
    font-family: 'ArabicFont'; /* has quotes */
    direction: rtl;
}

或在所有情况下删除引号:

@font-face {
    font-family: ArabicFont; /* no quotes */
    src: url("fonts/KacstTitle.ttf") format("truetype");
}
.arabicText {
    font-family: ArabicFont; /* no quotes */
    direction: rtl;
}

希望其中之一能帮助您。最后想到 - 您引用的文件名与实际保存方式之间的文件名是否存在大小写差异?

关于android - @font-face 字体在所有 Android 版本上呈现不一致,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22223397/

有关android - @font-face 字体在所有 Android 版本上呈现不一致的更多相关文章

  1. ruby-on-rails - 在 heroku 的 .fonts 文件夹中包含自定义字体,似乎无法识别它们 - 2

    Heroku支持人员告诉我,为了在我的Web应用程序中使用自定义字体(未安装在系统中,您可以在bash控制台中使用fc-list查看已安装的字体)我必须部署一个包含所有字体的.fonts文件夹里面的字体。问题是我不知道该怎么做。我的意思是,我不知道文件名是否必须遵循heroku的任何特殊模式,或者我必须在我的代码中做一些事情来考虑这种字体,或者如果我将它包含在文件夹中它是自动的......事实是,我尝试以不同的方式更改字体的文件名,但根本没有使用该字体。为了提供更多详细信息,我们使用字体的过程是将PDF转换为图像,更具体地说,使用rghostgem。并且最终图像根本不使用自定义字体。在

  2. 安卓apk修改(Android反编译apk) - 2

    最近因为项目需要,需要将Android手机系统自带的某个系统软件反编译并更改里面某个资源,并重新打包,签名生成新的自定义的apk,下面我来介绍一下我的实现过程。APK修改,分为以下几步:反编译解包,修改,重打包,修改签名等步骤。安卓apk修改准备工作1.系统配置好JavaJDK环境变量2.需要root权限的手机(针对系统自带apk,其他软件免root)3.Auto-Sign签名工具4.apktool工具安卓apk修改开始反编译本文拿Android系统里面的Settings.apk做demo,具体如何将apk获取出来在此就不过多介绍了,直接进入主题:按键win+R输入cmd,打开命令窗口,并将路

  3. ruby - Ruby gsub 替换中的行为不一致? - 2

    两个gsub产生不同的结果。谁能解释一下为什么?代码也可在https://gist.github.com/franklsf95/6c0f8938f28706b5644d获得.ver=9999str="\tCFBundleDevelopmentRegion\n\ten\n\tCFBundleVersion\n\t0.1.190\n\tAppID\n\t000000000000000"putsstr.gsub/(CFBundleVersion\n\t.*\.).*()/,"#{$1}#{ver}#{$2}"puts'--------'putsstr.gsub/(CFBundleVersio

  4. ruby - Hanami link_to 助手只呈现最后一个元素 - 2

    我是HanamiWorld的新人。我已经写了这段代码:moduleWeb::Views::HomeclassIndexincludeWeb::ViewincludeHanami::Helpers::HtmlHelperdeftitlehtml.headerdoh1'Testsearchengine',id:'title'hrdiv(id:'test')dolink_to('Home',"/",class:'mnu_orizontal')link_to('About',"/",class:'mnu_orizontal')endendendendend我在模板上调用了title方法。htm

  5. ruby - Mongoid 3 中 Rails 模型的强一致性 - 2

    我希望特定模型的所有数据库交互都通过集群中的mongo主节点,因此我将模型设置为使用强一致性。classPhotoincludeMongoid::Documentwithconsistency::strongfield:number,type:Integer#let'ssayaphotonumberisuniqueinthedbvalidate:unique_numberend但这似乎不起作用,因为当我保存两张非常靠近的照片时,我仍然遇到验证错误。photo1#dbhasnumber=1forthisobjectphoto1.update_attributes(number:2)pho

  6. ruby-on-rails - 我将 Rails3 与 tinymce 一起使用。如何呈现用户关闭浏览器javascript然后输入xss? - 2

    我有一个用Rails3编写的站点。我的帖子模型有一个名为“内容”的文本列。在帖子面板中,html表单使用tinymce将“content”列设置为textarea字段。在首页,因为使用了tinymce,post.html.erb的代码需要用这样的原始方法来实现。.好的,现在如果我关闭浏览器javascript,这个文本区域可以在没有tinymce的情况下输入,也许用户会输入任何xss,比如alert('xss');.我的前台会显示那个警告框。我尝试sanitize(@post.content)在posts_controller中,但sanitize方法将相互过滤tinymce样式。例如

  7. ruby-on-rails - 让字体在 Rails 3.1 中工作? - 2

    不知道怎么回事。看来我做对了。我正在尝试使用FontAwesome在我的应用程序中,但字体没有出现。我有一个名为fonts的文件夹,在我的application.rb中包含以下行:classApplication而不是拥有Font-Awesome附带的2个css文件(更改见下文)(不需要IE7文件)我只是将主要的css放在我的应用程序.css。比我更改url来检测字体文件。@font-face{font-family:"FontAwesome";src:url('');src:url('')format('woff'),url('')format('truetype'),url('')

  8. ruby-on-rails - Rails 不呈现 public/index.html 文件;浏览器中的空白页面 - 2

    当我将我的Rails+React应用程序部署到Heroku时,我遇到了问题。React客户端位于Rails应用程序的client/目录中。由于使用了react-router,Rails服务器需要知道从React构建中渲染index.html。当我在Heroku上部署客户端时,脚本将内容从client/build/.复制到Rails应用程序的public/目录。现在问题来了:当我的路由检测到类似example.com/about的路径时,它会尝试呈现public/index.html。方法如下:deffallback_index_htmlrenderfile:"public/index.

  9. ruby-on-rails - 如何在 Rails 中正确呈现嵌套评论? - 2

    我试图让嵌套评论在Rails5应用程序中正常工作,但遇到了很多困难。我正在构建一个问答网站,我有一个Acomment模型,其中有属于答案的评论,还有属于其他评论的评论:classAcomment我想显示所有评论,然后显示所有对评论的回复,以及对回复的回复等。但是我不知道如何使嵌套正常工作。在我看来,在每个循环中,我正在渲染_comment.html.erb部分:"comment",:object=>comment%>然后,在我的_comment.html.erb局部中,我显示评论、回复链接,然后呈现评论回复的局部:comment,:answer_id=>comment.answer)i

  10. ruby - 为什么 Gemfile 语义版本控制运算符 (~>) 会产生与一个数字不一致的结果? - 2

    gemspec语义版本控制运算符~>(又名twiddle-wakka,又名pessimistic运算符)允许限制gem版本但允许进行一些升级。我经常看到它可以读作:"~>3.1"=>"Anyversion3.x,butatleast3.1""~>3.1.1"=>"Anyversion3.1.x,butatleast3.1.1"但是有了一个数字,这条规则就失效了:"~>3"=>"Anyversionx,butatleast3"*NOTTRUE!*"~>3"=>"Anyversion3.x"*True.Butwhy?*如果我想要“任何版本3.x”,我可以只使用“~>3.0”,这是一致的。就

随机推荐