Skip to content

Vertical dividers working on iOS but not Android #312

Description

@kutothe

What were you trying to do?

I'm having trouble trying to implement vertical dividers. I can't get it to take up the full height of the parent. I tried using columns and then rect (shape), but haven't had any luck. The docs seem to suggest you could use :height="100%" but adding the percent sign throws a syntax error when I try it.

What happened?

iOS:

Image

Android:

Image

Error when using 100%:

Image

How to reproduce the bug

<row class="w-full p-4 gap-3 bg-theme-surface-variant rounded-xl mb-3">
    <column class="w-[80px]">
        <text class="text-sm text-right font-semibold text-theme-on-surface">5:45 - 9pm</text>
    </column>
    <column class="w-[3px] bg-theme-primary" :height="100%" />
    <column class="flex-1 py-1">
        <text class="font-bold leading-[1.3] text-theme-on-surface-variant">Event Title</text>
        <text class="py-2 text-sm leading-[1.2] text-theme-on-surface-variant">Building and Room</text>
        <text>asdfasdf</text>
        <text>asdf</text>
        <text>asdfasdf</text>
        <text>asdf</text>
    </column>
</row>

Debug Output

INFO NativePHP Mobile.

+--------------------+----------+
| Package Version | dev-main |
| PHP Version (Host) | 8.4.23 |
| OS | Darwin |
| OS Version | 25.6.0 |
| Embedded PHP | 8.4.23 |
+--------------------+----------+

INFO Installed Plugins.

+---------------------+---------+
| Package | Version |
+---------------------+---------+
| nativephp/mobile-ui | 0.3.0 |
+---------------------+---------+

INFO Development Tools.

+----------------+--------------------------------------+
| Xcode | Xcode 26.6 |
| Android Studio | Android Studio AndroidStudio2026.1.2 |
| Gradle | Gradle 8.14.5 |
| Java | openjdk version "17.0.15" 2025-04-15 |
| CocoaPods | CocoaPods 1.16.2 |
+----------------+--------------------------------------+

Which operating systems have you seen this occur on?

macOS

Which platforms were you trying to build for?

Android (Device)

Notes

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions