Scilab IPCV

Image Processing and Computer Vision Module for Scilab 6.0!

Building a GUI to Load and Show Images

A lot of time we need to present our idea in a more presentable form, or make our program more user friendly to others. Building a graphic user interface could help us on this.

Scilab atoms module : Scilab GUI Builder could help us to build a GUI easily, while it is not perfect yet, it serves the basic purpose on GUI building.

This tutorial would be presented in Video mode as the part 4 of GUI Builder with Scilab, or you could just use the code below and run it. Do not that the top part of the codes are automatically generated by the guibuilder, only the callbacks codes are hand coded.

// This GUI file is generated by guibuilder version 4.1
//////////
f=figure('figure_position',[400,50],'figure_size',[640,480],'auto_resize','on','background',[33],'figure_name','Graphic window number %d','dockable','off','infobar_visible','off','toolbar_visible','off','menubar_visible','off','default_axes','on','visible','off');
//////////
handles.dummy = 0;
handles.pbLoad=uicontrol(f,'unit','normalized','BackgroundColor',[-1,-1,-1],'Enable','on','FontAngle','normal','FontName','Tahoma','FontSize',[12],'FontUnits','points','FontWeight','normal','ForegroundColor',[-1,-1,-1],'HorizontalAlignment','center','ListboxTop',[],'Max',[1],'Min',[0],'Position',[0.7868590,0.8045455,0.1858974,0.0909091],'Relief','default','SliderStep',[0.01,0.1],'String','Load Image','Style','pushbutton','Value',[0],'VerticalAlignment','middle','Visible','on','Tag','pbLoad','Callback','pbLoad_callback(handles)')
handles.pbGray=uicontrol(f,'unit','normalized','BackgroundColor',[-1,-1,-1],'Enable','on','FontAngle','normal','FontName','Tahoma','FontSize',[12],'FontUnits','points','FontWeight','normal','ForegroundColor',[-1,-1,-1],'HorizontalAlignment','center','ListboxTop',[],'Max',[1],'Min',[0],'Position',[0.7868590,0.6598485,0.1858974,0.0909091],'Relief','default','SliderStep',[0.01,0.1],'String','Gray Image','Style','pushbutton','Value',[0],'VerticalAlignment','middle','Visible','on','Tag','pbGray','Callback','pbGray_callback(handles)')
handles.pbBinary=uicontrol(f,'unit','normalized','BackgroundColor',[-1,-1,-1],'Enable','on','FontAngle','normal','FontName','Tahoma','FontSize',[12],'FontUnits','points','FontWeight','normal','ForegroundColor',[-1,-1,-1],'HorizontalAlignment','center','ListboxTop',[],'Max',[1],'Min',[0],'Position',[0.7868590,0.5151515,0.1858974,0.0909091],'Relief','default','SliderStep',[0.01,0.1],'String','Binary','Style','pushbutton','Value',[0],'VerticalAlignment','middle','Visible','on','Tag','pbBinary','Callback','pbBinary_callback(handles)')
handles.pbThresh=uicontrol(f,'unit','normalized','BackgroundColor',[-1,-1,-1],'Enable','on','FontAngle','normal','FontName','Tahoma','FontSize',[12],'FontUnits','points','FontWeight','normal','ForegroundColor',[-1,-1,-1],'HorizontalAlignment','left','ListboxTop',[],'Max',[1],'Min',[0],'Position',[0.7868590,0.3704545,0.1858974,0.0909091],'Relief','default','SliderStep',[0.01,0.1],'String','Threshold','Style','slider','Value',[0],'VerticalAlignment','middle','Visible','on','Tag','pbThresh','Callback','pbThresh_callback(handles)')
handles.Axes1= newaxes();handles.Axes1.margins = [ 0 0 0 0];handles.Axes1.axes_bounds = [0.0352564,0.0590909,0.7163462,0.8431818];handles.Axes1.auto_clear = 'on';
 
 
f.visible = "on";
 
 
//////////
// Callbacks are defined as below. Please do not delete the comments as it will be used in coming version
//////////
 
function pbLoad_callback(handles)
//Write your callback for  pbLoad  here
fn = uigetfile('*');
S = imread(fn);
imshow(S);
 
// Save image to pass to another function
handles.S = S;
handles = resume(handles);
 
endfunction
 
function pbGray_callback(handles)
//Write your callback for  pbGray  here
S2 = rgb2gray(handles.S);
imshow(S2);
 
// Save image to pass to another function
handles.S2 = S2;
handles = resume(handles);
 
endfunction
 
 
function pbBinary_callback(handles)
//Write your callback for  pbBinary  here
val = handles.pbThresh.value;
S3 = im2bw(handles.S2,val);
imshow(S3); 
 
