CssRect abstract#

A class for representing CSS dimensions.

In contrast to the more general purpose Rectangle class, this class's values are mutable, so one can change the height of an element programmatically.

Important note: use of these methods will perform CSS calculations that can trigger a browser reflow. Therefore, use of these properties during an animation frame is discouraged. See also: Browser Reflow

Constructors#

CssRect()#

CssRect(this._element);

Properties#

bottom no setter#

The y-coordinate of the bottom edge.

num get bottom => top + height;

bottomLeft no setter#

Point<num> get bottomLeft =>
    new Point<num>(this.left, this.top + this.height);

bottomRight no setter#

Point<num> get bottomRight =>
    new Point<num>(this.left + this.width, this.top + this.height);

hashCode no setter override#

The hash code for this object.

A hash code is a single integer which represents the state of the object that affects operator == comparisons.

All objects have hash codes. The default hash code implemented by Object represents only the identity of the object, the same way as the default operator == implementation only considers objects equal if they are identical (see identityHashCode).

If operator == is overridden to use the object state instead, the hash code must also be changed to represent that state, otherwise the object cannot be used in hash based data structures like the default Set and Map implementations.

Hash codes must be the same for objects that are equal to each other according to operator ==. The hash code of an object should only change if the object changes in a way that affects equality. There are no further requirements for the hash codes. They need not be consistent between executions of the same program and there are no distribution guarantees.

Objects that are not equal are allowed to have the same hash code. It is even technically allowed that all instances have the same hash code, but if clashes happen too often, it may reduce the efficiency of hash-based data structures like HashSet or HashMap.

If a subclass overrides hashCode, it should override the operator == operator as well to maintain consistency.

int get hashCode => Object.hash(left, top, right, bottom);

height read / write override-getter#

getter:

The height of this rectangle.

This is equivalent to the height function in jQuery and the calculated height CSS value, converted to a dimensionless num in pixels. Unlike Element.getBoundingClientRect, height will return the same numerical height if the element is hidden or not.

setter:

Set the height to newHeight.

newHeight can be either a num representing the height in pixels or a Dimension object. Values of newHeight that are less than zero are converted to effectively setting the height to 0. This is equivalent to the height function in jQuery and the calculated height CSS value, converted to a num in pixels.

Note that only the content height can actually be set via this method.

num get height;

set height(dynamic newHeight) {
  throw new UnsupportedError("Can only set height for content rect.");
}

left no setter override#

The x-coordinate of the left edge.

num get left;

right no setter#

The x-coordinate of the right edge.

num get right => left + width;

runtimeType no setter inherited#

A representation of the runtime type of the object.

Inherited from Object.

external Type get runtimeType;

top no setter override#

The y-coordinate of the top edge.

num get top;

topLeft no setter#

Point<num> get topLeft => new Point<num>(this.left, this.top);

topRight no setter#

Point<num> get topRight => new Point<num>(this.left + this.width, this.top);

width read / write override-getter#

getter:

The width of this rectangle.

This is equivalent to the width function in jQuery and the calculated width CSS value, converted to a dimensionless num in pixels. Unlike Element.getBoundingClientRect, width will return the same numerical width if the element is hidden or not.

setter:

Set the current computed width in pixels of this element.

newWidth can be either a num representing the width in pixels or a Dimension object. This is equivalent to the width function in jQuery and the calculated width CSS value, converted to a dimensionless num in pixels.

Note that only the content width can be set via this method.

num get width;

set width(dynamic newWidth) {
  throw new UnsupportedError("Can only set width for content rect.");
}

Methods#

boundingBox()#

Returns a new rectangle which completely contains this and other.

Rectangle<num> boundingBox(Rectangle<num> other) {
  var right = max(this.left + this.width, other.left + other.width);
  var bottom = max(this.top + this.height, other.top + other.height);

  var left = min(this.left, other.left);
  var top = min(this.top, other.top);

  return new Rectangle<num>(left, top, right - left, bottom - top);
}

