Thilina's Blog

I might be wrong, but…

MATLAB GUI programming (code level) 1.0 – Paint Effect for Images

When surfing in facebook I saw a lot of profile pictures which is modified as painted images. Rather than using the facebook apps I thought to write my own program to do it for me. In this article I’ll try to share my experience on GUI programming in MATLAB without MATLAB GUI guide and the construction of the paint brush effect code.

When studying the image with paint brush effect I noticed that the image colour levels are now limited to a low number, which is most likely a one colour intensity to represent a set of colour. By keeping this in mind I coded a small test program as below.

clc, clear all, close all;
im = imread('image_3.jpg');
rateR = 40;
rateG = 60;
rateB = 50;
ima(:,:,1) = cast(rateR*round(im(:,:,1)/rateR),'uint8');
ima(:,:,2) = cast(rateG*round(im(:,:,2)/rateG),'uint8');
ima(:,:,3) = cast(rateB*round(im(:,:,3)/rateB),'uint8');
imshow(ima);
imhisto(:,1) = imhist(ima(:,:,1));
imhisto(:,2) = imhist(ima(:,:,2));
imhisto(:,3) = imhist(ima(:,:,3));
figure, plot(imhisto);

Hopefully it got worked, what I have done is,

rateR*round(im(:,:,1)/rateR)

I defined a colour level factor, in here it was 40 intensity level and I divided the image intensity by my factor and rounded it, now I got a number which will represent 40 intensity levels. Then I normalised the number back to 255 since I use the uint8 as my image data type. I did this to all 3 colour matrices, but then I noted that If this colour quantization done in different levels for RGB it gives much better results. So I used the separate rates for quantising the colour of the image. The original and results are as in below.

clip_image002 clip_image004

GUI Programming

In MATLAB GUI programming we built our gui over a MATLAB figure, You can initialise a MATLAB figure as follows,

background = figure('Name','Paint Effect','Units','normalized',...
'Position',[0.05 0.1 .9 .8]);

The property name is to which we need to display on the top of the figure. The variable background supports us to handle the object we created. There are number of UI controls in MATLAB, which you can study about them by typing ‘doc uicontrol’on MATLAB command prompt.

mainPan = uipanel('Title','Chroma Key','FontSize',12,'Position',[0.005 0.005 .99 .99]);

MATALAB uipanel helps us to group a set of controls, axes etc on MATLAB, as the parent for these controls. Below is an initialization of MATLAB uislider;

r_t = uicontrol('style','slider','Parent',panR,...
'Units','normalized','Position',[.15 .01 .7 .98],...
'SliderStep',[1/255 1/255],'Value',1,'min',0,'max',255,...
'callback','uiControl');

The word followed the ‘callback’ (uiControl in here) is responsible for the even when we deal with the respective UI. Another two important commands in dealing with MATLAB gui is get and set commands, which allows as to retrieve a property of an object and to assign a property to MATLAB objects. Sample codes for these two are as below.

red = get (r_t,'Value');
set(rDisp,'String',num2str(red));

In here we retrieve the value of uicontrol named r_t to red vatiable and assign this value to uicontrol rDisp as its String value. And another most important GUI component on MATLAB gui designing is ‘uiputfile’ and ‘uigetfile’. These in-builds allow us to select a file as same as the windows explorer or other file selectors does and it returns the file name as a string. Finally to plot or show some thing in MATLAB uipanel we use subplot command, as below. In here the bg is the name of its parent panel.

subplot(1,1,1,'Parent',bg);
imshow(im);

Sample code for my paint-effect project is as below. The file names must be the names given in the comments on top.

GUI file

% paint_effect_gui
% Builds the GUI of the project
% Calls the functions when needed
% Thilina S. Ambagahawaththa
clear all;
close all;
clc;
%% UI
background = figure('Name','Paint Effect','Units','normalized',...
'Position',[0.05 0.1 .9 .8]);
mainPan = uipanel('Title','Chroma Key','FontSize',12,...
'Position',[0.005 0.005 .99 .99]);
bg = uipanel('Title','Input Image','FontSize',12,'Parent',mainPan,...
'Position',[.1 .75 .2 .25]);
fg = uipanel('Title','Histogram','FontSize',12,'Parent',mainPan,...
'Position',[.1 .5 .2 .25]);
ck = uipanel('Title','Painted Image','FontSize',12,'Parent',mainPan,...
'Position',[.32 .25 .5 .75]);
ckl = uipanel('Title','Colour Region','FontSize',12,'Parent',mainPan,...
'Position',[.83 .21 .14 .1]);
%% %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
panR = uipanel('Parent',mainPan,'Title','R',...
'Position',[.83 .3 .025 .7]);
rDisp = uicontrol('style','text','Parent',mainPan,'String','128',...
'Units','normalized','Position',[.8315 .25 .04 .02]);
r_t = uicontrol('style','slider','Parent',panR,...
'Units','normalized','Position',[.15 .01 .7 .98],...
'SliderStep',[1/255 1/255],'Value',1,'min',0,'max',255,...
'callback','uiControl');
%--------------------------------------------------------------------------
panG = uipanel('Parent',mainPan,'Title','G',...
'Position',[.88 .3 .025 .7]);
gDisp = uicontrol('style','text','Parent',mainPan,'String','128',...
'Units','normalized','Position',[.8815 .25 .04 .02]);
g_t = uicontrol('style','slider','Parent',panG,...
'Units','normalized','Position',[.15 .01 .7 .98],...
'SliderStep',[1/255 1/255],'Value',1,'min',0,'max',255,...
'callback','uiControl');
%--------------------------------------------------------------------------
panB = uipanel('Parent',mainPan,'Title','B',...
'Position',[.93 .3 .025 .7]);
bDisp = uicontrol('style','text','Parent',mainPan,'String','128',...
'Units','normalized','Position',[.9315 .25 .04 .02]);
b_t = uicontrol('style','slider','Parent',panB,...
'Units','normalized','Position',[.15 .01 .7 .98],...
'SliderStep',[1/255 1/255],'Value',1,'min',0,'max',255,...
'callback','uiControl');
%% %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%%Button Controls
uicontrol('Parent',mainPan,'Units','normalized',...
'Style', 'pushbutton', 'String', 'Save Image',...
'Position', [.21 .43 .1 .045], 'Callback', 'setIm');
uicontrol('Parent',mainPan,'Units','normalized',...
'Style', 'pushbutton', 'String', 'Load Image',...
'Position', [.1 .43 .1 .045], 'Callback', 'getIm');

