AButton

Button with text, which can be pushed to make some action.

Header:	#include <AUI/View/AButton.h>
CMake:	aui_link(my_target PUBLIC aui::views)

Detailed Description

Button is a fundamental view which can be pushed to make some action.

The button view being pressed.

Button is styled with background, box shadow, and a border that highlights on hover. When pushed, the shadow disappears, making an illusion of pressing.

Button can be made default. In such case, it is colored to user's accent color, making it stand out. Also, when the user presses Enter, the button is pushed automatically.

Button usually contains text only, but in practice any view can be put in it.

Starting from AUI 8.0.0, AButton itself does not render text; instead, it's a styled container, which is populated with any views by the user, i.e., ALabel. AButton used to have Qt-like methods for customization like setIcon, but now a modern approach takes place, which allows extensive options of customization.

AButton supports both retained and immediate modes.

API surface

struct declarative::Button

_<AView> content

Content of the button. Can be any view, i.e., Label to display text.

contract::Slot<> onClick

Handler for button click event. Called when user activates the button.

bool isDefault

Determines if the button is default. Default buttons are colored with user's accent color and respond to Enter key.

Button with a lambda handler

This button executes the lambda upon click.

#include <AUI/Platform/Entry.h>
#include <AUI/Platform/AWindow.h>
#include <AUI/Util/UIBuildingHelpers.h>
#include <AUI/View/AButton.h>

using namespace ass;
using namespace declarative;

AUI_ENTRY {
    auto window = _new<AWindow>("Button", 600_dp, 300_dp);
    window->setContents(Centered {
      Button {
        .content = Label { "Click me" },
        .onClick = [] { ALogger::info("Test") << "Hello world!"; },
      },
    });
    window->show();
    return 0;
}

Button with a signal-slot handler

This button executes the member function upon click.

#include <AUI/Platform/Entry.h>
#include <AUI/Platform/AWindow.h>
#include <AUI/Util/UIBuildingHelpers.h>
#include <AUI/View/AButton.h>

using namespace ass;
using namespace declarative;

class MainWindow: public AWindow {
public:
    MainWindow(): AWindow("Button", 600_dp, 300_dp) {
        setContents(Centered {
            Button {
                .content = Label { "Click me" },
                .onClick = {me::onClick},
            },
        });
    }

private:
    void onClick() {
        ALogger::info("Test") << "Hello world!";
    }
};

AUI_ENTRY {
    _new<MainWindow>()->show();
    return 0;
}

Default button

Button can be made default. In such case, it is colored to user's accent color, making it stand out. Also, when the user presses Enter, the button is pushed automatically.

Button {
    .content = Label { "Click me" },
    .onClick = {me::onClick},
    .isDefault = true,
},

.

Button with icon

While buttons typically display text, they are actually flexible containers that can hold any view component. This means you can place various UI elements inside a button, such as images, icons, custom layouts, or combinations of different views.

See AUI Assets for more information on how to put icons in your application.

Button {
  .content =
      Horizontal {
        Icon { ":img/save.svg" },
        SpacerFixed { 2_dp },
        Label { "Button with icon" },
      },
  .onClick = { me::onClick },
},

Styling a button

AButton is styled as follows:

{
    t<AButton>(),
    BackgroundSolid {0xffffff_rgb},
    Padding {3_dp, 5_dp},
    MinSize {60_dp, 22_dp },
    Border { 1_dp, 0xcacaca_rgb },
    BorderRadius {5_dp},
    ATextAlign::CENTER,
    VerticalAlign::MIDDLE,
    BoxShadow {{}, 1_dp, 4_dp, -2_dp, 0x80000000_argb},
},
{
    t<AButton>::hover(),
    Border {1_dp, getOsThemeColor() * glm::vec4(1, 1, 1, 0.3f)}
},
{
    t<AButton>::active(),
    BackgroundSolid{0xfafafa_rgb},
},
{
    button::Default(t<AButton>()),
    FontRendering::ANTIALIASING,
    BackgroundGradient { ALinearGradientBrush{
            .colors = {
                    {0.f, getOsThemeColorLighter()},
                    {0.f, getOsThemeColor()},
            },
    } },
    BoxShadow { 0, 1_dp, 3_dp, -1_dp, getOsThemeColor() },
    Border { nullptr },
    TextColor { 0xffffff_rgb },
},
{
    button::Default(t<AButton>::hover()),
    BoxShadow { 0, 1_dp, 6_dp, -1_dp, getOsThemeColor() },
},
{
    t<AButton>::active(),
    BoxShadow { nullptr },
},
{
    button::Default(t<AButton>::hover()),
    BackgroundGradient { ALinearGradientBrush{
            .colors = {
                    {0.f, getOsThemeColorLighter()},
                    {1.f, getOsThemeColor()},
            },
    } },
},
{
    button::Default(t<AButton>::active()),
    BackgroundSolid { getOsThemeColor() }
},
{
    t<AButton>::disabled(),
    BackgroundSolid { 0xcccccc_rgb },
    BoxShadow { nullptr },
    Border { 1_dp, 0xbfbfbf_rgb },
    TextColor { 0x838383_rgb }
},

