Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

virtualkeyboard: adds a sliding animation to the keyboard #65

Merged
merged 1 commit into from
Jul 7, 2020
Merged

virtualkeyboard: adds a sliding animation to the keyboard #65

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
40 changes: 13 additions & 27 deletions TotalCrossSDK/src/main/java/totalcross/ui/dialog/keyboard/AlphabetKeyboard.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,13 +55,7 @@ public class AlphabetKeyboard extends Container {

public Button btSlash;

private int screenWidth, screenHeight, topHeight;

public AlphabetKeyboard(Integer width, Integer height, Integer topHeight) {
this.screenWidth = width != null ? width : Settings.screenWidth;
this.screenHeight = height != null ? height : Settings.screenHeight;
this.topHeight = topHeight != null ? topHeight : 0;

public AlphabetKeyboard() {
// First line
btQ = new Button("Q");
btW = new Button("W");
Expand Down Expand Up @@ -110,31 +104,22 @@ public AlphabetKeyboard(Integer width, Integer height, Integer topHeight) {

@Override
public void initUI() {
final float X = screenWidth * 0.01f;
final float Y = screenHeight * 0.01f;
final int HEIGHT_BUTTON = (int) (((screenHeight - (6 * Y)) / 4));
final int WIDTH_BUTTON = (int) (((screenWidth - (11 * X)) / 10));

setRect(LEFT, TOP + topHeight, FILL, FILL);

add(btComma);
add(btPeriod);
add(btSpace);
add(btSlash);
add(btn123);
add(btCancel);
final float X = width * 0.01f;
final float Y = height * 0.01f;
final int HEIGHT_BUTTON = this.fm.height * 3;
final int WIDTH_BUTTON = (int) (((width - (11 * X)) / 10));

final int aLeft = LEFT + (int) X;
final int hGap = (int) X;
final int vGap = (int) (Y);
final int aHeight = HEIGHT_BUTTON;

btn123.setRect(aLeft, BOTTOM - vGap, WIDTH_BUTTON * 2, aHeight);
btComma.setRect(AFTER + hGap, SAME, WIDTH_BUTTON, aHeight);
btPeriod.setRect(AFTER + hGap, SAME, WIDTH_BUTTON, aHeight);
btSpace.setRect(AFTER + hGap, SAME, (WIDTH_BUTTON * 3), aHeight);
btSlash.setRect(AFTER + hGap, SAME, WIDTH_BUTTON, aHeight);
btCancel.setRect(AFTER + hGap, SAME, FILL - hGap, aHeight);
add(btn123, aLeft, BOTTOM - vGap, WIDTH_BUTTON * 2, aHeight);
add(btComma, AFTER + hGap, SAME, WIDTH_BUTTON, aHeight, btn123);
add(btPeriod, AFTER + hGap, SAME, WIDTH_BUTTON, aHeight);
add(btSpace, AFTER + hGap, SAME, (WIDTH_BUTTON * 3), aHeight);
add(btSlash, AFTER + hGap, SAME, WIDTH_BUTTON, aHeight);
add(btCancel, AFTER + hGap, SAME, FILL - hGap, aHeight);

// Third line
addButtonLine(
Expand Down Expand Up @@ -190,7 +175,7 @@ public void initUI() {
btDel.setBackForeColors(Color.getRGB(143, 152, 162), Color.WHITE);
}

private void addButtonLine(
private void addButtonLine(
int WIDTH_BUTTON, int aLeft, int hGap, int vGap, int aHeight, Button... buttons) {
add(buttons[0], aLeft, BEFORE - vGap, WIDTH_BUTTON, aHeight);
configureKeyboardKey(buttons[0]);
Expand All @@ -205,6 +190,7 @@ private void configureKeyboardKey(Button button) {
button.setForeColor(FORE_COLOR);
button.setFont(font);
button.setBackColor(Color.getRGB(233, 233, 235));
button.effect = null;
}

public void changeCase(boolean toUpperCase) {
Expand Down
40 changes: 12 additions & 28 deletions TotalCrossSDK/src/main/java/totalcross/ui/dialog/keyboard/NumericAndSymbolsKeyboard.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,13 +57,7 @@ public class NumericAndSymbolsKeyboard extends Container {

public Button btSlash;

private int screenWidth, screenHeight, topHeight;

public NumericAndSymbolsKeyboard(Integer width, Integer height, Integer topHeight) {
this.screenWidth = width != null ? width : Settings.screenWidth;
this.screenHeight = height != null ? height : Settings.screenHeight;
this.topHeight = topHeight != null ? topHeight : 0;

public NumericAndSymbolsKeyboard() {
// First line
bt1 = new Button("1");
bt2 = new Button("2");
Expand Down Expand Up @@ -116,34 +110,23 @@ public NumericAndSymbolsKeyboard(Integer width, Integer height, Integer topHeigh

@Override
public void initUI() {
final float X = screenWidth * 0.01f;
final float Y = screenHeight * 0.01f;
final int HEIGHT_BUTTON = (int) (((screenHeight - (6 * Y)) / 4));
final int WIDTH_BUTTON = (int) (((screenWidth - (11 * X)) / 10));

setRect(LEFT, TOP + topHeight, FILL, FILL);

// last line
add(btComma);
add(btPeriod);
add(btSpace);
add(btSlash);
add(btnABC);
add(btCancel);
add(btDel);
final float X = width * 0.01f;
final float Y = height * 0.01f;
final int HEIGHT_BUTTON = this.fm.height * 3;
final int WIDTH_BUTTON = (int) (((width - (11 * X)) / 10));

final int aLeft = LEFT + (int) X;
final int hGap = (int) X;
final int vGap = (int) (Y);
final int aHeight = HEIGHT_BUTTON;

// Last line
btnABC.setRect(aLeft, BOTTOM - vGap, WIDTH_BUTTON * 2, aHeight);
btComma.setRect(AFTER + hGap, SAME, WIDTH_BUTTON, aHeight);
btPeriod.setRect(AFTER + hGap, SAME, WIDTH_BUTTON, aHeight);
btSpace.setRect(AFTER + hGap, SAME, (WIDTH_BUTTON * 3), aHeight);
btSlash.setRect(AFTER + hGap, SAME, WIDTH_BUTTON, aHeight);
btCancel.setRect(AFTER + hGap, SAME, FILL - hGap, aHeight);
add(btnABC, aLeft, BOTTOM - vGap, WIDTH_BUTTON * 2, aHeight);
add(btComma, AFTER + hGap, SAME, WIDTH_BUTTON, aHeight);
add(btPeriod, AFTER + hGap, SAME, WIDTH_BUTTON, aHeight);
add(btSpace, AFTER + hGap, SAME, (WIDTH_BUTTON * 3), aHeight);
add(btSlash, AFTER + hGap, SAME, WIDTH_BUTTON, aHeight);
add(btCancel, AFTER + hGap, SAME, FILL - hGap, aHeight);

// Third line
addButtonLine(
Expand Down Expand Up @@ -213,5 +196,6 @@ private void configureKeyboardKey(Button button) {
button.setForeColor(FORE_COLOR);
button.setFont(font);
button.setBackColor(Color.getRGB(233, 233, 235));
button.effect = null;
}
}
103 changes: 82 additions & 21 deletions TotalCrossSDK/src/main/java/totalcross/ui/dialog/keyboard/VirtualKeyboard.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,10 @@
import totalcross.ui.Edit;
import totalcross.ui.MultiEdit;
import totalcross.ui.Window;
import totalcross.ui.anim.ControlAnimation;
import totalcross.ui.anim.ControlAnimation.AnimationFinished;
import totalcross.ui.anim.FadeAnimation;
import totalcross.ui.anim.PathAnimation;
import totalcross.ui.event.ControlEvent;
import totalcross.ui.event.Event;
import totalcross.ui.event.KeyEvent;
Expand Down Expand Up @@ -64,6 +68,11 @@ public class VirtualKeyboard extends Window {

private static boolean changeOrientation = false;

private int animDir = BOTTOM;
protected int totalTime = 400;
private ControlAnimation currentAnimation;
private boolean fadeOnPopAndUnpop = true;

public static void orientationChanged(boolean changed) {
changeOrientation = changed;
}
Expand Down Expand Up @@ -124,7 +133,8 @@ protected VirtualKeyboard() {
/* Constant that defines the vertical factor . */
float Y = Settings.screenHeight * 0.01f;

setRect(LEFT, BOTTOM, FILL, SCREENSIZE + 50);
// Places the keyboard outside the screen with valid width and height for placing children
setRect(100000, 100000, SCREENSIZE, (int) (this.fm.height * 16.5), null, true);

setInsets(0, 0, 0, 0);

Expand Down Expand Up @@ -195,13 +205,7 @@ protected VirtualKeyboard() {
int buttonWidth = 2 * fmH;

int WIDTH_BUTTON = (int) ((Settings.screenWidth - (5 * X)) / 4);
int HEIGHT_BUTTON =
(int)
(6
* ((Settings.screenHeight < Settings.screenWidth
? Settings.screenWidth
: Settings.screenHeight)
* 0.01));
int HEIGHT_BUTTON = this.fm.height * 3;

valueEdit.setRect(
LEFT + ((int) X), TOP + (int) (Y), (int) ((WIDTH_BUTTON * 3) + (2 * X)), HEIGHT_BUTTON);
Expand All @@ -221,16 +225,10 @@ protected VirtualKeyboard() {
add(btnAbc);
btnAbc.setVisible(false);
add(btn123);
alfaKeyboard =
new AlphabetKeyboard(
getAbsoluteRect().width,
getAbsoluteRect().height - (HEIGHT_BUTTON + (int) (Y)),
HEIGHT_BUTTON + (int) (Y));
numericKeyboard =
new NumericAndSymbolsKeyboard(
getAbsoluteRect().width,
getAbsoluteRect().height - (HEIGHT_BUTTON + (int) (Y)),
HEIGHT_BUTTON + (int) (Y));
alfaKeyboard = new AlphabetKeyboard();
add(alfaKeyboard, LEFT, AFTER, FILL, FILL, valueEdit);
numericKeyboard = new NumericAndSymbolsKeyboard();
add(numericKeyboard, LEFT, AFTER, FILL, FILL, valueEdit);

backspaceEvent.type = KeyEvent.KEY_PRESS;
backspaceEvent.target = valueEdit;
Expand All @@ -246,7 +244,7 @@ protected VirtualKeyboard() {
// btn123.setForeColor(BLUE_COLOR);
// }
}

@Override
protected void onPopup() {
btnCancelPressed = false;
Expand All @@ -260,6 +258,45 @@ protected void onPopup() {
} else {
clrIcon.setVisible(true);
}

if (currentAnimation != null) {
return;
}

currentAnimation = PathAnimation.create(this, BOTTOM, null, totalTime);
if (fadeOnPopAndUnpop) {
currentAnimation.with(FadeAnimation.create(this, true, null, totalTime));
}
currentAnimation.setAnimationFinishedAction(new AnimationFinished() {
@Override
public void onAnimationFinished(ControlAnimation anim) {
currentAnimation = null;
}
});
currentAnimation.start();
}

protected void setRect(boolean screenResized) {
int ww = setW = SCREENSIZE;
switch (animDir) {
case LEFT:
setRect(0 - ww, TOP, ww, FILL, null, screenResized);
break;
case RIGHT:
setRect(RIGHT + ww, TOP, ww, FILL, null, screenResized);
break;
default:
resetSetPositions(); // required to make sure the height gets updated by the following setRect
setRect(LEFT, animDir, ww, SCREENSIZE + 50, null, screenResized);
break;
}
Window.needsPaint = true;
}

@Override
public void popup() {
setRect(false);
super.popup();
}

@Override
Expand All @@ -273,6 +310,30 @@ public void postUnpop() {
isOpen = false;
}

@Override
public void unpop() {
if (currentAnimation != null) {
return;
}

if (animDir == CENTER) {
currentAnimation = FadeAnimation.create(this, false, null, totalTime);
} else {
currentAnimation = PathAnimation.create(this, -animDir, null, totalTime);
if (fadeOnPopAndUnpop) {
currentAnimation.with(FadeAnimation.create(this, false, null, totalTime));
}
}
currentAnimation.setAnimationFinishedAction(new AnimationFinished() {
@Override
public void onAnimationFinished(ControlAnimation anim) {
currentAnimation = null;
VirtualKeyboard.super.unpop();
}
});
currentAnimation.start();
}

/**
* Organizes the visible buttons in accordance with the valid characters.
*
Expand Down Expand Up @@ -606,8 +667,8 @@ public static void updateImages(

@Override
public void screenResized() {
super.screenResized();
unpop();
setRect(true);
reposition(true);
}

/** Background Container used on MainWindow*/
Expand Down