Thank you so much for your guidance! I now have a much clearer idea of what I need to do to accomplish this task.
On Thu, 20 Mar 2025 at 15:49, Jens <jens.nehlmeier@gmail.com> wrote:
For responsive design you should use CSS media queries in CSS for the most part. However there are cases in which you want to use a totally different component and in that case you can use JavaScript to listen for media query events (see https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia) and modify the UI via code instead of CSS. To use it you would need to use elemental2 library which makes Browser APIs accessible via Java API.Then your desktop application probably only uses ClickEvents. You have to keep in mind that mobile browsers have a 300ms delay between touching the device and firing a click event. The reason is that the device needs to wait if the user might want to do a zoom, swipe, whatever gesture. So if your mobile application should feel snappy and responsive you would need to tell the browser via a HTML meta tag that zooming the page is not allowed. Alternatively add click event handlers and touch event handlers in your code or switch to pointer events (not provided by GWT out of the box but you can define your own event classes for pointer events).In the past (maybe even today) some might have used an advanced GWT technique and provide a dedicated GWT permutation for mobile. In that case you need to define a new configuration property, some code to detect mobile via JS and write a desktop/mobile value into that property and then GWT will compile an additional set of permutations and in your code it is like having a second entrypoint which only starts for mobile. But I think that solution is only useful if the mobile application is very different than the desktop application and you want a clear separation in code.Code reusability highly depends on the concrete situation. If you can use media queries and CSS adjustment then you do not duplicate anything, things are just rearranged in the UI. If CSS adjustments are not enough and you need a dedicated mobile component then it might be possible to let it implement the same interface as the desktop component and you can share logic in a common presenter/controller class.-- J.--divyanshu kumar schrieb am Donnerstag, 20. März 2025 um 10:38:21 UTC+1:I'm working on a GWT application that was originally designed for desktop screens, but I now need to create a mobile-friendly layout that retains the existing functionality. As I'm relatively new to GWT and UiBinder, I'm looking for guidance on the best practices for adapting my UI for mobile devices.My specific questions are:
- Responsive Design: What strategies or design patterns can I use within GWT to implement a responsive or adaptive layout?
- UiBinder Tips: Are there any particular tips or resources for effectively using UiBinder when designing for mobile?
- Code Reusability: How can I maintain the same functionality across both desktop and mobile versions without duplicating too much code?
Any sample code recommended libraries or links to useful tutorials would be greatly appreciated. Thanks in advance for your help!
You received this message because you are subscribed to the Google Groups "GWT Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To view this discussion visit https://groups.google.com/d/msgid/google-web-toolkit/adcdeb1c-1be3-44c0-8452-014908c0b4c7n%40googlegroups.com.
You received this message because you are subscribed to the Google Groups "GWT Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To view this discussion visit https://groups.google.com/d/msgid/google-web-toolkit/CACUggdzAUwXBqPuivK9E2HcoqAKAi4SHWgQ8etiaRamvBB_BZQ%40mail.gmail.com.
No comments:
Post a Comment