i am unable to understand the difference between the two.
in which situation which one should be used?
any pros cons?
code http://gwt.google.com/samples/Showcase/Showcase.html#!CwStackPanel and for stacklayoutpanel and description looks same
If you read the javadocs, you'll see that StackPanel only works in quirks mode, and StackLayoutPanel only works in standards mode. They are functionally identical, but you need to choose one or the other depending on what mode your application runs on.
I persistently advocate, after understanding quirkiness of GWT Java and
that you need to bear the attitude that you are actually programming in Javascript when programming GWT Java, ...
that the first concept to understand when learning GWT is to understand the purpose and functions of the ProvidesResize/RequiresResize interfaces.
ResizeLayoutPanel inside DisclosurePanel using GWT
GWT or not for enterprise apps
StackLayoutPanel falls into the framework of ProvidesResize/RequiresResize.
If you use non-layoutpanels like StackPanel, you would have to concoct your own resize framework, or at least try to implement these pair of interfaces in them, which could involve scheduling and debouncing actions to provide a pleasant experience to the user.
You can use non-layoutpanels if your UI is simple and does not comprise a complex and deep hierarchy of panels and widgets.
In order to allow the features of layout panels, you would need to place your hosting page on standards mode. Therefore, saying that the difference between layoutpanels and non-layoutpanels is Standards mode is not an accurate picture because you need to know the motivation behind having the ProvidesResize/RequiresResize interfaces.
https://developers.google.com/web-toolkit/doc/latest/DevGuideUiPanels#Resize
I guess quirks mode is to allow the browser page to operate in the outdated quirky mode where everybody tried to please everybody's quirky individualistic idea of how HTML should behave (where microsoft was about the most belligerent practitioner of HTML quirks).
What is Standards mode:
https://developers.google.com/web-toolkit/doc/latest/DevGuideUiPanels#Standards
Related
I am thinking about developing a new application using web toolkit. I decided that the best option is going to be to use the Model-View-Presenter Design Pattern. After doing plenty of research, I found two different ways of implementing the skeleton code. (I am still trying to learn MVP and how to best utilize the disjunction between the model and the view)
Here are the two links discussing GWT MVP
https://developers.google.com/web-toolkit/doc/latest/DevGuideMvpActivitiesAndPlaces
https://developers.google.com/web-toolkit/articles/mvp-architecture
I read through and understand all the information in the second link, how you associate presenters with views, and how you have your custom events and such. I really like this because this means that several developers will be able to work on the project I have in mind.
However, the first link, also points out some interesting stuff, mostly using XML and #UiBinder and other things. I feel that those will not be necessary for this particular application but I want to make sure I have not overlooked anything.
Basically - How good of a programming practice is the style the style in the second link (the one with presenters for each view)
Thank you
You should be not be comparing MVPActivitiesAndPlaces and MVP . If browser history management is not your concern use only MVP.
Activities And Places are not mandatory for MVP. They only allow you clean browser history management which integrates nicely with MVP architecture.
UiBinder is not mandatory for MVP. They can be used with MVP.
The MVP design paradigm mostly is driven with Unit testing as main driver and to keep out slow running GWTTestCase out as much as possible.
At the heart of this pattern is the separation of functionality into
components that logically make sense, but in the case of GWT there is
a clear focus on making the view as simple as possible in order to
minimize our reliance on GWTTestCase and reduce the overall time spent
running tests.
I am looking to build a GWT based web application. Being new to GWT, am looking for suites that provide the best GWT widgets (in terms of user experience, variety, styles, etc.), to help build a web app.
I have come across SmartGWT, but looking for other options/suggestions.
Thanks in advance!
I've done apps in both GWT and SmartGWT. My observations, for what it's worth:
SmartGWT has all sorts of cool features, out of the box. It's easy to be seduced by the SmartGWT showcase.
GWT is converging on SmartGWT, and quickly. For instance, the new DataGrid
can stand up against the SmartGWT ListGrid and come away looking good.
In order for GWT to look good though, there has to be real skill in the
developer. SmartGWT can make anyone look good, it seems, but to make
GWT shine takes skill.
Once you have that level of skill, though, there's no looking back.
GWT seems to me to be much more flexible, a consequence of the building-block approach. SmartGWT is more monolithic.
SmartGWT's design has some portability issues. I successfully took a pure GWT app I made and re-worked it (minimal effort) to run nicely in a BlackBerry PlayBook browser. I took a
SmartGWT app I had made at about the same time, and half the widgets
didn't work.
For an enterprise level solution I'm working on, I'm using pure GWT and I don't regret having made that choice.
I would suggest using standard gwt widgets. Simply because,
1)they are best documented,
2)they are highly customizable via css
3)from what I observe they provide the best performance
4)you dont need to learn a whole new framework built on top of another framework
but if you insist on using a framework then I suggest you take a look at this question
My advice to you is to consider your needs. Plain GWT and SmartGWT both are the best supported, so you need not look for more (unless of course both fail in what you want).
Go to their respective showcases and see what they offer and how it fits your requirements.
If gwt satisfies all your UI requirements, my advice is to choose it over SmartGWT. gwt beats SmartGWT in learning curve and documentation anytime. Also its faster(my opinion). If gwt doesn't satisfy your needs and SmartGWT does, then you should consider making the switch.
I have a year experience in smartGWT, when we started our first gwt lessons, they said use the basic gwt features and build own framework otherwise we can encounter errors which may lead to dead-ends. We considered the idea, but for the project (since we already had deadline) decided to look after some extension of gwt. We found smartGWT. The showcase was really convincing. Remember these are widgets, the basic logic of your system is still up to you.
In case if you start using smartGWT: If you don't use JSON but some normal list of java structures prepare to get hard hours/days to get use to datasources, grids, and few other components. Seriously, it had ridiculous problems (for example switching two configuration code line without reason makes work the listgrid), BUT before you drop the entire idea to use it, after a while it starts to work, and it becomes really impressive and comfortable. This is a kind of work "make it once, will work hundreds of times".
In my opinion:
don't start use smartGWT if you want to make a system which is not too complicated.
start use it if you need complicated system with lot of different features, if you don't have the time to develop everything for yourself: many components are ready in smartGWT.
By 'web developer' I mean a software developer having a sound
understanding of web fundamentals (HTTP, HTML, CSS, JavaScript and
Ajax).
By 'successful GWT developer' I mean someone who can produce
high quality and polished looking GWT apps in timely fashion.
My department is gearing-up for a project that will require the development of a number of single screen RIA web apps. These will front enterprise server components implemented in Java. Our UI prototype was developed using ExtJS and was successful (in terms of speed of development and producing a professional, polished looking UI that integartes well with a service oriented API implemented using Spring-MVC + Jackson). However, in gearing-up to develop the actual product we have realised that our department's skills profile isn't ideal for ExtJS. We are strong on Java but relatively weak on web developers. The development of the UI prototype demonstrated that you really need fully feldged web developers to get to grips with ExtJS, since they will spend a significant amount of time grappling with CSS and JavaScript issues. As a result, the question has arisen as to whether we might be better off going with GWT (combined with a library that offers a level of polish comparable to ExtJS, such as SmartGWT). Obviously this assumes that GWT is significantly less demanding in terms of web development skills. To what extent would GWT + SmartGWT allow our Java developers to crank out high quality RIAs without them having to acquire anything more than a basic appreciation of the web fundamentals listed above?
If we decide to explore GWT further we'll do another prototype, but in the mean time it would be very interesting to hear the opinions of experienced GWT developers.
My experience is that you can get away with a lot without advanced web skills, but the end result is a pretty bland looking app, but even worse, you'll find yourself struggling to achieve all the dynamic effects you want.
As an example, my app has a DataGrid on the main tab. That could be done easily enough using pure GWT. But then I wanted to put a checkbox under the DataGrid widget that the user could use to select "single line mode", in which the rows are one line each -- any data in cells that would have word-wrapped just disappears at the edge of the cell. Hit the checkbox, and the rows collapse to one line each, then hit it again, and the row heights expand to whatever size is needed to display all the data in the cells. There isn't a method for that. What you have to do is adjust the row style of the DataGrid to add or remove the CSS element "white-space:nowrap;". So you add a ValueChangeHandler to a CheckBox widget (GWT skills) that modifies a CSS style of the DataGrid widget (web skills).
Without web skills, you'll find yourself hitting walls in trying to achieve the look-and-feel (and even dynamic behaviour) you want. Having said that, you can find these sorts of answers easily enough on the web. The key thing to remember is that just because GWT doesn't seem to have a method for something, that maybe it's really a web issue, not a GWT issue, and that you have to remember to think outside of the GWT box to solve your problem (instead of throwing up your hands, blaming GWT for lacking a feature, and hoping something like SmartGWT will solve all your problems).
The fact that every GWT widget has a plethora of methods for setting, adding, and removing styles, and the very rich integration via ClientBundles and UiBinder and the like, means that this was always the intent.
GWT is a very capable framework and can be used to produce great results such as Pictarine, but as the developers of Pictarine indicate:
Another thing that was not obvious to us when we started with GWT was that a java developer needs an intimate knowledge of HTML/CSS if he/she wants to go beyond the basic user interface provided by the GWT widgets.
I'm not quoting this to discourage anyone. Basic interfaces are indeed within reach with GWT without much HTML/CSS knowledge. GWT, however, leans on web languages and so in a non-trivial application familiarity with JavaScript, HTML, and CSS will come handy. Personally, using GWT has been continuously deepening my JS/HTML/CSS skills as I've been searching for ways to enhance my GWT projects, which in the end has been very rewarding.
I am designing a web app from scratch, which would be a fluid-based layout and the same HTML would render on different screens using the adaptive CSS.
I am going to use adaptive CSS (or responsive design) for this.
I was looking to use a framework like SCSS (http://sass-lang.com/) which would improve my code maintenance efforts. I'll have lots of CSS files (and probably some skin based as well)
Since I am using adaptive layout, I am going to use CSS Media Queries for desktop/tablet/mobile CSS. I could not get an idea how well the SCSS would integrate with media queries and overall speaking , how much flexibility will it offer to me.
Please let me know your suggestions if you have used SASS/SCSS and in general, any other suggestions.
SCSS is essentially an extension to CSS, and is useful (with mixins) to void repetition in your code. It also provides a way to group blocks of CSS in semantically meaningful ways and gives you variables to avoid repeating yourself.
If you are using a framework such as Rails, it is no-brainer.
There are also frameworks which focus on layout such as 960 (and its variants), and Blueprint which also adds code for thing like buttons.
The underlying philosophy behind many of these is DRY (don't repeat yourself). One bonus of using an established framework is that many of the browser issues have been ironed out, so you can be sure that it will work cross-browser.
It is true that perhaps the code is not quite a lean as rolling your own, but with careful editing and making sure you minify the result and send it gzipped, this is not a major issue except on the most high traffic sites.
Personally I have objected to using frameworks in the past because of the small amount of additional redundant code, but after 15 years of hacking around browser issues, I now think they are a Good Thing.
Larry Wall said in Programming Perl, "We will encourage you to develop the three great virtues of a programmer: laziness, impatience, and hubris."
Anything that allows more people to use CSS in a repeatable and reliable way, to build on work done by other, and to try out some of the leading edge features has got be a good thing.
Engineering a site with media queries is still a bit leading edge. There are compromises in each approach and you should read up as much as possible before choosing one. Adapt.js is a good alternative if you don't mind javascript.
You may want to look into the HTML5 Boilerplate. This has some useful defaults, and lots of documentation about the HTML and CSS defaults that have been chosen.
Good luck!
I have not used media queries together with SCSS, but I don't think they conflict with each other. I have used SCSS extensively in my current rails apps, and it helped me to reduce the amount of code, and get a better understanding when to use which styles.
The tricky part will be what to have fluid (changing depending on the medias viewport size), and how to avoid repetition.
Have a look at the nice site Responsive Design with CSS3 Media Queries, to get an idea which parts of your layout may be fluid.
Have a look at 320+Susy (GitHub repo here). It uses the Susy grid framework extension for Compass. All of these tools are based on Sass and make use of media queries.
I typically work on web apps that will only be used by a small group of well-controlled people, but now find that I'm writing something that has the potential to be used by a very large population. This means that the design and "look" will be very important to the success.
While I can certainly code up something functional, it ain't gonna look pretty, so I know that I'll need to get an outside designer to make things look good. Never having worked that way before I had a few questions about the mechanics of how this happens and how to try to make things easier.
We do Java, so when building a rich interface, we use GWT. I know that when working with designers, they typically provide images of what the interface should look like without any type of "useable" output. My question is how best to bridge that gap between a simple drawing of an interface to a fully functional realized one.
Any thoughts are appreciated.
Well, "it depends", as always.
Nowadays, I don't think you can work wit someone who simply provides PhotoShop mockups. At least not at your level. Mockups are simply too static, and translating those mockups to actual pages that actually work with different browsers properly is a skill set all its own.
So, you need someone beyond simply a designer, especially if you are planning any javascript wizardry, animations, or other dynamic elements that don't capture at all well on a static image.
What you really want is an "operational" mockup. Static HTML files that look and behave as best as can be done to what the UI designer wants to do, including transitions, work flow, etc. This artifact can be run through all of the stake holders as a live mockup, letting folks "Feel" the site.
Once you have these HTML files, you can then do your part of backfilling these pages with actual server side content. Obviously you can start early working on models and working with the designers so as to have services ready to support the site functionality, but you shouldn't be committing any real time in to actual pages for the site.
As for interacting with the designers, I talk more about that over here: How can I make my JSP project easier for a designer to work with
I worked on a project very much like this. We had "comps" which were pictures of what the interface would look like. We identified common objects and build modules. Then built pages (this was for a web app) from modules plus any elements that were unique to that "comp".
A couple things to keep in mind that will make life much easier: use the comps/drawings as more of a recommendation rather than set in stone design. Try to identify common pieces early on and reuse code.
Also, designers aren't user experience gods. They often have a good idea of how things should work, but if you are close to your product and have a lot of product knowledge, don't be afraid to tweak the design as you and your group see fit. One thing that designers typically lack is product knowledge. They know a lot about general user experience and how a site should work, but they often won't know the in's and out's of your use cases and products.
If you are working with GWT, you should look for designers who are expert in CSS. Apart from, may be, the main layout of the website, all the application components like form fields, dialogs, tabs and grids etc. will need to be styled using CSS.
If the designers are not experienced in working with GWT, share the GWT's documentation about styling with them. It's a good idea to read these yourself as well. Specifically explore the GWT's theme-ing system.
Also try to make use of UiBinder as much as possible. This would allow you to stay as close to traditional HTML based design while still enjoying the GWT high level object oriented interfaces (both widgets and DOM).
Optionally you might want to tell the designers that GWT image bundles will automatically do "CSS Sprites" so they don't need to worry about page load performance issues related to images.