Question

I have written a matlab project that takes a video as an input, cuts it into frames, and shows the frames to the user one by one, giving him the ability to make changes to each frame.

I want to add a “side bar”, that shows a particular frame to the user, as well as buttons for GUI frames from 1 to 10, when he can press on “->” or “<-” to move to prev\next 10 frames, and can click on a frame to show it in a larger size.

Something like this:

   This is the GUI:

.__________________________________.
|                                  | 
|          Frame No. i             | 
|                                  | 
|--------------------------------- | 
|<-| Frame j|j+1|.....|Frame j+9|->| 
|__________________________________|

I thought about using “subplot” but didn’t know how to add the ability to show\update prev\next frames on clicking.

Another implementation is something like this:

% The Main Image:
   hAx = axes('Position',[0 0.3 1 0.8], 'Parent',hFig);
   hMainImg = imshow(img, 'Parent',hAx);

% the slider
hPanel = uipanel('Position',[0 0.04 1 0.26], 'Parent',hFig);
uicontrol('Style','slider', 'Parent',hFig, ...
    'Callback',@slider_callback, ...
    'Units','normalized', 'Position',[0 0 1 0.04], ...
    'Value',1, 'Min',1, 'Max',mx, 'SliderStep',[1 10]./mx);

But then, what about the slider?

Any ideas how can I implement this?

Answer 1

Here is a working example. We open a small video file, and reads all its 141 frames. You can browse through them using the slider, click any small image to display it in the main axis.

function framesBrowserDemo()
    %# read all frames at once
    vid = VideoReader('xylophone.mpg');
    numImgs = get(vid, 'NumberOfFrames');
    frames = read(vid);
    clear vid

    %# design GUI
    numThumbs = 5;
    mx = numImgs-numThumbs+1;
    hFig = figure('Menubar','none');
    hPanel = uipanel('Position',[0 0.04 1 0.16], 'Parent',hFig);
    uicontrol('Style','slider', 'Parent',hFig, ...
        'Callback',@slider_callback, ...
        'Units','normalized', 'Position',[0 0 1 0.04], ...
        'Value',1, 'Min',1, 'Max',mx, 'SliderStep',[1 10]./mx);

    %# main axis, and show first frame
    hAx = axes('Position',[0 0.2 1 0.8], 'Parent',hFig);
    hMainImg = imshow(frames(:,:,:,1), 'Parent',hAx);

    %# thumbnail axes
    hThumImg = zeros(numThumbs,1);
    for i=1:numThumbs
        %# create axis, show frame, hookup click callback
        hAx = axes('Parent',hPanel, ...
            'Position',[(i-1)/numThumbs 0 1/numThumbs 1]);
        hThumImg(i) = imshow(frames(:,:,:,i), 'Parent',hAx);
        set(hThumImg(i), 'ButtonDownFcn',@click_callback)
        axis(hAx, 'normal')
    end

    %# callback functions
    function slider_callback(src,~)
        val = round(get(src,'Value'));  %# starting index
        %# update the thumbnails
        for k=1:numel(hThumImg)
            set(hThumImg(k), 'CData',frames(:,:,:,k+val-1))
            drawnow
        end
    end

    function click_callback(src,~)
        %# update the main image
        set(hMainImg, 'CData',get(src,'CData'));
        drawnow
    end
end