Dart Polymer 1.0 Behavior – method not found & getters required

Issue

I wanted to write a simple behavior in Dart to be used by a custom element.

@behavior
abstract class AlignmentBehavior implements PolymerBase {

  @Property()
  bool alignTop = false;
  // more properties ...

  ready() {
    updateAlignment();
  }

  @reflectable
  updateAlignment([_,__]) {
    // reference to the element the Behavior is attached to. 
    // 1) Is that the correct way?
    var ele = Polymer.dom(root);

    // We need to inherit from PolymerBase to access set(...)
    // 2) Is that the correct way?
    set('alignTop', aTop);
    // .. to more stuff
  }

}

My first two questions are already written in the code. How do I access the element the behavior is attached to? What’s the proper way of doing this? I currently use Polymer.dom(root) but I don’t know if that even works since I have some runtime errors which I am going to explain later in this post. What is the official way of accessing the underlying element? Is it using the JsObject? Is it calling a Behavior function from the parent PolymerElement and pass this, or should you not access it at all?

Another question is whether I have to inherit from PolymerBase or not. The Behavior example at the Github wiki doesn’t do so, but in order to access methods such as set to modify a @Property I have to inherit from it. What’s the proper way of doing so?

My last two questions are about errors I get. One error asks me to implement getters and setters for my properties, such as adding a getter and setter for alignTop.
And last but not least, I cannot invoke updateAlignment() from my custom element. It says Class 'MainApp' has no instance method 'updateAlignment'.

Solution

1)

var ele = Polymer.dom(root);

If you want to access the DOM of the element, this fine.
Just root gives you the same AFAIK.

If you want to access the elements class instance, there is nothing to do. It’s this but that is implicit in Dart anyway.
You can only access what is known in the mixin. To make “things” known to the mixin you can create an interface class.

abstract class MyComponentInterface {
  void someFunction();
  int someField;
  String get someValue;
  set someValue(String value);
  ...
}

Then implement the interface in the mixin and the element class and you have a shared contract.

abstract class AlignmentBehavior implements MyComponentInterface, PolymerBase {

The mixin can now access the members because the implementsMyComponentInterface` claims they will exist and

class MyComponent extends PolymerElement with AlignmentBehavior {

will force you to implement it to fulfill the contract of the mixin.

2) looks fine

3)

Another question is whether I have to inherit from PolymerBase or not.

Is basically the same as 1) Any Polymer element in Dart has to extend PolymerBase. To be able to access the members of PolymerBase from within the mixin it has to implement it as well. This doesn’t result in any limitations because the classes that the mixin will be applied to, will fulfill that contract anyway.

If you don’t need to access any members provided by PolymerBase there is no need to implement it.

Answered By – Günter Zöchbauer

Answer Checked By – Mildred Charles (FlutterFixes Admin)

Leave a Reply

Your email address will not be published.