containsPoint()#

Tests whether another is inside or along the edges of this.

bool containsPoint(Point<num> another) {
  return another.x >= left &&
      another.x <= left + width &&
      another.y >= top &&
      another.y <= top + height;
}

containsRectangle()#

Tests whether this entirely contains another.

bool containsRectangle(Rectangle<num> another) {
  return left <= another.left &&
      left + width >= another.left + another.width &&
      top <= another.top &&
      top + height >= another.top + another.height;
}

intersection()#

Computes the intersection of this and other.

The intersection of two axis-aligned rectangles, if any, is always another axis-aligned rectangle.

Returns the intersection of this and other, or null if they don't intersect.

Rectangle<num>? intersection(Rectangle<num> other) {
  var x0 = max(left, other.left);
  var x1 = min(left + width, other.left + other.width);

  if (x0 <= x1) {
    var y0 = max(top, other.top);
    var y1 = min(top + height, other.top + other.height);

    if (y0 <= y1) {
      return new Rectangle<num>(x0, y0, x1 - x0, y1 - y0);
    }
  }
  return null;
}

intersects()#

Returns true if this intersects other.

bool intersects(Rectangle<num> other) {
  return (left <= other.left + other.width &&
      other.left <= left + width &&
      top <= other.top + other.height &&
      other.top <= top + height);
}

noSuchMethod() inherited#

Invoked when a nonexistent method or property is accessed.

A dynamic member invocation can attempt to call a member which doesn't exist on the receiving object. Example:

dynamic object = 1;
object.add(42); // Statically allowed, run-time error

This invalid code will invoke the noSuchMethod method of the integer 1 with an Invocation representing the .add(42) call and arguments (which then throws).

Classes can override noSuchMethod to provide custom behavior for such invalid dynamic invocations.

A class with a non-default noSuchMethod invocation can also omit implementations for members of its interface. Example:

class MockList<T> implements List<T> {
  noSuchMethod(Invocation invocation) {
    log(invocation);
    super.noSuchMethod(invocation); // Will throw.
  }
}
void main() {
  MockList().add(42);
}

This code has no compile-time warnings or errors even though the MockList class has no concrete implementation of any of the List interface methods. Calls to List methods are forwarded to noSuchMethod, so this code will log an invocation similar to Invocation.method(#add, [42]) and then throw.

If a value is returned from noSuchMethod, it becomes the result of the original invocation. If the value is not of a type that can be returned by the original invocation, a type error occurs at the invocation.

The default behavior is to throw a NoSuchMethodError.

Inherited from Object.

@pragma("vm:entry-point")
@pragma("wasm:entry-point")
external dynamic noSuchMethod(Invocation invocation);

toString() override#

A string representation of this object.

Some classes have a default textual representation, often paired with a static parse function (like int.parse). These classes will provide the textual representation as their string representation.

Other classes have no meaningful textual representation that a program will care about. Such classes will typically override toString to provide useful information when inspecting the object, mainly for debugging or logging.

String toString() {
  return 'Rectangle ($left, $top) $width x $height';
}

Operators#

operator ==() override#

The equality operator.

The default behavior for all Objects is to return true if and only if this object and other are the same object.

Override this method to specify a different equality relation on a class. The overriding method must still be an equivalence relation. That is, it must be:

• Total: It must return a boolean for all arguments. It should never throw.

• Reflexive: For all objects o, o == o must be true.

• Symmetric: For all objects o1 and o2, o1 == o2 and o2 == o1 must either both be true, or both be false.

• Transitive: For all objects o1, o2, and o3, if o1 == o2 and o2 == o3 are true, then o1 == o3 must be true.

The method should also be consistent over time, so whether two objects are equal should only change if at least one of the objects was modified.

If a subclass overrides the equality operator, it should override the hashCode method as well to maintain consistency.

bool operator ==(other) =>
    other is Rectangle &&
    left == other.left &&
    top == other.top &&
    right == other.right &&
    bottom == other.bottom;