endfunction
 
function pbThresh_callback(handles)
//Write your callback for  pbThresh  here
pbBinary_callback(handles);
 
endfunction

18 Commments

  1. Hello Teacher, i can not create two Axes for two the load picture button, Axes1 – Button1, Axes2 -Button2 , and 1 histogram in GUI. i use callback of button1 = Axes1 and callback of button2=Axes2 , but it no action in AXes1, it just display image in Axes2. i need to make the function histogram equalization in GUi. Gui will display two image processing before and after .

    Reply

    1. to plot on a certain axes, use “sca” function.

      for example, when you press button1 and want to plot on Axes1, add following line before plot or imshow.
      sca(handles.Axes1);

      similar case to other axes.

      Reply

  2. hello, teacher
    Teacher help me, i use bwborder function , i need to calculator the perimeter and area , can i use funtion for perimeter and area ?

    Reply

    1. Hi, bwlabel will just return you the border of an object, if you were to find the perimeter and area, you could try to perform a count on the number of pixels which are ‘1’ or ‘%t’.
      On the other hand, you could also looking into the function “imblobprop” for the object properties such as bounding box, area, and centroid of the objects. Example of using imblobprop could be found from the module documentation or this post. http://scilabipcv.tritytech.com/2017/03/21/morphological-operation-on-binary-image/

      Reply

    1. if your edge of the circle is 1 pixel thick, and there is only one object, you could use sum(img==%t) to count it. else you might need to use imlabel to label the objects first

      Reply

  4. Dear Author,

    A question please,
    I need to read a bunch of images from another file were not in my current working directory. Can you please share with me how to code the line?

    Regards,

    Reply

    1. Hi,
      I assume that you’re trying to load images from another folders, you can do the following:

      path = ‘C:\mypath\’;
      files = ls(path);

      for i = 1:size(files,1)
      S = imread(path+files(i));
      // do sth on S
      end

      hope this helps.

      CL

      Reply

      1. Hi Chin, thanks for the reply.

        1. I did run the code above, something wrong with this particular line:
        path = ‘C:\mypath\’;
        //then I change ‘ ‘ to ” “, it works… is any differences between this two
        will affect the type of variable?

        2. What is the meaning of this line:
        // do sth on S
        I mean what is the sth?

        3. Instead of reading the 1st image randomly on the addressed file,
        how can I read the images in a group of sequence and register
        that group of sequence in vector-matrix.

        let say I have 5 images inside the file.
        Those images are assigned as 1, 2, 3, 4, 5.
        The 1st group to read will be the assigned odd number, and the even is the second one.

        How can I code this?

        Reply

        1. 1. in Scilab 6, you could use both single quote or double quote in pairs, but not mixing them. The reason it does not work for your case likely due to you’ve copy and paste from the web explorer, which most of the time the character become none standard character. Look carefully at the shape of the quotation mark when you copy and paste and retype it.

          2. sth means something. I assume that after reading the image sequences in, you wanted to perform some analysis on them. so perform any image processing operation there.

          3. you could use the example I provided previously, command “ls” get the filename, and if your images are in sequence number, then you could sort the filename in string and it will be in sequence according to the for loop cnt. another way is to use the string concatenation. say your image named as “image001.jpg” , “image002.jpg”…., you could use the following method:
          for i = 1:5
          fn = “image00” + string(i) + “.jpg”;
          imread(fn);
          end

          hope this helps.

          CL

          Reply

  5. Hi , I’m trying to make a my own GUI but everytime I try to load an image it opens a new window and don’t show it in the “Axes”… It also does the same when I’m using the code above …

    Thank You .

    Reply

  6. Hi , Thanks for this amazing tutorial , I was wondering if there is a way to put different filter in a listbox and when a certain button is pushed it applies the filter so we dont have a button for each filter ?

    I tried using the list box by myself
    with : set(handles.filters, ‘string’, “filter1|filter2|filter3”);)
    but I couldnt figure out a way to detect wich filter was selected and apply it when a button is pressed …

    Reply

      1. So I’ve tried to do as you say

        function highpass_callback(handles) //ListBox callback

        set(handles.highpass, ‘string’, “item 1|item 2|item 3”);

        List_item = get(handles.highpass, ‘string’); //So here it should get all items but actually I only want to get the selected one in the gui but I dont know how to do that.

        if(List_item == “item 1|item 2|item 3”)//so here it should print the List_item since the condition is true but it doesnt .
        disp(List_item);
        end;

        I cant find any exemple on the internet of how to properly get the selected item of a listbox .

        Reply

Leave a Reply

Your email address will not be published. Required fields are marked *