Do you think IIT Guwahati certified course can help you in your career?
No
Introduction
Users can input data into form widgets, enabling them to engage with the application.
The PushButton widget simulates a common push-button with a personalized style.
A button is a PushButton that the user can press or click to take action. We can use the PushButton widget in many places like creating a submit button, creating a reset button in a login form, creating a feedback button, etc.
Creates a PushButton with an upstate text, a downstate text, and a click listener.
Methods
In the GWT PushButton Widget, the following are the methods mentioned below:
Sr. No.
Function
Description
1.
protected void onClick()
When the user has finished selecting this button, a call is made. Overrides: onClick in class CustomButton
2.
protected void onClickCancel()
Called when a user cancels a click that is currently being performed, as when the user drags the mouse outside of the button before releasing it. Overrides: onClickCancel in class CustomButton
3.
protected void onClickStart()
When the user starts to click on this button, a call is made. Overrides: onClickStart in class CustomButton
GWT PushButton Widget Example
This example will walk you through some straightforward GWT PushButton Widget usage instructions. To upgrade the GWT application we developed in GWT, follow these steps:
Project Creation👨💻
Create a project with the name GWTPushButton.
Modification in Files👨🔧
Modify the GWTPushButton.gwt.xml, GWTPushButton.css, GWTPushButton.html, and GWTPushButton.java files as explained below. Keep the rest of the files unchanged.
Check the Result🤳🏼
Compile and run the application to verify the result of the implemented logic.
The changed module description, located at ‘src/com.codingninjas.gwtpushbut/GWTPushButton.gwt.xml’, contains the content given below:
<? xml version = "1.0" encoding = "UTF-8" ?>
<module rename-to='gwtpushbutton'>
<inherits name='com.google.gwt.user.User' />
<!-- For default stylesheet, you can add any style to your project-->
<!-- <Inherits name='com.google.gwt.user.theme.clean.Clean' /> -->
<entry-point class='com.codingninjas.gwtpushbut.client.GWTPushButton' />
<source path='client' />
<source path='shared' />
<!-- Allow Super Dev Mode -->
<add-linker name="xsiframe" />
</module>
Now write some styling in the CSS file for your project which is located at ‘war/GWTPushButton.css’.
body {
text - align: center;
font - family: verdana, sans - serif;
}
h1 {
font - size: 3em;
font - weight: bold;
color: #004080;
margin: 30px 0px 80px;
text - align: center;
}
.gwt - PushButton {
color: #32CD32;
}
.gwt - PushButton - up {
color: #5e17eb;
}
.gwt - PushButton - down {
color: purple;
}
.gwt - PushButton - up - hovering {
color: yellow;
}
.gwt - PushButton - down - hovering {
color: blue;
}
.gwt - PushButton - up - disabled {
color: violet;
}
.gwt - PushButton - down - disabled {
color: red;}
Now write in the HTML host file for your project which is located at ‘war/GWTPushButton.html’.
When you are finished and have made all the necessary modifications, compile and run the application in development mode.
Output
The above code compilation will get the results shown below:
Frequently Asked Questions
What in GWT is a widget?
Use widgets to communicate with users. The positioning of user interface elements on the page is managed via panels. By utilizing widgets and panels, you may avoid writing unique code for every browser because they function the same way on all of them.
What characteristics does GWT have?
Asynchronous remote procedure calls, history management, bookmarking, UI abstraction, internationalization, and cross-browser portability.
What is the GWT's purpose?
A development toolkit called GWT is used to create and improve sophisticated browser-based apps.
What do you mean by Maven Plugin in GWT?
The Maven Plugin for GWT provides specific goals, lifecycles, and artifact handlers in order to make it simpler to create GWT projects using Maven.
How can I use GWT's Super Dev Mode?
Dev Mode automatically starts Super Dev Mode as of GWT 2.7. Reloading the page while in Dev Mode will force an automated recompilation when necessary.
Conclusion
In this article, we have discussed the GWT PushButton Widget. We have discussed its constructors, methods, and implementation. GWT PushButton Widget is a part of form widgets that are used in many places while developing applications.