#ifndef __BUTTON_WITH_IMAGE_AND_LABEL__
#define __BUTTON_WITH_IMAGE_AND_LABEL__
/* ButtonWithLabel is a TouchGFX Widget */
class ButtonWithImageAndLabel : public ButtonWithLabel
{
public:
ButtonWithImageAndLabel() :
offset(0)
{ }
virtual ~ButtonWithImageAndLabel() {}
void setOffset(uint16_t _offset)
{
offset = _offset;
}
virtual void draw(const Rect& area) const
{
Button::draw(area);
/* We get typedText from touchgfx::ButtonWithLabel */
const Font* fontToDraw = typedText.getFont();
if ((fontToDraw != 0) && typedText.hasValidId())
{
uint8_t height = textHeightIncludingSpacing;
Rect labelRect;
labelRect = Rect(0, offset, this->getWidth(), height);
Rect dirty = labelRect & area;
if (!dirty.isEmpty())
{
dirty.x -= labelRect.x;
dirty.y -= labelRect.y;
translateRectToAbsolute(labelRect);
LCD::StringVisuals visuals(fontToDraw, pressed ? colorPressed : color, alpha, typedText.getAlignment(), 0, rotation, typedText.getTextDirection(), 0);
HAL::lcd().drawString(labelRect, dirty, visuals, typedText.getText());
}
}
}
private:
uint16_t offset;
};
#endif /* __BUTTON_WITH_IMAGE_AND_LABEL__ */
I created a custom Button that inherits from ButtonWithLabel allowing it to draw both a Text and pressed/Released Images (As the Standard Button does), but with an offset so you can place the text where you want and not in the center as the standard ButtonWithLabel does. You see how we use LCD::drawString() to instead draw the text at an offset leaving room for the images to define something above the text.
Hope that can give some inspiration.
Best regards,
Martin
