Frame

Frame

Animation's Frame

Constructor

new Frame(propertiesopt)

Source:
Name Type Default Description
properties? any {} properties
Example
const frame = new Scene.Frame({
      display: "none"
      transform: {
          translate: "50px",
          scale: "5, 5",
      }
  });

Methods

clear() → {Frame}

Source:
Remove All Properties
Returns:
An instance itself
Type
Frame

clone() → {Frame}

Source:
clone frame.
Example
frame.clone();
Returns:
An instance of clone
Type
Frame

get(…args)

Source:
get property value
Name Type Attributes Description
args Number | String | PropertyObject <repeatable>
property name or value
Example
frame.get("display") // => "none", "block", ....
      frame.get("transform", "translate") // => "10px,10px"

getKeys(...args) → {string[]}

Source:
get property keys
Name Type Description
...args NameType[] property names
Example
frame.gets("display") // => []
      frame.gets("transform") // => ["translate"]
Returns:
Type
string[]

getNames() → {string[][]}

Source:
Gets the names of properties.
Example
// one parameter
  frame.set({
      display: "none",
      transform: {
          translate: "10px, 10px",
          scale: "1",
      },
  });

  // [["display"], ["transform", "translate"], ["transform", "scale"]]
  console.log(frame.getNames());
Returns:
the names of properties.
Type
string[][]

getOrderObject()

Source:
get properties order object
Example
console.log(frame.getOrderObject());

getOrders(names) → {NameType[] | undefined}

Source:
get properties orders
Name Type Description
names NameType[] property names
Example
frame.getOrders(["display"]) // => []
      frame.getOrders(["transform"]) // => ["translate", "scale"]
Returns:
Type
NameType[] | undefined

gets(...args) → {KeyValueChildren[]}

Source:
get properties array
Name Type Description
...args NameType[] property names
Example
frame.gets("display") // => []
      frame.gets("transform") // => [{ key: "translate", value: "10px, 10px", children: [] }]
Returns:
Type
KeyValueChildren[]

has(…args)

Source:
check that has property.
Name Type Attributes Description
args String <repeatable>
property name
Example
frame.has("property", "display") // => true or false

merge(frame) → {Frame}

Source:
merge one frame to other frame.
Name Type Description
frame Frame target frame.
Example
frame.merge(frame2);
Returns:
An instance itself
Type
Frame

remove(…args) → {Frame}

Source:
remove property value
Name Type Attributes Description
args String <repeatable>
property name
Example
frame.remove("display")
Returns:
An instance itself
Type
Frame

set(…args) → {Frame}

Source:
set property
Name Type Attributes Description
args Number | String | PropertyObject <repeatable>
property names or values
Example
// one parameter
  frame.set({
      display: "none",
      transform: {
          translate: "10px, 10px",
          scale: "1",
      },
      filter: {
          brightness: "50%",
          grayscale: "100%"
      }
  });

  // two parameters
  frame.set("transform", {
      translate: "10px, 10px",
      scale: "1",
  });

  // three parameters
  frame.set("transform", "translate", "50px");
Returns:
An instance itself
Type
Frame

setOrderObject(obj)

Source:
set properties orders object
Name Type Description
obj IObject<NameType[]> properties orders object
Example
frame.setOrderObject({
          "": ["transform"],
          "transform": ["scale", "tralsate"],
      });

setOrders(names, orders) → {NameType[]}

Source:
set properties orders
Name Type Description
names NameType[] property names
orders NameType[] orders
Example
frame.getOrders(["transform"]) // => ["translate", "scale"]
      frame.setOrders(["transform"], ["scale", "tralsate"])
Returns:
Type
NameType[]

toCSS() → {string}

Source:
Specifies an css text that coverted the frame.
Returns:
cssText
Type
string

toCSSObject() → {object}

Source:
Specifies an css object that coverted the frame.
Returns:
cssObject
Type
object