Skip to content

Rounding errors can accumulate and cause nodes to expand each time a layout is recomputed #501

@ickshonpe

Description

@ickshonpe

taffy version

0.3.10 and main 868b85d

What you did

use taffy::prelude::*;
use taffy::util::print_tree;

fn main() {
    let mut taffy = Taffy::new();

    let inner = taffy.new_leaf(Style { min_size: Size { width: length(300.), height: auto() }, ..Default::default() }).unwrap();
    let wrapper = taffy.new_with_children( 
        Style {
            size: Size { width: length(150.), height: auto() },
            justify_content: Some(JustifyContent::End),
            ..Default::default()
        }, 
        &[inner]
    ).unwrap();
    let outer = taffy.new_with_children( 
        Style {
            size: Size { width: percent(100.), height: auto() },            
            inset: Rect { left: length(1.5), right: auto(), top: auto(), bottom: auto() },
            ..Default::default()
        },
        &[wrapper]
    ).unwrap();
    let viewport =  taffy.new_with_children(
        Style { 
            size: Size { width: length(1920.),height: length(1080.) },
            ..Default::default()
        },
        &[outer]
    ).unwrap();
    for _ in 0..3 {
        taffy.mark_dirty(viewport).ok();
        taffy.compute_layout(viewport, Size::MAX_CONTENT).ok();
        print_tree(&taffy, viewport);
        println!();
    }
}

What went wrong

TREE
└──  FLEX [x: 0    y: 0    width: 1920 height: 1080] (NodeId(4294967300))
    └──  FLEX [x: 2    y: 0    width: 1920 height: 1080] (NodeId(4294967299))
        └──  FLEX [x: 0    y: 0    width: 150  height: 1080] (NodeId(4294967298))
            └──  LEAF [x: -150 y: 0    width: 301  height: 1080] (NodeId(4294967297))

TREE
└──  FLEX [x: 0    y: 0    width: 1920 height: 1080] (NodeId(4294967300))
    └──  FLEX [x: 2    y: 0    width: 1920 height: 1080] (NodeId(4294967299))
        └──  FLEX [x: 0    y: 0    width: 150  height: 1080] (NodeId(4294967298))
            └──  LEAF [x: -150 y: 0    width: 302  height: 1080] (NodeId(4294967297))

TREE
└──  FLEX [x: 0    y: 0    width: 1920 height: 1080] (NodeId(4294967300))
    └──  FLEX [x: 2    y: 0    width: 1920 height: 1080] (NodeId(4294967299))
        └──  FLEX [x: 0    y: 0    width: 150  height: 1080] (NodeId(4294967298))
            └──  LEAF [x: -150 y: 0    width: 303  height: 1080] (NodeId(4294967297))

The width of the inner node expands by a pixel each time the layout is recomputed.

Additional information

This only happens when rounding is enabled.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions