Numerical widgets



In [1]:

    
#include "xwidgets/xslider.hpp"



In [2]:

    
xw::slider<double> slider;

slider                 // If the semicolon is ommitted in the last line, the return value is displayed.









    Out[2]:



In [3]:

    
slider.value = 20;      // Modifying properties of widgets triggers the update of the frontend.









    Out[3]:





20



In [4]:

    
slider.value()          // Reading the value requires using the call operator









    Out[4]:





45



In [5]:

    
// changine some more properties
slider.max = 40;
slider.style().handle_color = "blue";
slider.orientation = "vertical";
slider.description = "A slider";



In [6]:

    
#include "xcpp/xdisplay.hpp"

using xcpp::display;



In [7]:

    
display(slider);       // xcpp::display can be called to explicitely trigger a the display of an object.

Using operator chaining to mimic keyword arguments



In [8]:

    
auto other_slider = xw::slider_generator<double>()
    .min(-1.0)
    .max(1.0)
    .description("Another slider")
    .finalize();

display(other_slider);

Progress



In [9]:

    
#include "xwidgets/xprogress.hpp"



In [ ]:

    
xw::progress<double> progress;



In [ ]:

    
progress



In [ ]:

    
progress.value = 60;



In [ ]:

    
progress.style().bar_color = "red";



In [ ]:

    
progress.description = "Completion";



In [ ]:

    
progress.style().description_width = "30px"

Numerical input



In [ ]:

    
#include "xwidgets/xnumeral.hpp"



In [ ]:

    
xw::numeral<double> numeral;
numeral



In [ ]:

    
numeral.value = 4



In [ ]:

    
numeral.value()

Timer



In [ ]:

    
#include "xwidgets/xplay.hpp"



In [ ]:

    
xw::play play;
play

Boolean widgets

Checkbox



In [ ]:

    
#include "xwidgets/xcheckbox.hpp"



In [ ]:

    
xw::checkbox checkbox;



In [ ]:

    
checkbox



In [ ]:

    
checkbox.value = true;



In [ ]:

    
checkbox.indent = false;

Toggle button



In [ ]:

    
#include "xwidgets/xtogglebutton.hpp"



In [ ]:

    
xw::togglebutton toggle;



In [ ]:

    
toggle



In [ ]:

    
toggle.value = true;



In [ ]:

    
toggle.description = "toggle";

Valid check



In [ ]:

    
#include "xwidgets/xvalid.hpp"



In [ ]:

    
xw::valid valid;



In [ ]:

    
valid



In [ ]:

    
valid.value = true;

String widgets



In [ ]:

    
#include "xwidgets/xlabel.hpp"



In [ ]:

    
xw::label label;



In [ ]:

    
label



In [ ]:

    
label.value = "Some caption";



In [ ]:

    
#include "xwidgets/xhtml.hpp"



In [ ]:

    
xw::html html;



In [ ]:

    
html.value = R"xhtml(
    <div style="
        width: 50%;
        height: 100px;
        background: #323;
        color: white;
        text-align: center;"
        >Some HTML
    </div>
)xhtml";
html



In [ ]:

    
#include <iostream>
#include "xwidgets/xtext.hpp"



In [ ]:

    
xw::text text;
text.value = "Some text";
text



In [ ]:

    
void submit_callback()
{
    std::cout << "submitted" << std::endl;
}



In [ ]:

    
text.on_submit(submit_callback);



In [ ]:

    
#include "xwidgets/xtextarea.hpp"



In [ ]:

    
xw::textarea textarea;
textarea.value = R"textarea(Lorem ipsum dolor sit amet, consectetur 
adipiscing elit,  sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris  nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla 
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa 
qui officia deserunt mollit anim id est laborum.
)textarea";
textarea



In [ ]:

    
#include "xwidgets/xpassword.hpp"



In [ ]:

    
xw::password password;



In [ ]:

    
password



In [10]:

    
#include <iostream>
#include "xwidgets/xbutton.hpp"



In [11]:

    
xw::button bt;



