Android中RTL布局的适配,阿拉伯语的RTL

图片 1屏幕快照 2019-02-28 上午10.45.28.png

本文为本人原创,转载请注明作者和出处。

iOS做其它的多语言适配,可能只是设计到多语言的翻译,还不会有太大的影响,但是如果要适配阿拉伯语,不仅是语言的翻译,还有他们的使用习惯问题需要适配。他们的语言阅读习惯是RTL(right-to-left,从右往左),而其它地区的是LTR(left-to-right,从左往右)。因此除了语言外,UI也需要做对应的适配,才会符合阿拉伯人的使用习惯。

direction 属性用于控制文本流的方向。

iOS,移动开发,国际化,RTL,阿拉伯语公司项目因为要适配中东市场,也算是做了不少RTL了,但是每次基本上开发结束后都会遇到或多或少的RTL问题...,以下聊些遇到的坑和踩坑记录

因为业务原因,产品需要适配阿拉伯语语、波斯语、乌尔都语。而这三种语言都是从右到左排布的。为了照顾这部分客户的需求需要对整体布局也进行相应的适配。不得不说谷歌真的是很博爱,Android自身留了大量的API以供适配RTL(从右到左)布局。可能有这种需求的人比较少,文章也比较少,特此记录以帮助其他需要的人。

1,添加多语言翻译

图片 2

image.png

按上面的红框的流程就可以加上对应的多语言了

在某些语言中,文本从右向左流动(例如阿拉伯语,波斯语,希伯来语),而许多其他语言从左向右流动(例如英语,西班牙语,法语等)。 在一些情况下,从左到右(LTR)内容和从右到左(RTL)内容两者可以存在于同一文档中。

  1. 普通适配iOS 针对 RTL做过自动兼容的,前提是要使用对约束,不要用 frame,用 frame 苹果不会自动适配的!!!app 约束建议使用 Leading以及Trailing两个约束条件而不是Left和Right,这样苹果会针对约束自动进行左右转换.
  2. 针对 iOS9以上首先,建议根据语言判断一下,是否需要RTL
  • 布局属性
    Android在4.2的时候为了支持RTL布局引入了marginStart、marginEnd等属性来替代marginLeft和marginRight等属性。如果你的APP需要适配4.2以下的版本需要同时设置这两种属性。使用XXXStart、XXXEnd属性来代替XXXLeft、XXXRight属性,无论是正常的布局还是RTL布局都可以正常显示,这样就不用专门写一个layout来适配RTL布局了。

  • u200f转义符
    有的时候英语和阿拉伯语、波斯语混用会出现这种情况:英语从左往右排布,而阿拉伯语从右往左排布。这种情况对于阿拉伯语都用户肯定是混乱的。在字符串首尾加上u200f转义符可以强行让字符串从右往左显示。

  • drawable-ldrtl
    图片也需要适配RTL布局怎么办?和适配其他分辨率之类的一样,将RTL布局需要显示的图片放在drawable-ldrtl文件夹下就可以让图片也适配RTL布局了。

  • autoMirrored属性
    在drawable的xml文件中有autoMirrored这一属性,将其设置为true,就可以让drawable在RTL布局下进行反转。相比于上面的方法这种方法更节省APK空间一点。

  • textDirection属性
    设置textDirection="locale",可以让文字自动适配是不是RTL布局。也可以设置为rtl或ltr让文字永远从右到左或从左到右显示。

  • 根据语言进行适配
    还有其他情况的话可以获取当前系统的语言来进行适配。代码如下:

2,icon的flip。

有些图片时没有方向性的,有些图片时有方向性的,有方向性的icon我们就需要做适配,如back图标。一般情况下,我们的图片时这样的

图片 3

image.png

如果需要做rtl的适配,需要

图片 4

image.png

方向中选中both,然后在左边的图片视图里面就会多一个RTL的视图,再切一个对应的icon就可以了

LTR 文本与 RTL 混合时,将创建双向文本。例如,包含阿拉伯语和英语的行是双向(或双向)文本行。 处理 Bidi 文本时有很多可能的挑战。

3,UIPageController等view的适配

一般都有个引导页,引导页有个页面指示器,切换成ar后,页面指示器的方向还是RTL。因此需要修改下它的属性,在storyboard设置的属性如下

图片 5

image.png

semantic属性默认值是unspecified。
具体这个属性的意义可参考
https://stackoverflow.com/questions/32634774/xcode-7-what-is-the-view-semantic-storyboard-setting
这个属性也可以通过代码中去设置

Unicode 指定由用户代理使用以确定双向内容中的文本的方向的算法。算法基于字符和内容的属性以及对语言“嵌入”和方向覆盖的显式控制来确定内容的定向流。

  isRTLLayout{ //是否要重右到左布局 if([[iOSUtil getLanguage] isEqualToString:@"ar"] || [[iOSUtil getLanguage] isEqualToString:@"he"]){ return YES; }else{ return NO; }}
String language = Locale.getDefault().getLanguage();
if (language.equals("ar") || language.equals("fa") || language.equals("ur")) {
    //RTL布局下的适配修改
}

4,代码中如何判断方向

有时候有些逻辑可能需要在代码中去判断和处理,尤其是对于一些自定义的view,可能需要获取到当前的direction。

let dir = UIApplication.shared.userInterfaceLayoutDirection

这个属性就是个枚举值

@available(iOS 5.0, *)
public enum UIUserInterfaceLayoutDirection : Int {
    case leftToRight
    case rightToLeft
}

它的参数如下:**ltr(默认) | rtl | inherit **

iOS9 后可以设置强制转换模式OC: [UIView appearance].semanticContentAttribute = UISemanticContentAttributeForceRightToLeft;swift: view.semanticContentAttribute = .forceRightToLeft对应的 xib ,sb 设置为

5,leading和left

在storyboard中,在给view添加constraint时,一般都是Leading space和Trailing space。但有时候手写的时候,就写成了left和right相关的属性了。如:

firstview.leadingAnchor.constraint(equalTo: scrollview.leadingAnchor, constant: 0).isActive = true
        firstview.leftAnchor.constraint(equalTo: scrollview.leftAnchor, constant: 0).isActive = true

这两对属性在大部分情况下是一致的,但是在RTL模型中就不合适。因为left和right相当于而是固定了属性,所以如果你需要支持rtl,就必须要使用leading和trailing。

这个属性说实话,我们基本用不上。。。

图片 6屏幕快照 2019-02-28 上午11.00.37.png

6,调试的时候设置调试的语言

如图

图片 7

image.png

图片 8

image.png

选中语言后,close弹窗,运行调试时就是按这个设置的语言来调试的

其实就是控制文字的方向的。

  1. 针对于 collectionView 的国际化设置一般情况下,collectionView 是可以RTL 的,当然,一般情况并不是所有情况,因为真的去测试的时候,会发现可能同样的一套代码, 在 iOS12, iOS11,iOS10, iOS9上,居然可以有分别不同的表现形式...

    本文由星彩网app下载发布于计算机编程,转载请注明出处:Android中RTL布局的适配,阿拉伯语的RTL

    TAG标签: 星彩网app下载
Ctrl+D 将本页面保存为书签,全面了解最新资讯,方便快捷。