Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

UICollectionView iOS 9 issue on project with RTL languages support

It seems like Apple's new feature of auto-flip interface on RTL languages cause problems when using UICollectionView.

I used constraints of type Trailing/Leading for the collection view and they switched their values, as they should, on RTL language.

The problem is that the data actually presented is of the last indexPath in the collection's data source but the UIScrollView.contentOffset.x of the first cell is 0.

A proper behaviour would have been one of the following:

  1. Displaying the first indexPath correctly and switching the direction of the scroll (to the right) - Best option
  2. Not flipping the UI/Constraints so the presented-data / indexPath / scrollView.contentOffset.x will be synchronised - Option that disabling the RTL support.
  3. Presenting cell and data of the last indexPath but fixing the scrollView.contentOffset.x to represent the last cell position also.

I guess Apple might fix it sometime in the future but meanwhile we'll have to use workarounds like reversing array and/or scrolling to the last object.

like image 865
MatanGold Avatar asked Oct 14 '15 16:10

MatanGold


2 Answers

I was in a similar situation and found a solution for this. If you are using swift, add the following snippet to your project, and it will make sure that the bounds.origin always follows leading edge of the collection view.

extension UICollectionViewFlowLayout {

    open override var flipsHorizontallyInOppositeLayoutDirection: Bool {
        return true
    }
}

If you are using Objective-C, just subclass the UICollectionViewLayout class, and override flipsHorizontallyInOppositeLayoutDirection, and return true. Use this subclass as the layout object of your collection view.

like image 186
Suran Avatar answered Nov 06 '22 19:11

Suran


I am late but if you don't want to create an extension because it will affect all the collection View in our app. Simply create your own custom class ie.

class CustomLayoutForLocalization : UICollectionViewFlowLayout{
    open override var flipsHorizontallyInOppositeLayoutDirection: Bool {
         return true
    } 
}

To use this class:

// your way of deciding on whether you need to apply this layout may vary depending on use of other tools like LanguageManager_iOS to handle multi-language support
if myCollectionView.effectiveUserInterfaceLayoutDirection == .rightToLeft  {
    let customLayout = CustomLayoutForRTL()
    // if your elements are variable size use the following line
    customLayout.estimatedItemSize = UICollectionViewFlowLayout.automaticSize
    // if you want horizontal scroll (single line)
    customLayout.scrollDirection = .horizontal
    myCollectionView.collectionViewLayout = customLayout
}
like image 24
Muhammad Ali Avatar answered Nov 06 '22 20:11

Muhammad Ali