2014-12-04 9 views
7

Hallo Leute Hatte jemand eine Idee, wie man benutzerdefinierte HTML-Element als GWT-Widget UiBinder registrieren und sie direkt anstelle von in HTMLPanel verwenden.Wie man Custom HTML Element als Widget in GWT registriert

Für z.B. wenn ich Google Polymer in meinem mgwt Projekt mit Ich bin mit eigenen HTML-Element als

    <g:HTMLPanel > 
        <paper-shadow class="{style.card}"> 
         <mgwt:touch.TouchPanel ui:field="touchPanel"> 
          <mgwt:panel.flex.FlexPanel orientation="VERTICAL" alignment="CENTER"> 
           <g:Image url="{global.getDirection.getSafeUri.asString}" /> 
           <g:HTMLPanel>Take me to Deal</g:HTMLPanel> 
          </mgwt:panel.flex.FlexPanel> 
         </mgwt:touch.TouchPanel> 
        </paper-shadow> 
       </g:HTMLPanel> 

Ich registrieren möchten/erstellen Papier-shadow als benutzerdefinierte Widget so, dass ich Code wie so dass ihre leicht schreiben Händel Ereignisse

   <polymer:paper-shadow class="{style.card}"> 
        <mgwt:touch.TouchPanel ui:field="touchPanel"> 
         <mgwt:panel.flex.FlexPanel orientation="VERTICAL" alignment="CENTER"> 
          <g:Image url="{global.getDirection.getSafeUri.asString}" /> 
          <g:HTMLPanel>Take me to Deal</g:HTMLPanel> 
         </mgwt:panel.flex.FlexPanel> 
        </mgwt:touch.TouchPanel> 
       <polymer:paper-shadow> 

Antwort

0

Soweit ich weiß, können Sie nicht einfach ein neues benutzerdefiniertes Element hinzufügen, das UiBinder verstehen wird. Sie können jedoch eins zu your custom widget hinzufügen.

Sie werden feststellen, dass GWT können benutzerdefinierte auf diese benutzerdefinierte Elemente Attribute, wie in DockLayoutPanel:

<g:DockLayoutPanel unit='EM'> 
    <g:north size='5'> 
    <g:Label>Top</g:Label> 
    </g:north> 
    <g:center> 
    <g:Label>Body</g:Label> 
    </g:center> 
    <g:west size='192'> 
    <g:HTML> 
     <ul> 
     <li>Sidebar</li> 
     <li>Sidebar</li> 
     <li>Sidebar</li> 
     </ul> 
    </g:HTML> 
    </g:west> 
</g:DockLayoutPanel> 

Hinweis der <g:north size='5'> Element - wenn Sie DockLayoutPanel ‚s Quellcode schauen, Sie, dass es sehen werden durch dieses Verfahren wird behandelt:

public void addNorth(Widget widget, double size) { 
    insert(widget, Direction.NORTH, size, null); 
} 

Keine @UiChild Annotation und ein zusätzlicher Parameter bedeutet etwas „magische“ hinter Kulissen geschieht. Und wahr, es gibt eine DockLayoutPanelParser Klasse, die diesen speziellen Fall behandelt. Sie werden bemerken, dass es die ElementParser - leider it's not possible to "plug in" your own ElementParser implementiert.

Es war ein Projekt, gwt-customuibinder, dass diese Einschränkung versuchte ausweicht, aber es für neuere Versionen von GWT ist veraltet (2.5+?):

Bitte beachten Sie, dass bei den neueren Versionen von GWT, dieses Projekt ist nun veraltet, da viele der Techniken zum Hinzufügen benutzerdefinierter Elementparser zu UiBinder jetzt nicht möglich sind.

0

Ich verwende und unterhalte this fork von diesem gwt-polymer wrap.

In dem Test-App Sie mehrere Proben für die Verwendung von Polymer-Widgets in GWT sehen können, wie html Polymerelemente wickeln bestehenden, wie neue zu schaffen, die die Verwendung mit UiBinder usw.

+0

Dank Leute, aber wenn diese Frage wurde gestellt, diese Lib war nicht verfügbar –

+0

Meine Schuld. Ich habe das Datum dieser Frage nicht gesehen ... – vjrj