1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
224
229
230
231
232
233
234
235
236
/* ... */
#include <gui/product_presenter_screen/FeaturePoster.hpp>
#include <BitmapDatabase.hpp>
#include <touchgfx/EasingEquations.hpp>
#include <touchgfx/Color.hpp>
FeaturePoster::FeaturePoster() :
startAnimationCallback(this, &FeaturePoster::startAnimationHandler),
moveAnimationEnded(this, &FeaturePoster::moveAnimationEndedHandler)
{
shadow[0].setBitmap(Bitmap(BITMAP_POSTER_SHADOW_TOP_ID));
shadow[0].setXY(0, 0);
add(shadow[0]);
shadow[1].setBitmap(Bitmap(BITMAP_POSTER_SHADOW_LEFT_ID));
shadow[1].setXY(0, shadow[0].getHeight());
add(shadow[1]);
shadow[2].setBitmap(Bitmap(BITMAP_POSTER_SHADOW_RIGHT_ID));
shadow[2].setXY(shadow[0].getWidth() - shadow[2].getWidth(), shadow[0].getHeight());
add(shadow[2]);
shadow[3].setBitmap(Bitmap(BITMAP_POSTER_SHADOW_BOTTOM_ID));
shadow[3].setXY(0, shadow[1].getRect().bottom());
add(shadow[3]);
posterImage.setBitmap(Bitmap(BITMAP_POSTER_IMAGE_00_ID));
posterImage.setXY(0, 0);
posterArea.setPosition(shadow[1].getWidth(), shadow[0].getHeight(), posterImage.getWidth(), 350);
startAnimationButton.setBitmaps(Bitmap(BITMAP_POSTER_ANIMATION_BUTTON_ID), Bitmap(BITMAP_POSTER_ANIMATION_BUTTON_ID));
startAnimationButton.setXY(192, 202);
startAnimationButton.setAction(startAnimationCallback);
startAnimationButtonArrow.setBitmaps(BITMAP_POSTER_ANIMATION_BUTTON_ARROW_00_ID, BITMAP_POSTER_ANIMATION_BUTTON_ARROW_06_ID);
startAnimationButtonArrow.setXY(startAnimationButton.getX() + 39, startAnimationButton.getY() + 35);
startAnimationButtonArrow.setUpdateTicksInterval(3);
alphaBox.setColor(Color::getColorFrom24BitRGB(0x0B, 0x5E, 0x93));
alphaBox.setPosition(0, 0, posterImage.getWidth(), 40);
alphaBox.setAlpha(0);
textAreaContainer.setPosition(posterImage.getX(), posterImage.getRect().bottom(), posterImage.getWidth(), 400);
textBackground.setColor(Color::getColorFrom24BitRGB(0xFF, 0xFF, 0xFF));
textBackground.setPosition(0, 0, textAreaContainer.getWidth(), textAreaContainer.getHeight());
textStartY = 20;
text.setTypedText(TypedText(T_POSTER_00_TEXT));
text.setColor(Color::getColorFrom24BitRGB(0x9C, 0x9C, 0x9C));
text.setXY(16, textStartY);
redBall.setBitmap(Bitmap(BITMAP_ALPHA_BALL_RED_ID));
redBall.setXY(0, 196);
redBall.setMoveAnimationEndedAction(moveAnimationEnded);
redBall.setVisible(false);
greenBall.setBitmap(Bitmap(BITMAP_ALPHA_BALL_GREEN_ID));
greenBall.setXY(0, 196);
greenBall.setMoveAnimationEndedAction(moveAnimationEnded);
greenBall.setVisible(false);
blueBall.setBitmap(Bitmap(BITMAP_ALPHA_BALL_BLUE_ID));
blueBall.setXY(0, 196);
blueBall.setMoveAnimationEndedAction(moveAnimationEnded);
blueBall.setVisible(false);
textAreaContainer.add(textBackground);
textAreaContainer.add(text);
textAreaContainer.add(redBall);
textAreaContainer.add(greenBall);
textAreaContainer.add(blueBall);
gradientOverlay.setBitmap(Bitmap(BITMAP_POSTER_GRADIENT_OVERLAY_ID));
gradientOverlay.setXY(0, posterArea.getRect().bottom() - gradientOverlay.getHeight());
posterArea.add(posterImage);
posterArea.add(alphaBox);
posterArea.add(headlineTop);
posterArea.add(headlineBottom);
posterArea.add(textAreaContainer);
posterArea.add(startAnimationButton);
posterArea.add(startAnimationButtonArrow);
posterArea.add(gradientOverlay);
add(posterArea);
setWidth(shadow[1].getWidth() + posterImage.getWidth() + shadow[2].getWidth());
setHeight(shadow[0].getHeight() + shadow[1].getHeight() + shadow[3].getHeight());
currentState = SHOWING_IMAGE;
}{ ... }
FeaturePoster::~FeaturePoster()
{
}{ ... }
void FeaturePoster::setup(BitmapId newPosterImage, TEXTS posterHeadline, TEXTS posterText, bool showAlphaExample)
{
this->posterImage.setBitmap(Bitmap(newPosterImage));
headlineTop.setTypedText(TypedText(posterHeadline));
headlineTop.setColor(Color::getColorFrom24BitRGB(0xFF, 0xFF, 0xFF));
headlineTopStartY = -30 - headlineTop.getTypedText().getFont()->getFontHeight();
headlineTop.setXY(16, headlineTopStartY);
headlineTop.resizeToCurrentText();
headlineBottom.setTypedText(TypedText(posterHeadline));
headlineBottom.setColor(Color::getColorFrom24BitRGB(0xFF, 0xFF, 0xFF));
headlineBottom.setXY(16, textAreaContainer.getY() - 10 - headlineBottom.getTypedText().getFont()->getFontHeight());
headlineBottom.resizeToCurrentText();
text.setTypedText(TypedText(posterText));
if (showAlphaExample)
{
redBall.setVisible(true);
greenBall.setVisible(true);
blueBall.setVisible(true);
moveAnimationEndedHandler(redBall);
moveAnimationEndedHandler(greenBall);
moveAnimationEndedHandler(blueBall);
}if (showAlphaExample) { ... }
}{ ... }
void FeaturePoster::setHeadlineColor(uint16_t color)
{
headlineBottom.setColor(color);
headlineBottom.invalidate();
}{ ... }
void FeaturePoster::animate()
{
if (currentState == SHOWING_IMAGE)
{
posterImage.startMoveAnimation(0, -70, 25, EasingEquations::linearEaseNone, EasingEquations::quadEaseInOut);
textAreaContainer.startMoveAnimation(0, alphaBox.getHeight(), 25, EasingEquations::linearEaseNone, EasingEquations::quadEaseInOut);
alphaBox.setFadeAnimationDelay(15);
alphaBox.startFadeAnimation(255, 17);
headlineTop.setMoveAnimationDelay(5);
headlineTop.startMoveAnimation(headlineTop.getX(), 29 - headlineTop.getTypedText().getFont()->getFontHeight(), 25, EasingEquations::linearEaseNone, EasingEquations::quadEaseInOut);
gradientOverlay.setFadeAnimationDelay(0);
gradientOverlay.startFadeAnimation(0, 4);
int startAnimationButtonEndY = alphaBox.getHeight() - startAnimationButton.getHeight() + 25;
startAnimationButton.startMoveAnimation(startAnimationButton.getX(), startAnimationButtonEndY, 25, EasingEquations::linearEaseNone, EasingEquations::quadEaseInOut);
startAnimationButtonArrow.startMoveAnimation(startAnimationButton.getX() + 39, startAnimationButtonEndY + 35, 25, EasingEquations::linearEaseNone, EasingEquations::quadEaseInOut);
startAnimationButtonArrow.startAnimation(false, false, false);
currentState = SHOWING_TEXT;
}if (currentState == SHOWING_IMAGE) { ... }
else if (currentState == SHOWING_TEXT)
{
posterImage.startMoveAnimation(0, 0, 25, EasingEquations::linearEaseNone, EasingEquations::quadEaseInOut);
textAreaContainer.startMoveAnimation(0, posterImage.getHeight(), 25, EasingEquations::linearEaseNone, EasingEquations::quadEaseInOut);
alphaBox.setFadeAnimationDelay(8);
alphaBox.startFadeAnimation(0, 17);
headlineTop.setMoveAnimationDelay(0);
headlineTop.startMoveAnimation(headlineTop.getX(), headlineTopStartY, 25, EasingEquations::linearEaseNone, EasingEquations::quadEaseInOut);
gradientOverlay.setFadeAnimationDelay(20);
gradientOverlay.startFadeAnimation(255, 8);
startAnimationButton.startMoveAnimation(startAnimationButton.getX(), 202, 25, EasingEquations::linearEaseNone, EasingEquations::quadEaseInOut);
startAnimationButtonArrow.startMoveAnimation(startAnimationButton.getX() + 39, 202 + 35, 25, EasingEquations::linearEaseNone, EasingEquations::quadEaseInOut);
startAnimationButtonArrow.startAnimation(true, false, false);
currentState = SHOWING_IMAGE;
}else if (currentState == SHOWING_TEXT) { ... }
}{ ... }
void FeaturePoster::startAnimationHandler(const AbstractButton& button)
{
animate();
}{ ... }
void FeaturePoster::invalidateText()
{
headlineTop.invalidate();
headlineTop.resizeToCurrentText();
headlineTop.invalidate();
headlineBottom.invalidate();
headlineBottom.resizeToCurrentText();
headlineBottom.invalidate();
text.invalidate();
}{ ... }
void FeaturePoster::moveAnimationEndedHandler(const MoveAnimator<Image>& image)
{
MoveAnimator<Image>* active = &blueBall;
int duration = 70;
if(&image == &redBall)
{
active = &redBall;
duration = 130;
}if (&image == &redBall) { ... }
else if(&image == &greenBall)
{
active = &greenBall;
duration = 250;
}else if (&image == &greenBall) { ... }
int y = text.getTextHeight()+20;
int x = active->getX() < textAreaContainer.getWidth()/2 ? textAreaContainer.getWidth()-active->getWidth()-30 : 30;
active->startMoveAnimation(x,y,duration, EasingEquations::cubicEaseInOut);
}{ ... }
void FeaturePoster::toggleViewMode()
{
startAnimationHandler(startAnimationButton);
}{ ... }