File reader

% getIm.m
% Thilina S. Ambagahawaththa
clear im,
clear ima;
[name path] = uigetfile({'*.jpg;*.tif;*.png;*.gif','All Image Files';...
'*.*','All Files' },'Open Image',...
'D:\Pictures');
file_name = [path name];
loadedFG = 0;
try
    im = imread(file_name);
    subplot(1,1,1,'Parent',bg);
    imshow(im);
    subplot(1,1,1,'Parent',ck);
    imshow(im);
    imhisto(:,3) = log(imhist(im(:,:,1)));
    imhisto(:,2) = log(imhist(im(:,:,2)));
    imhisto(:,1) = log(imhist(im(:,:,3)));
    subplot(1,1,1,'Parent',fg);
    stem(imhisto);
    xlim([0 255]);
catch exception
    if loadedFG == 0
        noImageMsg = msgbox('No Images Loaded..!!');
    end
end;

File writer

% setIm.m
% Thilina S. Ambagahawaththa
[name path] = uiputfile({'*.jpg;*.tif;*.png;*.gif','All Image Files';...
'*.*','All Files' },'Open Image',...
'D:\Pictures');
file_name = [path name];
loadedFG = 0;
try
    imwrite(ima,[file_name '.jpg']);
catch exception
    if loadedFG == 0
        noImageMsg = msgbox('No Images to save..!!');
    end
end;

Interface Controller

% uiControl.m
% Thilina S. Ambagahawaththa
red = get (r_t,'Value');
set(rDisp,'String',num2str(red));
green = get (g_t,'Value');
set(gDisp,'String',num2str(green));
blue = get (b_t,'Value');
set(bDisp,'String',num2str(blue));
try
    ima(:,:,1) = cast(red*round(im(:,:,1)/red),'uint8');
    ima(:,:,2) = cast(green*round(im(:,:,2)/green),'uint8');
    ima(:,:,3) = cast(blue*round(im(:,:,3)/blue),'uint8');
    subplot(1,1,1,'Parent',ck);
    imshow(ima);
    imhisto(:,3) = log(imhist(ima(:,:,1)));
    imhisto(:,2) = log(imhist(ima(:,:,2)));
    imhisto(:,1) = log(imhist(ima(:,:,3)));
    subplot(1,1,1,'Parent',fg);
    stem(imhisto);
    xlim([0 255]);
catch e

end

This is another result I obtained from above program, The location is around Madakumbura, Pundaluoya, Sri Lanka.

Original Image

clip_image005

Paint Effect Added
clip_image006
GUI design

image

Thank you for Reading…

2011 January 25 - Posted by | Image Processing, MATLAB

7 Comments »

  1. Nice post.

    If you can write a post how to embed Mathlab function to another Language like C sharp or Java.
    Because in real life it will be really helpful for Developers.
    Keep it up good works

    Comment by ක්ෂිතිජ විජේමාන්න | විත්ති | 2011 January 25 | Reply

    • Hi,
      I tried to call MATLAB functions from C-sharp, using MLApp.dll, I’ll try to write a complete post on it very soon.
      Thank you for the comment..!!

      Comment by Thilina S. | 2011 January 25 | Reply

  2. hi…
    it’s really nice
    it’s really simple, so i can understand, cause English is not my mother tongue
    does it work for black and white pictures?
    thank you for your kindness

    cheers
    hubbul walidainy

    Comment by hubbul | 2011 February 7 | Reply

  3. Perfect job! Keep up the good work🙂

    Comment by Umur Ozhan SENGUL | 2011 February 7 | Reply

  4. Hi, this article is really nice.
    I am a blogger. I did a paint application using flood fill algorithm. Can you share your ideas upon that article.
    Reference:http://angeljohnsy.blogspot.com/2011/05/paint-application-in-matlab.html

    Comment by Aaron angel | 2011 May 18 | Reply

    • Hi,
      Thank you very much for the comment and for the link to your article.🙂

      Comment by Thilina S. | 2011 May 18 | Reply

  5. hey i need help i wan to create a separate button function which can change the form of the “image” which is previous loaded under another button function using matlab gui exa: into binary form or gray image but when i input the rgb2gray function under the button command it wont work

    Comment by hb | 2011 July 20 | Reply


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: