nana::label
Defined in header <nana/gui/widgets/label.hpp>;
class label;

A label widget enables an application to provide user with informational text and image.


Public base classes
widget_object<category::widget_tag> : public widget

Events
general events

Member types

Member functions
Modifiers
Measuring functions

Note


Formatted text mode

The following examples demonstrate the use of format text. First of all, formatted text mode should be enabled. the multibytes string in following examples must be encoded as utf-8

a_label.format(true);

a_label.caption("Hello, <bold>This is a bold text</>");
Label with bold text 

a_label.caption("Hello, <bold color=0xff0000>This is a bold red text</>");
Label with bold text 

a_label.caption("Hello, <bold color=0xff0000 font=\"Consolas\">This is a bold red Consolas text</>");
Label with bold red Consolas text

Using url attribute

a_label.caption("Hello, <bold color=0xff0000 font=\"Consolas\" url=\"https://nanapro.org\">This is a bold red Consolas text</>");
Arrow cursor becomes a hand when the cursor moves over the red text. Meanwhile, it calls a web browser to open the URL by clicking the red text. NOTE: the url only works under Windows

Using target attribute

using namespace nana;
                                        
int main()
{
        form fm;
        label lb(fm, rectangle{0, 0, 100, 40});
        lb.caption("Click <color=0xff target=\"target id\">here</>");
        lb.format(true);
        lb.add_format_listener([](label::command cmd, const nana::string& str)
        {
                if(label::command::click == cmd)
                {
                        msgbox mb(L"target clicked");
                        mb<<L"the target \""<<str<<"\" is clicked";
                        mb();
                }
        });
        
        fm.show();
        exec();
}

Reserved words

The formatted text defines some reserved words: red, green, blue, white and black. The reserved words can simplify the formatted text and increas readability.

a_label.caption("Click <color=0xff target=\"target id\">here</>");
                                //vs
                                a_label.caption("Click <blue target=\"target id\">here</>");

Showing images

a_label.caption("<image=\"file.bmp\"><bold red size=20>Nana C++ Library</>");
As you see, the image tag has not a close-tag </>
The image is displayed with its orignal size. With specifying a size, we can get a proper size by which the image is displayed. 
a_label.caption("<image=\"file.bmp\" size=(150,150)><bold red size=20>Nana C++ Library</>");
Specifying a proper size"size=(150,150)" means that it stretchs the image by the specified size.
In many situations, the image is required to be displayed by a given size but with preserving aspect ratio. By using max_limited/min_limited, it is possible to make it. max_limited: stretchs the image with preserving aspect ratio until its one of edge beyongds the specified size.
min_limited: stretchs the image with preserving aspect ratio until its one of edge is less than the specified size.
a_label.caption("<image=\"file.bmp\" size=(150,150) max_limited><bold red size=20>Nana C++ Library</>");
Stretchs with preserving aspect ratio but less than the specified size

Aligning the text in formatted text mode

The default alignment of text is baseline-aligned. Nana provides 4 kinds of alignments: top, center, bottom and baseline. They are useful tools when display texts with different size in a line.

a_label.caption("<size=12 top>top</><size=14 center>center<size=16 bottom>bottom</><size=30>baseline</><size=10>small font by baseline</>");
Label Alignment