GUI - Add ticks to slider bars and add hue color space to slider bars
15 views (last 30 days)
Show older comments
I am doing an image processing project for myself to seperate fruits from the background by using a range of the hue value and the saturation value. I have implemented four sliders - one for the lower limit and one for the upper limit for both hue and saturation. However, I want to add two things to these sliders, namely firstly add ticks to the sliderbars, so that it is more user-friendly. Moreover, I want to add behind the sliderbars for the hue, the hue color space. How can I implement these two things?
This is how it so far looks like:
![](https://www.mathworks.com/matlabcentral/answers/uploaded_files/890090/image.png)
Example of a slidebar with ticks:
![](https://www.mathworks.com/matlabcentral/answers/uploaded_files/890375/image.png)
Below the most important part of the code for the hue bars:
h=struct; %Create structure to put all handles and data in
h.hImage = hImage;
h.RGB_Image_Re = RGB_Image_Re;
h.f = figure(1);
set(gcf, 'Position',[450, 150, 800, 550]); %[450, 300, 800, 400])
h.ax = axes('Parent',h.f,'units','pixels','position',[120 290 290 215]);
h.h_im = imshow(h.RGB_Image_Re,'Parent',h.ax);
title(h.ax,'Initial color seperation: fruit');
h.ax2 = axes('Parent',h.f,'units','pixels','position',[450 290 290 215]);
h.h_im2 = imshow(h.RGB_Image_Re,'Parent',h.ax2);
title(h.ax2,'Initial color seperation: leaves, sky and logs');
%% Hue
%Initial values
Hue_min = 0;
Hue_max = 1;
%Slider for the lower limit of hue
h.min_Slider = uicontrol('Parent',h.f,'Style','slider', ... % Create user interface control
'Units','Pixels','Position',[221,260,419,23],...
'value', Hue_min, 'min',0, 'max',1,...
'Callback', @Slider);
% Label lower limit of slider
bl1 = uicontrol('Parent',h.f,'Style','text','Position',[190,255,23,23],...
'String','0');
bl2 = uicontrol('Parent',h.f,'Style','text','Position',[640,255,23,23],...
'String','1');
bl3 = uicontrol('Parent',h.f,'Style','text','Position',[340,225,100,23],...
'String','Lower limit hue:');
%Slider for the upper limit of hue
h.max_Slider = uicontrol('Parent',h.f,'Style','slider',... % Create user interface control
'Units','Pixels','Position',[221,195,419,23],...
'value', Hue_max, 'min',0, 'max',1,...
'Callback', @Slider);
% Label upper limit of slider
bu1 = uicontrol('Parent',h.f,'Style','text','Position',[190,195,23,23],...
'String','0');
bu2 = uicontrol('Parent',h.f,'Style','text','Position',[640,195,23,23],...
'String','1');
bu3 = uicontrol('Parent',h.f,'Style','text','Position',[340,165,100,23],...
'String','Upper limit hue:');
%% Callback
function Slider(hObj,~)
h = guidata(hObj);
Hue_min = round(h.min_Slider.Value,3);
Hue_max = round(h.max_Slider.Value,3);
Current_Hue_min = uicontrol('Style', 'text',...
'Parent', h.f, ...
'Position', [450,225,50,23], ...
'String', Hue_min);
Current_Hue_max = uicontrol('Style', 'text', ...
'Parent', h.f, ...
'Position', [450,165,50,23], ...
'String', Hue_max);
end
7 Comments
Adam Danz
on 1 Mar 2022
Edited: Adam Danz
on 1 Mar 2022
Well, you would need to redesign your app using the app designer framework (not necessarily using AppDesigner) within a uifigure to use the uislider.
Adding ticks to the uicontrol slider is a challange and would require centering an axes around the slider and then scaling the axis ticks so they center around the slider bar extents. I wouldn't waste time on that.
Instead, you could add a text box beside each slider that shows the slider's current value which would be updated by a slider callback function.
Adam Danz
on 1 Mar 2022
Here's a quick demo. The text box updates when the slider reaches a new value.
fig = figure();
uip = uipanel(fig, 'Units','Normalized',...
'Position', [0.15, 0.15, 0.7, 0.18]);
initialValue = 0.2;
uitxbox = uicontrol(uip,'Style','edit',...
'String', sprintf('%.2f',initialValue), ...
'Units','Normalized',...
'Position', [0.1, 0.3, 0.1, 0.4]);
uislide = uicontrol(uip, 'Style', 'Slider', ...
'Units','Normalized', ...
'Position', [0.3, 0.3, 0.6, 0.4], ...
'Min', 0, 'Max', 1, 'Value', initialValue, ...
'Callback', @(h,~)set(uitxbox, 'String', sprintf('%.2f',h.Value)));
![](https://www.mathworks.com/matlabcentral/answers/uploaded_files/910700/image.png)
Answers (1)
DGM
on 1 Mar 2022
Attached is a script that creates a GUI with three HSV sliders and a basic CBF template. The sliders have tick labels, but no tick marks. Above each slider is a dynamic gradient. Grab a slider and you'll see the new HSV tuple dumped to console as it's updated.
This is a bit of a kludge, but it should at least demonstrate that some things are possible with regular figure() GUIs and uicontrol() objects.
![](https://www.mathworks.com/matlabcentral/answers/uploaded_files/910810/image.png)
21 Comments
See Also
Categories
Find more on Interactive Control and Callbacks in Help Center and File Exchange
Community Treasure Hunt
Find the treasures in MATLAB Central and discover how the community can help you!
Start Hunting!