Home | History | Annotate | Download | only in trackbar
      1 Adding a Trackbar to our applications! {#tutorial_trackbar}
      2 ======================================
      3 
      4 -   In the previous tutorials (about *linear blending* and the *brightness and contrast
      5     adjustments*) you might have noted that we needed to give some **input** to our programs, such
      6     as \f$\alpha\f$ and \f$beta\f$. We accomplished that by entering this data using the Terminal
      7 -   Well, it is time to use some fancy GUI tools. OpenCV provides some GUI utilities (*highgui.h*)
      8     for you. An example of this is a **Trackbar**
      9 
     10     ![](images/Adding_Trackbars_Tutorial_Trackbar.png)
     11 
     12 -   In this tutorial we will just modify our two previous programs so that they get the input
     13     information from the trackbar.
     14 
     15 Goals
     16 -----
     17 
     18 In this tutorial you will learn how to:
     19 
     20 -   Add a Trackbar in an OpenCV window by using @ref cv::createTrackbar
     21 
     22 Code
     23 ----
     24 
     25 Let's modify the program made in the tutorial @ref tutorial_adding_images. We will let the user enter the
     26 \f$\alpha\f$ value by using the Trackbar.
     27 @code{.cpp}
     28 #include <opencv2/opencv.hpp>
     29 using namespace cv;
     30 
     31 /// Global Variables
     32 const int alpha_slider_max = 100;
     33 int alpha_slider;
     34 double alpha;
     35 double beta;
     36 
     37 /// Matrices to store images
     38 Mat src1;
     39 Mat src2;
     40 Mat dst;
     41 
     42 /*
     43  * @function on_trackbar
     44  * @brief Callback for trackbar
     45  */
     46 void on_trackbar( int, void* )
     47 {
     48   alpha = (double) alpha_slider/alpha_slider_max ;
     49   beta = ( 1.0 - alpha );
     50 
     51   addWeighted( src1, alpha, src2, beta, 0.0, dst);
     52 
     53   imshow( "Linear Blend", dst );
     54 }
     55 
     56 int main( int argc, char** argv )
     57 {
     58   /// Read image ( same size, same type )
     59   src1 = imread("../../images/LinuxLogo.jpg");
     60   src2 = imread("../../images/WindowsLogo.jpg");
     61 
     62   if( !src1.data ) { printf("Error loading src1 \n"); return -1; }
     63   if( !src2.data ) { printf("Error loading src2 \n"); return -1; }
     64 
     65   /// Initialize values
     66   alpha_slider = 0;
     67 
     68   /// Create Windows
     69   namedWindow("Linear Blend", 1);
     70 
     71   /// Create Trackbars
     72   char TrackbarName[50];
     73   sprintf( TrackbarName, "Alpha x %d", alpha_slider_max );
     74 
     75   createTrackbar( TrackbarName, "Linear Blend", &alpha_slider, alpha_slider_max, on_trackbar );
     76 
     77   /// Show some stuff
     78   on_trackbar( alpha_slider, 0 );
     79 
     80   /// Wait until user press some key
     81   waitKey(0);
     82   return 0;
     83 }
     84 @endcode
     85 
     86 Explanation
     87 -----------
     88 
     89 We only analyze the code that is related to Trackbar:
     90 
     91 -#  First, we load 02 images, which are going to be blended.
     92     @code{.cpp}
     93     src1 = imread("../../images/LinuxLogo.jpg");
     94     src2 = imread("../../images/WindowsLogo.jpg");
     95     @endcode
     96 -#  To create a trackbar, first we have to create the window in which it is going to be located. So:
     97     @code{.cpp}
     98     namedWindow("Linear Blend", 1);
     99     @endcode
    100 -#  Now we can create the Trackbar:
    101     @code{.cpp}
    102     createTrackbar( TrackbarName, "Linear Blend", &alpha_slider, alpha_slider_max, on_trackbar );
    103     @endcode
    104     Note the following:
    105 
    106     -   Our Trackbar has a label **TrackbarName**
    107     -   The Trackbar is located in the window named **"Linear Blend"**
    108     -   The Trackbar values will be in the range from \f$0\f$ to **alpha_slider_max** (the minimum
    109         limit is always **zero**).
    110     -   The numerical value of Trackbar is stored in **alpha_slider**
    111     -   Whenever the user moves the Trackbar, the callback function **on_trackbar** is called
    112 
    113 -#  Finally, we have to define the callback function **on_trackbar**
    114     @code{.cpp}
    115     void on_trackbar( int, void* )
    116     {
    117      alpha = (double) alpha_slider/alpha_slider_max ;
    118      beta = ( 1.0 - alpha );
    119 
    120      addWeighted( src1, alpha, src2, beta, 0.0, dst);
    121 
    122      imshow( "Linear Blend", dst );
    123     }
    124     @endcode
    125     Note that:
    126     -   We use the value of **alpha_slider** (integer) to get a double value for **alpha**.
    127     -   **alpha_slider** is updated each time the trackbar is displaced by the user.
    128     -   We define *src1*, *src2*, *dist*, *alpha*, *alpha_slider* and *beta* as global variables,
    129         so they can be used everywhere.
    130 
    131 Result
    132 ------
    133 
    134 -   Our program produces the following output:
    135 
    136     ![](images/Adding_Trackbars_Tutorial_Result_0.jpg)
    137 
    138 -   As a manner of practice, you can also add 02 trackbars for the program made in
    139     @ref tutorial_basic_linear_transform. One trackbar to set \f$\alpha\f$ and another for \f$\beta\f$. The output might
    140     look like:
    141 
    142     ![](images/Adding_Trackbars_Tutorial_Result_1.jpg)
    143