Examples

examples/7guis/counter/src/main.cpp

7GUIs Counter - Simple counter.

    CounterWindow() : AWindow("AUI - 7GUIs - Counter", 200_dp, 100_dp) {
        setContents(Centered {
          Horizontal {
            Label { AUI_REACT("Count: {}"_format(mCounter)) },
            Button { Label { "Count" }, [this] { mCounter += 1; } },
          } AUI_WITH_STYLE { LayoutSpacing { 4_dp } },
        });
    }

private:

examples/7guis/flight_booker/src/main.cpp

7GUIs Flight Booker - Flight Booker.

            },
        dateTextField(AUI_PTR_ALIAS(state, departureDate)),
        dateTextField(AUI_PTR_ALIAS(state, returnDate))
            AUI_LET { AObject::connect(state->isReturnFlight, AUI_SLOT(it)::setEnabled); },
        Button {
          .content = Label { "Book" },
          .onClick =
              [=] {
                  AString msg = "Departure - {}"_format(formatDate(state->departureDate.parsed->value()));
                  if (state->isReturnFlight) {

examples/7guis/circle_drawer/src/main.cpp

7GUIs Circle Drawer - Undo, redo, dialog control.

        setContents(
            Vertical {
              Centered {
                Horizontal {
                  Button { Label { "Undo" }, { me::undo } } AUI_LET {
                          connect(
                              AUI_REACT(mState.history.nextAction != mState.history.begin()), AUI_SLOT(it)::setEnabled);
                      },
                  Button { Label { "Redo" }, { me::redo } } AUI_LET {
                          connect(

examples/app/minesweeper/src/NewGameWindow.cpp

Minesweeper Game - Minesweeper game implementation driven by ass.

      }) AUI_WITH_STYLE { LayoutSpacing { 4_dp } },
      mDifficultyLabel = _new<ALabel>(),
      Horizontal {
        _new<ASpacerExpanding>(),
        _new<AButton>("Start game") AUI_LET {
                it->setDefault();
                connect(it->clicked, me::begin);
            },
        _new<AButton>("Cancel").connect(&AButton::clicked, me::close),
      } AUI_WITH_STYLE { LayoutSpacing { 4_dp } },

examples/app/fractal/src/FractalWindow.cpp

Fractal Example - Fractal viewer application demonstrating usage of custom shaders.

          },
        },
      },
      Vertical {
        _new<AButton>("Identity").connect(&AButton::clicked, AUI_SLOT(fractal)::reset),
        _new<AButton>("Jump to coords...")
            .connect(&AButton::clicked, this, [&, fractal]() { _new<JumpToCoordsWindow>(fractal, this)->show(); }),
        _new<ALabel>("Iterations:"),
        _new<ANumberPicker>().connect(
            &ANumberPicker::valueChanged, this, [fractal](int v) { fractal->setIterations(v); }) AUI_LET {

examples/app/minesweeper/src/MinesweeperWindow.cpp

Minesweeper Game - Minesweeper game implementation driven by ass.

MinesweeperWindow::MinesweeperWindow() : AWindow("Minesweeper", 100_dp, 100_dp) {
    setContents(Vertical {
      Horizontal {
        Centered::Expanding {
          _new<AButton>("New game...").connect(&AButton::clicked, me::newGame),
        },
      },
      _container<AStackedLayout>(
          { // also assign ".frame" ASS class in place
            mGrid = _new<AViewContainer>() << ".frame" }),

examples/app/fractal/src/JumpToCoordsWindow.cpp

Fractal Example - Fractal viewer application demonstrating usage of custom shaders.

        { "Scale="_as, scale },
      }) AUI_WITH_STYLE { LayoutSpacing { 4_dp } },
      Horizontal {
        SpacerExpanding {},
        _new<AButton>("Jump").connect(
            &AButton::clicked, this,
            [&, fractalView, re, im, scale]() {
                try {
                    auto dRe = std::stod((*re->text()).toStdString());
                    auto dIm = -std::stod((*re->text()).toStdString());

examples/ui/contacts/src/view/ContactDetailsView.cpp

AUI Contacts - Usage of AUI_DECLARATIVE_FOR to make a contacts-like application.

          }),
          Centered {
            Horizontal::Expanding {
              SpacerExpanding(),
              Button { Label { mEditorMode ? "Discard" : "Delete" }, {me::drop} },
              Button { Label { mEditorMode ? "Done" : "Edit" }, {me::toggleEdit} },
            } AUI_WITH_STYLE { MaxSize(EDITOR_CONTENT_MAX_WIDTH, {}), Padding(4_dp), LayoutSpacing { 4_dp } },
          },
        });
    });

Public Methods

constructor

---

explicit AButton::AButton(AString text)

Inflates a label with a text.

Deprecated

Left for compatibility.

This setter would override any of existing content within button.

Examples:

examples/app/minesweeper/src/NewGameWindow.cpp

Minesweeper Game - Minesweeper game implementation driven by ass.

      }) AUI_WITH_STYLE { LayoutSpacing { 4_dp } },
      mDifficultyLabel = _new<ALabel>(),
      Horizontal {
        _new<ASpacerExpanding>(),
        _new<AButton>("Start game") AUI_LET {
                it->setDefault();
                connect(it->clicked, me::begin);
            },
        _new<AButton>("Cancel").connect(&AButton::clicked, me::close),
      } AUI_WITH_STYLE { LayoutSpacing { 4_dp } },

examples/app/fractal/src/FractalWindow.cpp

Fractal Example - Fractal viewer application demonstrating usage of custom shaders.

          },
        },
      },
      Vertical {
        _new<AButton>("Identity").connect(&AButton::clicked, AUI_SLOT(fractal)::reset),
        _new<AButton>("Jump to coords...")
            .connect(&AButton::clicked, this, [&, fractal]() { _new<JumpToCoordsWindow>(fractal, this)->show(); }),
        _new<ALabel>("Iterations:"),
        _new<ANumberPicker>().connect(
            &ANumberPicker::valueChanged, this, [fractal](int v) { fractal->setIterations(v); }) AUI_LET {

examples/app/minesweeper/src/MinesweeperWindow.cpp

Minesweeper Game - Minesweeper game implementation driven by ass.

MinesweeperWindow::MinesweeperWindow() : AWindow("Minesweeper", 100_dp, 100_dp) {
    setContents(Vertical {
      Horizontal {
        Centered::Expanding {
          _new<AButton>("New game...").connect(&AButton::clicked, me::newGame),
        },
      },
      _container<AStackedLayout>(
          { // also assign ".frame" ASS class in place
            mGrid = _new<AViewContainer>() << ".frame" }),

examples/app/fractal/src/JumpToCoordsWindow.cpp

Fractal Example - Fractal viewer application demonstrating usage of custom shaders.

        { "Scale="_as, scale },
      }) AUI_WITH_STYLE { LayoutSpacing { 4_dp } },
      Horizontal {
        SpacerExpanding {},
        _new<AButton>("Jump").connect(
            &AButton::clicked, this,
            [&, fractalView, re, im, scale]() {
                try {
                    auto dRe = std::stod((*re->text()).toStdString());
                    auto dIm = -std::stod((*re->text()).toStdString());

setText

---

void AButton::setText(AString text)

Inflates a label with a text.

Deprecated

Left for compatibility.

This setter would override any of existing content within button.

Examples:

examples/app/game_of_life/src/main.cpp

Game of Life - Game of Life implementation that uses advanced large dynamic data rendering techniques such as ITexture, AImage to be GPU friendly. The computation is performed in AThreadPool.

                      connect(it->clicked, AUI_SLOT(mCells)::randomize);
                  },
              _new<AButton>() AUI_LET {
                      it & mCells.isRunning > [](AButton& b, bool isRunning) {
                          b.setText(isRunning ? "Pause" : "Run");
                      };
                      connect(it->clicked, [&] { mCells.isRunning = !mCells.isRunning; });
                  },
            } AUI_WITH_STYLE { LayoutSpacing { 4_dp } },
          },

examples/app/minesweeper/src/NewGameWindow.cpp

Minesweeper Game - Minesweeper game implementation driven by ass.

        case 8:
            text += "low";
            break;
    }
    mDifficultyLabel->setText(text);
}

NewGameWindow::NewGameWindow(MinesweeperWindow* minesweeper)
  : AWindow("New game", 100, 100, minesweeper), mMinesweeper(minesweeper) {
    setWindowStyle(WindowStyle::MODAL);

examples/app/fractal/src/FractalWindow.cpp

Fractal Example - Fractal viewer application demonstrating usage of custom shaders.

    }

    auto fractal = _new<FractalView>();
    connect(fractal->centerPosChanged, this, [centerPosDisplay](const glm::dvec2& newPos, double scale) {
        centerPosDisplay->setText("Center position: {} {}, scale: {}"_format(newPos.x, -newPos.y, scale));
    });

    setContents(Horizontal {
      Stacked::Expanding {
        fractal,

examples/app/fractal/src/JumpToCoordsWindow.cpp

Fractal Example - Fractal viewer application demonstrating usage of custom shaders.

    auto im = _new<ATextField>();
    auto scale = _new<ATextField>();

    auto pos = fractalView->getPlotPosition();
    re->setText(AString::number(pos.x));
    im->setText(AString::number(pos.y));
    scale->setText(AString::number(fractalView->getPlotScale()));

    setContents(Vertical {
      _form({