Skip to content

paddingStart overrides paddingHorizontal except when paddingStart is 0 #815

@rigdern

Description

@rigdern

Consider these two examples that set paddingHorizontal and paddingStart:

  1. Style: { paddingHorizontal: 10, paddingStart: 3 }. Computed layout: paddingStart: 3
  2. Style: { paddingHorizontal: 10, paddingStart: 0 }. Computed layout: paddingStart: 10

As you can see, paddingStart overrides paddingHorizontal when paddingStart is 3 but not when it's 0.

It looks like this code is responsible for the special behavior when paddingStart is 0 since it checks paddingEdgeStart.getValue() > 0.0f.

Here's an example C program which illustrates this behavior:

#include <stdio.h>
#include "Yoga.h"

int main(int argc, const char * argv[]) {
    const YGConfigRef config = YGConfigNew();
    
    const YGNodeRef root = YGNodeNewWithConfig(config);
    YGNodeStyleSetFlexDirection(root, YGFlexDirectionRow);
    
    const YGNodeRef root_child0 = YGNodeNewWithConfig(config);
    YGNodeStyleSetPadding(root_child0, YGEdgeHorizontal, 10);
    YGNodeStyleSetPadding(root_child0, YGEdgeStart, 0 /* also try 3 */);
    YGNodeInsertChild(root, root_child0, 0);
    
    YGNodeCalculateLayout(root, 500, 500, YGDirectionLTR);
    YGNodePrint(root, YGPrintOptionsChildren | YGPrintOptionsStyle | YGPrintOptionsLayout);
    
    YGNodeFreeRecursive(root);
    
    YGConfigFree(config);
    return 0;
}

When running this program with a paddingStart of 0, you'll see that the node's width is 20 (paddingStart + paddingEnd = 10 + 10 = 20). When paddingStart is 3, the node's width is 13 (paddingStart + paddingEnd = 3 + 10 = 13).

It looks like 3a82d2b?diff=unified&w=1#diff-07b4949bf42749fde386e769ff08a124 changed it from >= to > in getLeadingPadding. I suspect it was a mistake. getTrailingPadding still uses >=.

Adam Comella
Microsoft Corp.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions