Opened 4 years ago

Closed 4 years ago

Last modified 4 years ago

#3550 closed defect (fixed)

[Adblock Browser for iOS] [Settings] Misaligned text in Arabic

Reported by: Shikitita Assignee:
Priority: P2 Milestone: Adblock-Browser-for-iOS-1.3.0
Module: Adblock-Browser-for-iOS Keywords: salsita
Cc: pavelz, jand, mario Blocked By:
Blocking: Platform: Adblock Browser for iOS
Ready: yes Confidential: no
Tester: Shikitita Verified working: yes
Review URL(s):

Description (last modified by Shikitita)

Environment

Platform: iPhone 6
Operating system: iOS 9.1
Browser: Adblock Browser v1.2.1 (core 1.3.3)

How to reproduce

  1. Install Adblock Browser for iOS for the first time
  2. Change the iPhone's language into Arabic
  3. Access Adblock Browser for iOS by tapping on its icon in the Home screen
  4. After going through the onboarding slides, access the settings by tappin on the icon at the bottom of the screen and then on Settings (إعدادات)

Observed behaviour

The texts of all prompt buttons and check marks are aligned to the left as shown in these screenshots:

Expected behaviour

The texts of prompt buttons and check marks should be aligned towards the right so that in can be read properly as well as being visually appealing.

iOS8 vs iOS9

According to different findings on Internet in regards to the differences between iOS 8 and iOS 9, iOS 8 does not seem to support the display of the UI for RTL texts, only the text itself. That means that any prompt buttons, sections or even swipe direction, will still be displayed/function from left to right.

However, on iOS 9 this was improved according to a Wikipedia article, where the following improvements were implemented:

  • Support for right-to-left languages.
  • Redesigned User Interface for right-to-left languages. (As an Expanded language support improvement)

This can be observed in the following screenshots, where the UI for iOS 8 looks completely different from the iOS 9 UI for RTL languages, obviously the latter being improved for RTL languages.

The same can be then observed in the latest dev build of ABB for iOS 1.3.0:

Possible solution

Best thing to do seems to apply the default RTL UI and text display for iOS 9 as well as RTL text.
For iOS 8, however, we should add a "nbsp" (Alt + 0160) at the "end" of the affected strings on Crowdin in order to avoid concatenation with the prompt buttons.
Also, the consistent display of text aligned towards the right should be respected in both iOS 8 and iOS 9 in order to avoid strings displayed like the one in the "Edit Bookmarks" section.

Attachments (8)

IMG_0010.PNG (51.3 KB) - added by Shikitita 4 years ago.
"URL Search Suggestions" Misalignment in Arabic
IMG_0011.PNG (65.2 KB) - added by Shikitita 4 years ago.
"More Blocking Options" Misalignment in Arabic
IMG_0013.PNG (33.1 KB) - added by Shikitita 4 years ago.
"Search Engine" Misalignment in Arabic
RTL_UI_iOS_8.4.PNG (65.3 KB) - added by Shikitita 4 years ago.
RTL_UI_iOS_9.1.PNG (80.4 KB) - added by Shikitita 4 years ago.
iOS 8 ABB 1.3.0 Dev_build.PNG (46.1 KB) - added by Shikitita 4 years ago.
RTL_iOS 9.PNG (54.5 KB) - added by Shikitita 4 years ago.
Arabic_PromptButton.PNG (51.1 KB) - added by Shikitita 4 years ago.

Download all attachments as: .zip

Change History (22)

Changed 4 years ago by Shikitita

"URL Search Suggestions" Misalignment in Arabic

Changed 4 years ago by Shikitita

"More Blocking Options" Misalignment in Arabic

Changed 4 years ago by Shikitita

"Search Engine" Misalignment in Arabic

comment:1 Changed 4 years ago by mario

  • Component changed from Adblock-Plus-for-iOS to Adblock-Browser-for-iOS
  • Description modified (diff)
  • Platform changed from iOS to Adblock Browser for iOS
  • Ready set

comment:2 Changed 4 years ago by mario

  • Priority changed from Unknown to P2

comment:3 Changed 4 years ago by pavelz

  • Milestone set to Adblock-Browser-for-iOS-1.3.0
  • Resolution set to fixed
  • Status changed from new to closed

comment:4 Changed 4 years ago by Shikitita

  • Resolution fixed deleted
  • Status changed from closed to reopened

comment:5 Changed 4 years ago by Shikitita

  • Description modified (diff)

Changed 4 years ago by Shikitita

Changed 4 years ago by Shikitita

comment:6 Changed 4 years ago by Shikitita

  • Description modified (diff)

Changed 4 years ago by Shikitita

Changed 4 years ago by Shikitita

comment:7 Changed 4 years ago by Shikitita

  • Description modified (diff)

comment:8 Changed 4 years ago by Shikitita

  • Description modified (diff)

comment:9 Changed 4 years ago by Shikitita

  • Description modified (diff)

comment:10 Changed 4 years ago by Shikitita

  • Description modified (diff)

Changed 4 years ago by Shikitita

comment:11 Changed 4 years ago by Shikitita

  • Description modified (diff)

comment:12 Changed 4 years ago by mario

Reopened due to one remaining prompt button being displayed LTR in arabic:

  1. Go to bookmarks
  2. Press and hold an existing bookmark until its context menu appears
  3. Press "edit"

Observed behavior

The prompt button "Show in dashboard" is aligned to the left instead of being aligned to the right in Arabic as shown in this screenshot.

Expected behavior

The prompt button "Show in dashboard" is aligned to the right in Arabic

Last edited 4 years ago by mario (previous) (diff)

comment:13 Changed 4 years ago by pavelz

  • Resolution set to fixed
  • Status changed from reopened to closed

comment:14 Changed 4 years ago by Shikitita

  • Verified working set
Note: See TracTickets for help on using tickets.