2011-09-30 14 views
7

W smartGWT można dodać kolejny widget (wydaje się korzystać z interfejsu) do płótna HTML5, jak widać w this example.Dodaj widżet (przycisk) do płótna HTML5 w GWT

Teraz próbuję dowiedzieć się, czy jest to możliwe w (surowym) GWT2.4 też. Czy ktokolwiek z was działa przykład używając GWT bez żadnych dodatkowych projektów (takich jak smartGWT, gwtExt, extGWT, ...)?

Dzięki za wszystkie odpowiedzi.

+0

wiem, jest to stara sprawa, ale dla innych czytelników: płótno w połączonej przykład należący do SmartGWT i nie ma nic wspólnego z HTML5 Canvas. – targumon

+0

@ plargumon: imho to to urządzenie SmartGWT-Canvas oparte na zwykłym kanale HTML5 i dostosowane. – Erik

+0

Erik, to nie jest kwestia opinii :-D po prostu sprawdź to w nowoczesnej przeglądarce - gdy używasz ** com.smartgwt.client.widgets.Canvas **, i tak jest w przypadku przykładu java2s.com dałeś, wynikowy obiekt DOM jest znacznikiem DIV: np

...
tylko jeśli używasz ** com.google.gwt.canvas.client.Canvas.createIfSupported() **, otrzymasz tag (oczywiście w obsługiwanej przeglądarce). – targumon

Odpowiedz

0

HTML5 canvas nie jest w zakresie GWT jeszcze, ale może po prostu zbudować que równoważnych elementów w DOM z GWT dom API i przyciągnąć go przechadzkę JSNI połączeń

+0

Nie zgadzam się. Dzięki GWT 2.2 google dodał eksperymentalną obsługę płótna HTML5. W GWT 2.4 płótno jest oficjalnie wspierane przez GWT (Zobacz: http://code.google.com/intl/de-DE/webtoolkit/doc/latest/DevGuideHtml5.html). JSNI jest prawdopodobnie rozwiązaniem - czy masz działający przykład? ;) – Erik

0

o ile mi wiadomo, nie można umieścić dowolny widget na płótnie. Co możesz zrobić, to narysować obrazy. Sądzę więc, że widżety smartGWT, do których się odwołujesz, są niczym innym jak obrazami.

Jeśli masz zdjęcie obiektu GWT, jest to, w jaki sposób dostać się do sporządzenia na płótnie:

import com.google.gwt.canvas.client.Canvas; 
import com.google.gwt.core.client.EntryPoint; 
import com.google.gwt.dom.client.ImageElement; 
import com.google.gwt.user.client.ui.Image; 
import com.google.gwt.user.client.ui.RootLayoutPanel; 

public class ImageCanvasTest implements EntryPoint { 

    public void onModuleLoad() { 
     Image image = new Image(
      "http://upload.wikimedia.org/wikipedia/en/f/f6/Gwt-logo.png"); 

     Canvas canvas = Canvas.createIfSupported(); 
     canvas.getContext2d().drawImage(
     ImageElement.as(image.getElement()), 0, 0); 

     RootLayoutPanel.get().add(canvas); 
    } 

} 
+0

Nie zgadzam się - obejrzyj przykład. Możesz zarejestrować MouseHandler na widgetach umieszczonych na płótnie. Jak narysować obraz w płótnie, do którego jestem przyzwyczajony i nie jest to odpowiedź. – Erik

+0

Nie jestem ekspertem SmartGWT, ale patrząc na kod Canvas w projekcie SmartGWT, nie sądzę, że SmartGWT Canvas (http://code.google.com/p/smartgwt/source/browse/trunk/main /src/com/smartgwt/client/widgets/Canvas.java) ma coś wspólnego z płótnem HMLT5. Płaszczyzna SmartGWT nosi nazwę Canvas ... –

+0

Znowu nie zgadzam się: płótno SmartGWT jest dziedzictwem BaseWidget, które ponownie jest dziedzictwem normalnego widżetu GWT. SmartGWT-Canvas zawiera metodę JSNI o nazwie "create", która wywołuje normalną funkcję tworzenia JS płótna HTML5. Ponadto: Myślę, że niemożliwe jest tworzenie własnych widżetów przeglądarki nie opartych na żadnych domyślnych widgetach, obsługa definicji HTML. – Erik

-1

Co trzeba to styl CSS dla przycisków. Styl taki:

button { 
    position:absolute; 
    z-index:2; 
} 

button.zoomOut { 
    top:200px; 
    left:265px; 
    font-size: 30px; 
    margin-left:auto; 
    margin-right:auto; 
} 

button.zoomIn { 
    top:200px; 
    left:400px; 
    font-size: 30px; 
    margin-left:auto; 
    margin-right:auto; 
} 

Dzięki absolutnej pozycji możesz umieścić je w dowolnym miejscu na ekranie.

Cheers