In [12]:

    
void foo()
{
    std::cout << "Clicked!" << std::endl;
}



In [13]:

    
bt.on_click(foo);
    
bt









    Out[13]:



In [14]:

    
bt.description = "button";



In [15]:

    
bt.button_style = "success";



In [16]:

    
bt.button_style = "some invalid value";  // values are validated upon assignment









    



Standard Exception: Invalid proposal for string enum



In [17]:

    
std::cout << bt.button_style();









    



success

Widgets layout



In [ ]:

    
bt.layout().width = "50%";
bt.layout().height = "200px";



In [ ]:

    
bt.style().button_color = "#888";

Value semantics



In [ ]:

    
xw::button bt_copy = bt;



In [ ]:

    
bt_copy



In [ ]:

    
bt.style().button_color = "red";
bt_copy.style().button_color = "green";



In [ ]:

    
#include "xwidgets/xslider.hpp"



In [ ]:

    
xw::slider<double> slide1;
slide1.value = 4.0;



In [ ]:

    
xw::slider<double> slide2 = slide1;



In [ ]:

    
slide2



In [ ]:

    
#include "xwidgets/xslider.hpp"
#include "xwidgets/xlink.hpp"
#include "xwidgets/xbox.hpp"



In [ ]:

    
xw::slider<double> s1, s2;

s1.description = "Slider 1";
s2.description = "Slider 2";



In [ ]:

    
auto l = xw::link(s1, "value", s2, "value");



In [ ]:

    
s1



In [ ]:

    
s2



In [ ]:

    
xw::slider<double> source, target;



In [ ]:

    
auto dl = xw::directional_link(source, "value", target, "value");



In [ ]:

    
source



In [ ]:

    
target

Box widgets



In [ ]:

    
#include "xwidgets/xbutton.hpp"
#include "xwidgets/xslider.hpp"
#include "xwidgets/xbox.hpp"



In [ ]:

    
xw::vbox b;
xw::slider<double> slid1;
slid1.description = "Slider 1";
xw::slider<double> slid2;
slid2.description = "Slider 2";



In [ ]:

    
b.add(xw::button());
b.add(slid1);
b.add(slid2);



In [ ]:

    
b



In [ ]:

    
b.remove(slid1)



In [ ]:

    
b.clear()

Controller



In [ ]:

    
#include "xwidgets/xcontroller.hpp"



In [ ]:

    
xw::controller c



In [ ]:

    
c

Selection widgets

Toggle buttons



In [ ]:

    
#include "xwidgets/xtogglebuttons.hpp"



In [ ]:

    
xw::togglebuttons tb(std::vector<std::string>({"foo", "bar"}), "foo");



In [ ]:

    
tb



In [ ]:

    
tb.value = "bar";



In [ ]:

    
tb._options_labels = std::vector<std::string>({"baz", "taz"});



In [ ]:

    
#include "xwidgets/xdropdown.hpp"



In [ ]:

    
xw::dropdown dd(std::vector<std::string>({"foo", "bar"}), "foo");



In [ ]:

    
dd

RadioButtons



In [ ]:

    
#include "xwidgets/xradiobuttons.hpp"



In [ ]:

    
xw::radiobuttons rb(std::vector<std::string>({"foo", "bar"}), "foo");



In [ ]:

    
rb

Select



In [ ]:

    
#include "xwidgets/xselect.hpp"



In [ ]:

    
xw::select sel(std::vector<std::string>({"foo", "bar"}), "foo");



In [ ]:

    
sel



In [ ]:

    
sel.rows = 3

Selection slider



In [ ]:

    
#include "xwidgets/xselectionslider.hpp"



In [ ]:

    
xw::selectionslider sslid(std::vector<std::string>({"foo", "bar", "baz", "taz"}), "foo");



In [ ]:

    
sslid

Multiple Select



In [ ]:

    
#include "xwidgets/xselect.hpp"



In [ ]:

    
xw::select_multiple mul_sel(std::vector<std::string>({"foo", "bar"}));



