Ich habe ein Web-Spiel, das in GWT gebaut wurde. Ich bemühe mich wirklich, es mobilfreundlich zu machen. Um mehrere Bildschirmgrößen für den Desktop zu unterstützen, habe ich nur die CSS-Eigenschaft "transform: scale (*)" verwendet, scheint aber für die mobilen Browser nicht gut zu sein. Irgendwelche Richtlinien/Tipps, wie man das anpackt? Convert GWT Web-Spiel, um mobile Browser zu unterstützen
Antwort
Es gibt nicht viel GWT-spezifische über responsive Design. Die meisten Techniken sind für alle HTML/CSS/JS-Frameworks gleich. (NB: Sie sollten nie Verwendung scale()
als Weg in eine Bildschirmgröße angepasst.)
Was ich mag über die GWT, jedoch ist die Fähigkeit, verschiedene Layouts für unterschiedliche Bildschirmgrößen zu erstellen, und erstellen Sie separate Permutationen für Smartphones und Tablets/Desktops anstelle von Medienabfrage-Breakpoints oder anderen Techniken, die den Code oder CSS-Dateien aufblähen. Um dies zu erreichen, erzeuge ich typischerweise eine abstrakte Sichtimplementierung (d. H. GameboardViewImpl), die für alle Formfaktoren gemeinsame Code- und UI-Referenzen enthält, und erweitere dann diese abstrakte Sichtimplementierung, um formfaktorspezifische Implementierungen zu erzeugen, z. GameboardViewImplDesktop und GameboardViewImplPhone. Dieser Ansatz erzeugt nicht nur einen kleineren und effizienteren Code, sondern auch Code, der viel einfacher zu entwickeln und zu pflegen ist. Sie können den Browser einfach aktualisieren und sehen, wie jede Ansicht im Desktop-, Tablet- oder Telefonformat aussieht. Wenn etwas nicht richtig aussieht, wissen Sie genau, wo Sie es beheben müssen.
Werfen Sie einen Blick auf MGWT - Sie möglicherweise oder nicht alle plattformspezifische Widgets und Stile, mit denen es kommt, aber mindestens können Sie MGWT.getFormFactor()
und ähnliche Methoden verwenden.
- 1. Mobile Browser in GWT erkennen
- 2. Welche Browser unterstützen die Schrifteinbettung?
- 3. Welche mobilen Browser unterstützen Javascript (und Ajax)?
- 4. webkit CSS unterstützen welche Browser?
- 5. Welche Browser unterstützen HttpOnly-Cookies?
- 6. Welche Browser unterstützen Xpath 2.0?
- 7. Unterstützen Browser den HTML5-Kontext?
- 8. zuverlässig zu erkennen Desktop-vs. Mobile Browser
- 9. Stylesheets und mobile Browser
- 10. Browser stoppen Zwischenspeichern GWT nocache.js
- 11. GWT-Verlauf verwenden, um Parameter zu übergeben?
- 12. GWT nicht unterstützte Browser-Warnung
- 13. Pläne für Sharepoint, um MVC zu unterstützen?
- 14. Wann haben alle Browser angefangen, String.replace (regexp, replacement_function) zu unterstützen?
- 15. Unterstützen Browser den CSS3 Pseudo-Element "marker"?
- 16. Haben mobile Geräte genug CPU, um HTTPS für den gesamten Datenverkehr einer Website zu unterstützen?
- 17. Druck ImageMagick convert Ausgabe Browser
- 18. Unterstützen Browser häufig numerische Zitate in Attributen?
- 19. Feste Positionierung für mobile Browser
- 20. GWT CEll Browser Echtzeit Update
- 21. Browser Version erkennen mit GWT?
- 22. GWT & HTML5 Video in Mobile Safari
- 23. Wie wichtig ist es, alte Browser zu unterstützen?
- 24. Unterstützen iPhone/Android-Browser CSS @ media Handheld?
- 25. Welche Browser unterstützen animierte Gifs nicht?
- 26. die noch CSS-Browser unterstützen Ausdrücke
- 27. Wie viel Prozent der mobilen Browser unterstützen CSS-Medienabfragen?
- 28. Welche Browser-Plugins unterstützen domänenübergreifende TCP-Sockets?
- 29. Welche Browser unterstützen HTML 5/CSS3?
- 30. Unterstützen alle Browser PHP $ _SERVER ['HTTP_X_REQUESTED_WITH']?
Danke. 1. Warum sollte ich keine Waage benutzen? 2. Ich habe eigentlich fast kein Widget benutzt, also glaube ich nicht, dass MGWT mir helfen kann. Layout weise, lassen Sie uns sagen, ich möchte nur das Trivialste - das gleiche Layout haben, aber ich möchte es in einen mobilen Bildschirm passen. Verstehe immer noch nicht, wie ich das erreichen kann. –
Es gibt viele Gründe, die Skalierung nicht zu verwenden, aber das Wichtigste: Sie kann die Benutzeroberfläche unleserlich oder absurd groß machen, wenn Sie von meinem Bildschirm (2560x1440 CSS-Pixel) auf ein kleines Telefon (320x533 CSS-Pixel) skalieren. Und Sie nutzen nicht die xhdpi und hdpi Auflösungen, um Ihr Spiel scharf zu machen. –
MGWT macht es einfach zu erkennen, welche Formfaktoren und Bildschirmdichten Ihre Benutzer haben. Sie können es in reinem JS natürlich tun, wenn Sie bevorzugen. –