enhance UiRect with convenience methods

[pubrrr]

What problem does this solve or what need does it fill?

Rect, UiRect respectively after #4276 is merged, is a plain data structure representing rectangles used for UI. There are certain computations associated to rectangles, that users might frequently need.

What solution would you like?

Offer convenience methods such as

• center(&self) -> Point
• translate(self, Vec2) -> Self,
• ...

Additional context

Egui already has a similar struct.

[mockersf]

Rect/UiRect is not really a rectangle, it's informations about each side of a rectangle: the width of the border, the margins, ...
So center or translate don't really make sense for this

[ghost]

Adding to what @mockersf said:

I think the Rect that should be updated here is not the Rect/UiRect from bevy_math/bevy_ui but the Rect from bevy_sprite. This one also has two points like the one in egui and offers the same width, height and size methods. For this Rect it would make sense to have something like a center function.

bevy_math

/// A rect, as defined by its "side" locations
#[derive(Copy, Clone, PartialEq, Debug, Reflect)]
#[reflect(PartialEq)]
pub struct Rect<T: Reflect + PartialEq> {
    pub left: T,
    pub right: T,
    pub top: T,
    pub bottom: T,
}

bevy_sprite

/// A rectangle defined by two points. There is no defined origin, so 0,0 could be anywhere
/// (top-left, bottom-left, etc)
#[repr(C)]
#[derive(Default, Clone, Copy, Debug, Reflect)]
pub struct Rect {
    /// The beginning point of the rect
    pub min: Vec2,
    /// The ending point of the rect
    pub max: Vec2,
}

[pubrrr]

For my understanding: What is the difference between those two Rects? How are they supposed to be used?

[ghost]

Rect/UiRect from bevy_math/bevy_ui

The Rect/UiRect from bevy_math/bevy_ui is used to define a size for each side of a rectangle (e.g. position, margin, padding, borders). So essentially stuff like "How large should my padding on the left be?" or "How thick should the right border be?".

For more details about how the UiRect is used you can read through the documentation here.

Rect from bevy_sprite

The Rect from bevy_sprite is used to define an actual rectangle. This is for example used in the TextureAtlas to define the area/ the rectangle of every sprite that is located inside of it (see TextureAtlas).

[pubrrr]

Isn't it a bit weird to express a position or a margin as a rectangle? At least for me this sounds really confusing.

[mockersf]

The name isn't very good... Don't hesitate if you have a better idea in #4276

[dtaralla]

Since #5686 was merged and the center() method now exists on bevy_math::Rect, should this be closed or can I mirror additional utility methods from egui? Like

• shrink(self, amount: Vec2) -> Rect (Shrinks or dilates)
• translate(self, amount: Vec2) -> Rect

There are other methods like rotate_bb(), to get the bounding box of a rotated rect, but I'm not sure if these would be nice to have too. Translation and dilation seem basic enough that some users might look for them at some point I guess. I didn't find any sites in bevy or examples where any of these would be useful though. I think it might be better to close this issue as resolved by #5686?

[viridia]

Naming suggestion: "Insets".

[Jax-Hax]

Should there be a way to convert between the two? Then it would allow for building a Rect in bevy_math then converting it to a UIRect in bevy_ui. Or should there be the corresponding functions like center() on the UIRect as well? Sorry if these already exist, trying to find my first contribution and I don't really know what I'm doing.

[theotherphil]

I'm another new user who's stumbled across this issue while looking to make a first contribution to Bevy and is not sure what, if anything, needs to actually be done here.

I think this issue is either fixed by #5686 or is too vague to be actionable.

I'm not sure what the etiquette is for pinging maintainers, so I'll just ask @alice-i-cecile directly: do you agree that this issue should be closed, or is there something specific required to resolve it?

[viridia]

Other name suggestions:

• UiEdgeWidths
• UiEdges
• UiSides
• UiInsets
• UiMargins

[alice-i-cecile]

I think this should be closed. I'm not opposed to more utility methods, but I don't think this is a useful place to start.