Uploaded image for project: 'Titanium SDK/CLI'
  1. Titanium SDK/CLI
  2. TIMOB-26211

iOS: Percentage based layout rounds floating widths/heights incorrectly

    Details

    • Story Points:
      5
    • Sprint:
      2016 Sprint 17 SDK

      Description

      Summary:
      iOS will incorrectly wrap views within a horizontal layout if their percentage based widths total to 100%. This is not an issue on Android.

      Steps to reproduce:

      1. Build and run HorizontalPercent50x50Test.js on iOS.
      2. Note that the left view width is 50% and the right view width is 50%.
      3. Observe the layout.

      Result:
      On iOS, the right view is wrongly wrapped to the next row.

      Expected Result:
      Both views are expected to be on the same row since they both have a width of 50%. Android does this correctly as seen here...

      Work-Around:
      Use Ti.UI.FILL to the right-most view's width property instead of using a percentage.

      Note:
      The attached HorizontalFillTest.js provides a more complex horizontal layout test. iOS has 2 issues with this as well:

      • The Left (50%) | Right (50%) test shows that the views are wrongly shrunk to 25% width instead of 50%.
      • The yellow (75%) label does not have the same width as the (25%)|(50%) labels above it.

      iOS looks like this...

      Android handles it correctly as can be seen here...

        Attachments

          Issue Links

            Activity

              People

              • Assignee:
                hknoechel Hans Knöchel
                Reporter:
                jquick Joshua Quick
                Reviewer:
                Joshua Quick
                Tester:
                Keerthi Mahalingam
              • Watchers:
                1 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:

                  Backbone Issue Sync

                  • Titanium SDK/CLI <> Titanium Mobile
                    Synced with:
                    TIMOB-6460
                    Sync status:
                    ERROR
                    Last received:
                    Last sent:

                    Git Source Code