Image shareIcon = FontImage.createMaterial(FontImage.MATERIAL_REPLY, s);
shareIcon = shareIcon.rotate(180);
ShareButton shareButton = new ShareButton();
shareButton.setIcon(shareIcon);
How can I flip the image here? The rotate method does nothing.
The answer below by shai doesn't work in my project
package com.mycompany.myapp;
import com.codename1.components.ShareButton;
import com.codename1.ui.Display;
import com.codename1.ui.Form;
import com.codename1.ui.Dialog;
import com.codename1.ui.plaf.UIManager;
import com.codename1.ui.util.Resources;
import com.codename1.ui.Button;
import com.codename1.ui.FontImage;
import com.codename1.ui.Image;
import com.codename1.ui.Toolbar;
import com.codename1.ui.layouts.BoxLayout;
public class MyApplication {
private Form current;
private Resources theme;
public void init(Object context) {
theme = UIManager.initFirstTheme("/theme");
// Enable Toolbar on all Forms by default
Toolbar.setGlobalToolbar(true);
// Pro only feature, uncomment if you have a pro subscription
// Log.bindCrashProtection(true);
}
public void start() {
if (current != null) {
current.show();
return;
}
Form hi = new Form("Rotate");
hi.setLayout(new BoxLayout(BoxLayout.Y_AXIS));
Image shareIcon = FontImage.createMaterial(FontImage.MATERIAL_REPLY, new Button("").getUnselectedStyle(), 5);
for (int i = 0; i < 360; i += 45) {
ShareButton s = new ShareButton();
s.setIcon(shareIcon.rotate(i));
hi.add(s);
}
hi.show();
}
public void stop() {
current = Display.getInstance().getCurrent();
if (current instanceof Dialog) {
((Dialog) current).dispose();
current = Display.getInstance().getCurrent();
}
}
public void destroy() {
}
}
If you want to see the project, heres the project:
https://drive.google.com/open?id=0B8ATnICIY2S8OEtUU2lPSlFid3M
This works for me:
Image shareIcon = FontImage.createMaterial(FontImage.MATERIAL_REPLY, new Button("").getUnselectedStyle(), 5);
for(int i = 0 ; i < 360 ; i += 45) {
ShareButton s = new ShareButton();
s.setIcon(shareIcon.rotate(i));
hi.add(s);
}
Related
I created a minor crop image app which crops the set image in a closed free path defined by the user (closed by joining the starting and ending point). This app is depicting unusual behavior when cropping in different path directions (clockwise and anticlockwise). Can anyone explain why is this happening and how to rectify this problem?
The following is the code:-
My own defined GeneralPath class
package com.mycompany.myapp;
import com.codename1.charts.util.ColorUtil;
import com.codename1.ui.Component;
import com.codename1.ui.Display;
import com.codename1.ui.Graphics;
import com.codename1.ui.Stroke;
public class GeneralPath extends Component{
com.codename1.ui.geom.GeneralPath generalPath;
Stroke stroke = new Stroke();
int firstPointX = 0, firstpointY = 0;
MyApplication myApplication;
public GeneralPath(MyApplication application) {
// TODO Auto-generated constructor stub
generalPath = new com.codename1.ui.geom.GeneralPath();
stroke.setLineWidth(Math.max(1, Display.getInstance().convertToPixels(1, true)/2));
getAllStyles().setBgColor(0xffffff);
getAllStyles().setBgTransparency(200);
myApplication = application;
}
#Override
public void paint(Graphics g) {
// TODO Auto-generated method stub
super.paint(g);
paintDrawing(g);
}
private void paintDrawing(Graphics g)
{
g.setColor(ColorUtil.argb(0, 255, 255, 255));
boolean oldAA = g.isAntiAliased();
g.setAntiAliased(true);
g.drawShape(generalPath, stroke);
g.setAntiAliased(oldAA);
}
#Override
public void pointerPressed(int a, int b) {
firstPointX = a;
firstpointY = b;
generalPath.moveTo(x(a), y(b));
}
#Override
public void pointerDragged(int a, int b) {
generalPath.lineTo(x(a), y(b));
}
#Override
public void pointerReleased(int x, int y) {
generalPath.lineTo(x(firstPointX), y(firstpointY));
myApplication.clip();
}
public int x(int x)
{
return x-getParent().getAbsoluteX();
}
public int y(int y)
{
return y - getParent().getAbsoluteY();
}
public com.codename1.ui.geom.GeneralPath getPath()
{
return generalPath;
}
}
MyApplication.java (main class)
package com.mycompany.myapp;
import com.codename1.io.Log;
import com.codename1.ui.Button;
import com.codename1.ui.Display;
import com.codename1.ui.FontImage;
import com.codename1.ui.Form;
import com.codename1.ui.Graphics;
import com.codename1.ui.Image;
import com.codename1.ui.Dialog;
import com.codename1.ui.Label;
import com.codename1.ui.Stroke;
import com.codename1.ui.animations.CommonTransitions;
import com.codename1.ui.geom.GeneralPath;
import com.codename1.ui.layouts.BorderLayout;
import com.codename1.ui.layouts.BoxLayout;
import com.codename1.ui.layouts.FlowLayout;
import com.codename1.ui.layouts.LayeredLayout;
import com.codename1.ui.plaf.UIManager;
import com.codename1.ui.util.Resources;
import com.codename1.ui.util.UITimer;
import java.io.IOException;
import com.codename1.ui.Toolbar;
import com.codename1.ui.geom.Rectangle;
/**
* This file was generated by Codename One for the purpose
* of building native mobile applications using Java.
*/
public class MyApplication {
private Form current;
private Resources theme;
Form hi;
com.mycompany.myapp.GeneralPath gp;
Image finalDuke;
public void init(Object context) {
theme = UIManager.initFirstTheme("/theme");
// Enable Toolbar on all Forms by default
Toolbar.setGlobalToolbar(true);
// Pro only feature, uncomment if you have a pro subscription
// Log.bindCrashProtection(true);
}
public void start() {
if(current != null){
current.show();
return;
}
// Form hi = new Form("Welcome", new BorderLayout(BorderLayout.CENTER_BEHAVIOR_CENTER_ABSOLUTE));
// final Label apple = new Label(theme.getImage("apple-icon.png"));
// final Label android = new Label(theme.getImage("android-icon.png"));
// final Label windows = new Label(theme.getImage("windows-icon.png"));
// Button getStarted = new Button("Let's Get Started!");
// FontImage.setMaterialIcon(getStarted, FontImage.MATERIAL_LINK);
// getStarted.setUIID("GetStarted");
// hi.addComponent(BorderLayout.CENTER,
// LayeredLayout.encloseIn(
// BoxLayout.encloseY(
// new Label(theme.getImage("duke-no-logos.png")),
// getStarted
// ),
// FlowLayout.encloseRightMiddle(apple)
// )
// );
//
// getStarted.addActionListener((e) -> {
// Display.getInstance().execute("https://www.codenameone.com/developers.html");
// });
//
// new UITimer(() -> {
// if(apple.getParent() != null) {
// apple.getParent().replace(apple, android, CommonTransitions.createFade(500));
// } else {
// if(android.getParent() != null) {
// android.getParent().replace(android, windows, CommonTransitions.createFade(500));
// } else {
// windows.getParent().replace(windows, apple, CommonTransitions.createFade(500));
// }
// }
// }).schedule(2200, true, hi);
Image duke = null;
try {
// duke.png is just the default Codename One icon copied into place
duke = theme.getImage("promo_5.png");
} catch(Exception err) {
Log.e(err);
}
finalDuke = duke;
hi = new Form("Shape Clip", new BorderLayout());
// We create a 50 x 100 shape, this is arbitrary since we can scale it easily
// GeneralPath path = new GeneralPath();
// path.moveTo(20,0);
// path.lineTo(30, 0);
// path.lineTo(30, 100);
// path.lineTo(20, 100);
// path.lineTo(20, 15);
// path.lineTo(5, 40);
// path.lineTo(5, 25);
// path.lineTo(20,0);
gp = new com.mycompany.myapp.GeneralPath(this);
hi.add(BorderLayout.CENTER,gp);
hi.getLayeredPane().add(finalDuke);
hi.show();
}
public void stop() {
current = Display.getInstance().getCurrent();
if(current instanceof Dialog) {
((Dialog)current).dispose();
current = Display.getInstance().getCurrent();
}
}
public void destroy() {
}
public void clip()
{
Stroke stroke = new Stroke(0.5f, Stroke.CAP_ROUND, Stroke.JOIN_ROUND, 4);
// hi.getContentPane().getUnselectedStyle().setBgPainter((Graphics g, Rectangle rect) -> {
// g.setColor(0xff0000);
// float widthRatio = ((float)rect.getWidth()) / 50f;
// float heightRatio = ((float)rect.getHeight()) / 100f;
// g.scale(widthRatio, heightRatio);
// g.translate((int)(((float)rect.getX()) / widthRatio), (int)(((float)rect.getY()) / heightRatio));
// g.setClip(gp.getPath());
// g.setAntiAliased(true);
// g.drawImage(finalDuke, 0, 0, 50, 100);
// g.setClip(gp.getPath().getBounds());
// g.drawShape(gp.getPath(), stroke);
// g.translate(-(int)(((float)rect.getX()) / widthRatio), -(int)(((float)rect.getY()) / heightRatio));
// g.resetAffine();
// });
hi.getContentPane().getAllStyles().setBgPainter((Graphics g, Rectangle rect) -> {
g.drawShape(gp.getPath(), stroke);
g.setClip(gp.getPath());
Image image = finalDuke;
g.drawImage(image, 0, 0);
});
}
}
Please ignore the commented out portions. Thank you
ScreenShots:-
3 overlapping rectangles don't invert the picture during crop but a triangular shape in the opposite direction of that to the rectangle inversely cuts the previous paths
Try calling closePath() in pointerReleased. Even the user is almost closing the path manually, it might not really be closed. If you try to use an unclosed shape as a clip shape you'll get unexpected results.
This is very much a work in progress so I apologize for my code needing to be cleaned up, but I thought it best to include everything I have so far.
I'm trying to figure how to animate text by looping through an array of images. My code loops through the array and displays just the last image. I need to display one image at a time and repeat to give the desired animation effect. What am I doing wrong or not doing?
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.HBox;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.GridPane;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.stage.Stage;
import javafx.util.Duration;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.event.EventHandler;
import javafx.animation.Animation;
import javafx.animation.KeyFrame;
public class ImageAnimatorWithAudio extends Application {
private final static int NUMBER_OF_SLIDES = 10;
#Override // Override the start method in the Application class
public void start(Stage primaryStage) {
Image[] images = new Image[NUMBER_OF_SLIDES];
Timeline animation = new Timeline(new KeyFrame(Duration.millis(5000)));
animation.setCycleCount(Timeline.INDEFINITE);
animation.play();
HBox hBox = new HBox();
hBox.setSpacing(10);
hBox.setAlignment(Pos.TOP_RIGHT);
Button btStartPause = new Button("Start Animation");
hBox.getChildren().add(btStartPause);
//Create border pane
BorderPane borderPane = new BorderPane();
borderPane.setTop(hBox); //Add hBox to borderPane
BorderPane.setAlignment(hBox, Pos.TOP_RIGHT); //Align hBox
btStartPause.setOnAction(e -> {
if (btStartPause.getText().equals("Start Animation")) {
btStartPause.setText("Pause Animation");
animation.play();
} else {
btStartPause.setText("Start Animation");
animation.pause();
}
});
GridPane pane = new GridPane();
pane.setPadding(new Insets(5,5,5,5));
for (int i = 0; i < NUMBER_OF_SLIDES; i++) {
images[i] = new Image("image_path" + i + ".png"); //file names are numerically named(i)
pane.getChildren().add(new ImageView(images[i]));
}
pane.getChildren().add(borderPane);
Scene scene = new Scene(pane, 450, 450);
primaryStage.setTitle("TextAnimation"); //Set the stage title
primaryStage.setScene(scene); //Place the scene in the stage
primaryStage.show(); //Display the stage
}
public static void main(String[] args){
Application.launch(args);
}
}
Any help is appreciated.
Here is an app that demonstrates how to add Images to an ArrayList(similar approach for an Array). It also demonstrates how to load those Images into an ImageView and change them using Timeline.
Main
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;
/**
*
* #author Sedrick
*/
public class JavaFXApplication1 extends Application {
#Override
public void start(Stage stage) throws Exception {
Parent root = FXMLLoader.load(getClass().getResource("FXMLDocument.fxml"));
Scene scene = new Scene(root);
stage.setScene(scene);
stage.show();
}
/**
* #param args the command line arguments
*/
public static void main(String[] args) {
launch(args);
}
}
FXML
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.image.ImageView?>
<?import javafx.scene.layout.AnchorPane?>
<AnchorPane id="AnchorPane" prefHeight="371.0" prefWidth="607.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8.0.60" fx:controller="javafxapplication1.FXMLDocumentController">
<children>
<Button fx:id="btnMain" layoutX="263.0" layoutY="326.0" onAction="#handleButtonAction" text="Click Me!" />
<Label fx:id="lblMain" layoutX="269.0" layoutY="28.0" minHeight="16" minWidth="69" />
<ImageView fx:id="ivMain" fitHeight="201.0" fitWidth="278.0" layoutX="165.0" layoutY="85.0" pickOnBounds="true" preserveRatio="true" />
</children>
</AnchorPane>
Controller
import java.net.URISyntaxException;
import java.net.URL;
import java.util.ArrayList;
import java.util.List;
import java.util.ResourceBundle;
import javafx.animation.KeyFrame;
import javafx.animation.Timeline;
import javafx.application.Platform;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.util.Duration;
/**
*
* #author Sedrick
*/
public class FXMLDocumentController implements Initializable {
#FXML private Label lblMain;
#FXML private ImageView ivMain;
#FXML private Button btnMain;
Timeline timeline;
List<Image> imageContainer;
int currentImageBeingDisplayed;
#FXML
private void handleButtonAction(ActionEvent event) {
lblMain.setText("Animation started!");
currentImageBeingDisplayed = 0;
timeline.play();
}
#Override
public void initialize(URL url, ResourceBundle rb) {
// TODO
//Load images
imageContainer = new ArrayList();
for(int i = 1; i <= 12; i++)
{
try
{
System.out.println("/images/Slide" + i + ".PNG");
imageContainer.add(new Image(getClass().getResource("/images/Slide" + i + ".PNG").toURI().toString()));
} catch (URISyntaxException ex) {
System.out.println(ex.toString());
}
}
//Change the image every second
timeline = new Timeline(
new KeyFrame(
Duration.seconds(1),
new EventHandler<ActionEvent>() {
#Override public void handle(ActionEvent actionEvent) {
Platform.runLater(()->{
ivMain.setImage(imageContainer.get(currentImageBeingDisplayed++));
});
}
}
)
);
timeline.setCycleCount(12);
}
}
Output:(looks similar to below)
I want to import mp3 files as clickable labels, but i have no idea how to handle it. I am doing graphical user interface through JavaFX. Image below will explain more.
You can get all Files from a directory by doing something like this:
File myfolder = new File("path/to/directory");
File[] allFiles = folder.listFiles();
for (int i = 0; i < all.length; i++) {
if (allFiles[i].isFile()) {
System.out.println("File " + allFiles[i].getName());
} else if (listOfFiles[i].isDirectory()) {
System.out.println("Directory " + allFiles[i].getName());
}
}
But instead of printing it to the output you can add Labels with the file.
Maybe something like this is what you want:
File myfolder = new File("your/path");
File[] allFiles = folder.listFiles();
VBox yourBox = new VBox();
for (int i = 0; i < all.length; i++) {
if (allFiles[i].isFile()) {
yourBox.getChildren().add(new Label(allFiles[i].getName());
} else if (listOfFiles[i].isDirectory()) {
//Do whatever you want to do with subfolders.
}
}
Edit: for selecting a folder at runtime you can use:
DirectoryChooser
https://docs.oracle.com/javase/8/javafx/api/javafx/stage/DirectoryChooser.html
Or a FileChooser, which allows selecting multiple Files.
Edit full code (tested):
import java.awt.Desktop;
import java.io.File;
import java.io.IOException;
import java.util.List;
import java.util.logging.Level;
import java.util.logging.Logger;
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Pane;
import javafx.scene.layout.VBox;
import javafx.stage.FileChooser;
import javafx.stage.Stage;
public class test extends Application {
#Override
public void start(final Stage stage) {
stage.setTitle("File Chooser");
final FileChooser fileChooser = new FileChooser();
final Button openMultipleButton = new Button("Open Files...");
VBox yourBox = new VBox();
openMultipleButton.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(final ActionEvent e) {
List<File> list = fileChooser.showOpenMultipleDialog(stage);
if (list != null) {
for (File file : list) {
yourBox.getChildren().add(new Label(file.getName()));
}
}
}
});
HBox all = new HBox();
all.getChildren().addAll(openMultipleButton, yourBox);
final Pane rootGroup = new VBox(12);
rootGroup.getChildren().addAll(all);
rootGroup.setPrefSize(400, 400);
stage.setScene(new Scene(rootGroup));
stage.show();
}
public static void main(String[] args) {
Application.launch(args);
}
}
Hope this helped,
Steffi
The recent updates draw the lines on the charts when sharing, but the chart seems to get a bit mangled both when shared and when doing a screen capture on the simulator. The legend gets rotated and moved into the grid area, the title is missing, and there is a yellow outline that runs through the grid area.
Different chart renderings. The far right image got mirrored somehow when I pasted it, it isn't actually a mirror-image when shared.
Here is a test case:
package com.fastlaneinnovations.chartexample;
import com.codename1.charts.ChartComponent;
import com.codename1.charts.models.XYMultipleSeriesDataset;
import com.codename1.charts.models.XYSeries;
import com.codename1.charts.renderers.XYMultipleSeriesRenderer;
import com.codename1.charts.renderers.XYSeriesRenderer;
import com.codename1.charts.util.ColorUtil;
import com.codename1.charts.views.LineChart;
import com.codename1.components.ShareButton;
import com.codename1.io.FileSystemStorage;
import com.codename1.io.Log;
import com.codename1.ui.Container;
import com.codename1.ui.Display;
import com.codename1.ui.Form;
import com.codename1.ui.Image;
import com.codename1.ui.Label;
import com.codename1.ui.events.ActionEvent;
import com.codename1.ui.events.ActionListener;
import com.codename1.ui.layouts.BorderLayout;
import com.codename1.ui.plaf.UIManager;
import com.codename1.ui.util.ImageIO;
import com.codename1.ui.util.Resources;
import java.io.IOException;
import java.io.OutputStream;
import java.util.Hashtable;
import java.util.Set;
public class ChartExample {
private Form current;
private Resources theme;
private XYMultipleSeriesRenderer chartRenderer;
private Container rpmChartContainer;
private XYSeries series;
private LineChart lineChart;
private ChartComponent chart;
private Hashtable<Long, Integer> chartData;
private String chartName = "Chart";
private String path;
private Object os;
private int chartHeight;
private int chartWidth;
private ShareButton share;
private Set<Long> keys;
public void init(Object context) {
theme = UIManager.initFirstTheme("/theme");
// Pro only feature, uncomment if you have a pro subscription
// Log.bindCrashProtection(true);
}
public void start() {
if (current != null) {
current.show();
return;
}
Form form = new Form();
form.setLayout(new BorderLayout());
chartData = new Hashtable<Long, Integer>();
for (int i = 0; i < 8000; i += 100) {
chartData.put(Long.valueOf(i), Integer.valueOf(i));
}
rpmChartContainer = new Container();
rpmChartContainer.setLayout(new BorderLayout());
series = new XYSeries("RPM");
chartRenderer = createChartRenderer();
setChartSettings(chartRenderer, "RPM vs Time", "Time (s)", "RPM", 0.0,
10.0, 0.0, 8000.0, ColorUtil.YELLOW, ColorUtil.WHITE);
lineChart = new LineChart(buildDataSet(series), chartRenderer);
chart = new ChartComponent(lineChart);
chart.setUIID("ChartComponent");
rpmChartContainer.addComponent(BorderLayout.CENTER, chart);
updateChart();
share = new ShareButton();
share.setName(chartName);
share.setText("Share this chart");
share.setTextToShare("RPM chart created by R-P-M Control Center app");
rpmChartContainer.add(BorderLayout.SOUTH, share);
form.add(BorderLayout.CENTER, rpmChartContainer);
form.show();
createShareButton();
}
public void stop() {
current = Display.getInstance().getCurrent();
}
public void destroy() {
}
public void updateChart() {
keys = chartData.keySet();
series.clear();
for (Long key : keys) {
series.add((key / 1000.0), (chartData.get(key) / 1.0));
}
}
private XYMultipleSeriesRenderer createChartRenderer() {
XYMultipleSeriesRenderer renderer = new XYMultipleSeriesRenderer();
renderer.setPointSize(3f);
XYSeriesRenderer seriesRenderer = new XYSeriesRenderer();
seriesRenderer.setColor(ColorUtil.GREEN);
// seriesRenderer.setPointStyle(PointStyle.CIRCLE);
// seriesRenderer.setFillPoints(true);
seriesRenderer.setLineWidth(5f);
seriesRenderer.setShowLegendItem(true);
renderer.addSeriesRenderer(seriesRenderer);
return renderer;
}
private XYMultipleSeriesDataset buildDataSet(XYSeries dataSeries) {
XYMultipleSeriesDataset multiDataSet = new XYMultipleSeriesDataset();
multiDataSet.addSeries(dataSeries);
return multiDataSet;
}
private void setChartSettings(XYMultipleSeriesRenderer renderer,
String title, String xTitle, String yTitle, double xMin,
double xMax, double yMin, double yMax, int axesColor,
int labelsColor) {
renderer.setChartTitle(title);
renderer.setXTitle(xTitle);
renderer.setYTitle(yTitle);
renderer.setXAxisMin(xMin);
// renderer.setXAxisMax(xMax);
renderer.setYAxisMin(yMin);
renderer.setYAxisMax(yMax);
renderer.setAxesColor(axesColor);
renderer.setLabelsColor(labelsColor);
renderer.setMarginsColor(ColorUtil.BLACK);
renderer.setGridColor(ColorUtil.BLACK);
}
public void createShareButton() {
rpmChartContainer.revalidate();
chartWidth = rpmChartContainer.getWidth();
chartHeight = rpmChartContainer.getHeight();
Image chartAsImage = Image.createImage(chartWidth, chartHeight);
rpmChartContainer.paint(chartAsImage.getGraphics());
setShareImage(share, chartAsImage);
}
public void setShareImage(ShareButton shareButton, Image shareImage) {
OutputStream os = null;
final String shareImagePath = FileSystemStorage.getInstance()
.getAppHomePath() + shareButton.getName();
FileSystemStorage.getInstance().delete(shareImagePath);
try {
os = FileSystemStorage.getInstance().openOutputStream(
shareImagePath);
ImageIO.getImageIO().save(shareImage, os, ImageIO.FORMAT_JPEG,
0.95f);
} catch (IOException e) {
e.printStackTrace();
} finally {
try {
os.close();
} catch (IOException ex) {
ex.printStackTrace();
}
}
shareButton.setImageToShare(shareImagePath, "image/jpeg");
}
}
In implementing the 2D transformations on iOS mutable images, I fixed some bugs related to transforms on mutable images in the simulator. You may not have these until the next plugin update.
As for the third image on the right in your screenshot. What device was that from? Can you share a test case with your chart so I can test it out?
I have just started learning mgwt. After creating a Button and adding a TapHandler, the tap events are not fired. I don't know what is wrong in the code. I have deployed this on GAE and accessing the site on a Android device. Below is the code for onModuleLoad()
import com.citrix.demo.client.css.AppBundle;
import com.google.gwt.activity.shared.ActivityMapper;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.core.client.GWT;
import com.google.gwt.core.client.GWT.UncaughtExceptionHandler;
import com.google.gwt.dom.client.StyleInjector;
import com.google.gwt.place.shared.PlaceHistoryHandler;
import com.google.gwt.user.client.Timer;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.SimplePanel;
import com.googlecode.mgwt.dom.client.event.tap.TapEvent;
import com.googlecode.mgwt.dom.client.event.tap.TapHandler;
import com.googlecode.mgwt.mvp.client.AnimatableDisplay;
import com.googlecode.mgwt.mvp.client.AnimatingActivityManager;
import com.googlecode.mgwt.mvp.client.Animation;
import com.googlecode.mgwt.mvp.client.AnimationMapper;
import com.googlecode.mgwt.ui.client.MGWT;
import com.googlecode.mgwt.ui.client.MGWTSettings;
import com.googlecode.mgwt.ui.client.MGWTStyle;
import com.googlecode.mgwt.ui.client.animation.AnimationHelper;
import com.googlecode.mgwt.ui.client.dialog.TabletPortraitOverlay;
import com.googlecode.mgwt.ui.client.layout.MasterRegionHandler;
import com.googlecode.mgwt.ui.client.layout.OrientationRegionHandler;
import com.googlecode.mgwt.ui.client.widget.Button;
import com.googlecode.mgwt.ui.client.widget.LayoutPanel;
/**
* #author Daniel Kurka
*
*/
public class MgwtAppEntryPoint implements EntryPoint {
private static LayoutPanel layout = new LayoutPanel();
private void start() {
//set viewport and other settings for mobile
MGWT.applySettings(MGWTSettings.getAppSetting());
final ClientFactory clientFactory = new ClientFactoryImpl();
// Start PlaceHistoryHandler with our PlaceHistoryMapper
AppPlaceHistoryMapper historyMapper = GWT.create(AppPlaceHistoryMapper.class);
final PlaceHistoryHandler historyHandler = new PlaceHistoryHandler(historyMapper);
historyHandler.register(clientFactory.getPlaceController(), clientFactory.getEventBus(), new com.citrix.demo.client.activities.HomePlace());
if ((MGWT.getOsDetection().isTablet())) {
// very nasty workaround because GWT does not correctly support
// #media
StyleInjector.inject(AppBundle.INSTANCE.css().getText());
createTabletDisplay(clientFactory);
} else {
createPhoneDisplay(clientFactory);
}
historyHandler.handleCurrentHistory();
}
private void createPhoneDisplay(ClientFactory clientFactory) {
AnimatableDisplay display = GWT.create(AnimatableDisplay.class);
PhoneActivityMapper appActivityMapper = new PhoneActivityMapper(clientFactory);
PhoneAnimationMapper appAnimationMapper = new PhoneAnimationMapper();
AnimatingActivityManager activityManager = new AnimatingActivityManager(appActivityMapper, appAnimationMapper, clientFactory.getEventBus());
activityManager.setDisplay(display);
RootPanel.get().add(display);
}
private void createTabletDisplay(ClientFactory clientFactory) {
SimplePanel navContainer = new SimplePanel();
navContainer.getElement().setId("nav");
navContainer.getElement().addClassName("landscapeonly");
AnimatableDisplay navDisplay = GWT.create(AnimatableDisplay.class);
final TabletPortraitOverlay tabletPortraitOverlay = new TabletPortraitOverlay();
new OrientationRegionHandler(navContainer, tabletPortraitOverlay, navDisplay);
new MasterRegionHandler(clientFactory.getEventBus(), "nav", tabletPortraitOverlay);
ActivityMapper navActivityMapper = new TabletNavActivityMapper(clientFactory);
AnimationMapper navAnimationMapper = new TabletNavAnimationMapper();
AnimatingActivityManager navActivityManager = new AnimatingActivityManager(navActivityMapper, navAnimationMapper, clientFactory.getEventBus());
navActivityManager.setDisplay(navDisplay);
RootPanel.get().add(navContainer);
SimplePanel mainContainer = new SimplePanel();
mainContainer.getElement().setId("main");
AnimatableDisplay mainDisplay = GWT.create(AnimatableDisplay.class);
TabletMainActivityMapper tabletMainActivityMapper = new TabletMainActivityMapper(clientFactory);
AnimationMapper tabletMainAnimationMapper = new TabletMainAnimationMapper();
AnimatingActivityManager mainActivityManager = new AnimatingActivityManager(tabletMainActivityMapper, tabletMainAnimationMapper, clientFactory.getEventBus());
mainActivityManager.setDisplay(mainDisplay);
mainContainer.setWidget(mainDisplay);
RootPanel.get().add(mainContainer);
}
#Override
public void onModuleLoad() {
GWT.setUncaughtExceptionHandler(new UncaughtExceptionHandler() {
#Override
public void onUncaughtException(Throwable e) {
Window.alert("uncaught: " + e.getMessage());
e.printStackTrace();
}
});
new Timer() {
#Override
public void run() {
start();
}
}.schedule(1);
//set viewport and other settings for mobile
MGWT.applySettings(MGWTSettings.getAppSetting());
MGWTStyle.getTheme().getMGWTClientBundle().getMainCss().ensureInjected();
Label label = new Label("Welcome");
label.setAutoHorizontalAlignment(Label.ALIGN_CENTER);
Button button = new Button();
button.setRound(true);
button.setText("Click");
button.addTapHandler(new TapHandler() {
#Override
public void onTap(TapEvent event) {
Window.alert("Hola !");
}
});
layout.add(label);
layout.add(button);
//build animation helper and attach it
AnimationHelper animationHelper = new AnimationHelper();
// RootPanel.get().add(layout);
RootPanel.get().add(animationHelper);
animationHelper.goTo(layout, Animation.POP);
}
}
Can somebody help me out with this ? Thanks..!
You are adding more than one AnimatableDisplays to one region. Those will overlap.
You just added some lines of code to the mgwt showcase I guess without removing the showcase code. To fix this you could remove the call to start() from the timer.