In [ ]:

    
mul_sel



In [ ]:

    
mul_sel.value()



In [ ]:

    
mul_sel.value = std::vector<std::string>();

Selection range slider



In [ ]:

    
#include "xwidgets/xselectionslider.hpp"



In [ ]:

    
xw::selection_rangeslider range_sslid(std::vector<std::string>({"foo", "bar", "baz", "taz"}));



In [ ]:

    
range_sslid



In [ ]:

    
range_sslid.value()

Selection Containers

Tabs



In [ ]:

    
#include "xwidgets/xtab.hpp"
#include "xwidgets/xbutton.hpp"
#include "xwidgets/xslider.hpp"



In [ ]:

    
xw::tab tabs;



In [ ]:

    
xw::slider<double> tab_slid;
tabs.add(xw::button());
tabs.add(tab_slid);



In [ ]:

    
tabs



In [ ]:

    
tabs.set_title(0, "zero");
tabs.set_title(1, "one");

Accordion



In [ ]:

    
#include "xwidgets/xaccordion.hpp"
#include "xwidgets/xbutton.hpp"



In [ ]:

    
xw::accordion accord;



In [ ]:

    
accord.add(xw::button());
accord.add(xw::button());
accord.add(xw::button());



In [ ]:

    
accord



In [ ]:

    
accord.set_title(0, "zero");
accord.set_title(1, "one");
accord.set_title(2, "two");

Color picker



In [ ]:

    
#include "xwidgets/xcolor_picker.hpp"



In [ ]:

    
xw::color_picker cpicker;



In [ ]:

    
cpicker



In [ ]:

    
cpicker.value = "blue";



In [ ]:

    
cpicker.concise = true;

Media



In [ ]:

    
#include "xwidgets/ximage.hpp"
#include "xwidgets/xvideo.hpp"
#include "xwidgets/xaudio.hpp"



In [ ]:

    
auto im = xw::image_from_file("marie.png").finalize();
im



In [ ]:

    
auto vid1 = xw::video_from_file("Big.Buck.Bunny.mp4").finalize();
vid1



In [ ]:

    
auto vid2 = xw::video_from_url("https://webrtc.github.io/samples/src/video/chrome.webm").finalize();
vid2



In [ ]:

    
auto au = xw::audio_from_file("Big.Buck.Bunny.mp3").finalize();
au

Output



In [ ]:

    
#include "xwidgets/xoutput.hpp"



In [ ]:

    
xw::output out;
out



In [ ]:

    
#include <iostream>



In [ ]:

    
{
    // Using a scope guard to enable output capture
    auto g = out.guard();
    std::cout << "This output is captured." << std::endl;
}



In [ ]:

    
#include <xcpp/xdisplay.hpp>



In [ ]:

    
{
    // Using a scope guard to clear output widget
    auto g = out.guard();
    xcpp::clear_output();
}



In [ ]:

Numerical widgets

Defining a Slider Widget

Using operator chaining to mimic keyword arguments

Progress

Numerical input

Timer

Boolean widgets

Checkbox

Toggle button

Valid check

String widgets

Label widget

HTML widget

Text widget

Textarea widget

Password widget

Button widget

Widgets layout

Value semantics

Link widget

Box widgets

Controller

Selection widgets

Toggle buttons

RadioButtons

Select

Selection slider

Multiple Select

Selection range slider

Selection Containers

Tabs

Accordion

Color picker

Media

Output

Numerical widgets

Defining a Slider Widget

Using operator chaining to mimic keyword arguments

Progress

Numerical input

Timer

Boolean widgets

Checkbox

Toggle button

Valid check

String widgets

Label widget

HTML widget

Text widget

Textarea widget

Password widget

Button widget

Widgets layout

Value semantics

Link widget

Box widgets

Controller

Selection widgets

Toggle buttons

Dropdown

RadioButtons

Select

Selection slider

Multiple Select

Selection range slider

Selection Containers

Tabs

Accordion

Color picker

Media

Output