customise colour for RegionZoomInteraction

Suppose I have the following zoom Interactions implemented on an Axes component (app.UIAxes) in the App Designer. Matlab's regionZoomInteraction implement a drag-and-draw box on the UIAxes to zoom into a certain region (see attachment). Is there any chance the colour of the box used in RegionZoomInteraction on any UIAxes may be changed from the default blue to some customisable colour?

app.UIAxes.Interactions = [regionZoomInteraction zoomInteraction];
enableDefaultInteractivity(app.UIAxes);

[Mann Baidi]

Hi

Can you please share a image of the box in RegionZoomInteraction or elaborate more how to display the box?

[Dee Chan]

I have added some elaboration and attached an image of the box before zoom. It's merely a matlab feature.

Answer 1

[Githin George]

Hello,

It is my understanding that you would like to change the color of the rectangles drawn during the Zoom events specified by ‘Interactions’ property of the UIAxes. Unfortunately, there does not seem to be any options for Axes object that can directly change the color of the drawn rectangle or any mention of the same in MATLAB documentation.

As a workaround, you could use the 3 callback functions of UIFigure, namely “WindowButtonDownFcn”, “WindowButtonMotionFcn” and “WindowButtonUpFcn” in combination to recreate the behaviour of ‘regionZoomInteraction’ while specifying the ‘color’ property in a ‘rectangle’ object. I’ve attached an example implementation of the callbacks below.

properties (Access = public)
    rectangle           matlab.graphics.primitive.Rectangle
    isDrawing           logical % Description
end

% Callbacks that handle component events
methods (Access = private)

    % Window button down function: UIFigure
    function UIFigureWindowButtonDown(app, event)
    % Get the current mouse position
    currentPoint = app.UIAxes.CurrentPoint;
    startX = currentPoint(1,1);
    startY = currentPoint(1,2);
    
    % Create a rectangle object with color red
    app.rectangle = rectangle(app.UIAxes, 'Position', [startX, startY, 0, 0],'EdgeColor','r');
    app.isDrawing = true;
    end

    % Window button motion function: UIFigure
    function UIFigureWindowButtonMotion(app, event)
        if app.isDrawing
            % Get the current mouse position
            currentPoint = app.UIAxes.CurrentPoint;
            currentX = currentPoint(1,1);
            currentY = currentPoint(1,2);
            
            % Calculate the width and height of the rectangle
            width = currentX - app.rectangle.Position(1);
            height = currentY - app.rectangle.Position(2);
            
            % Update the rectangle position
            app.rectangle.Position(3) = width;
            app.rectangle.Position(4) = height;
        end
    end

    % Window button up function: UIFigure
    function UIFigureWindowButtonUp(app, event)
    app.isDrawing = false;
    app.UIAxes.XLim = [app.rectangle.Position(1) app.rectangle.Position(1)+app.rectangle.Position(3)];
    app.UIAxes.YLim = [app.rectangle.Position(2) app.rectangle.Position(2)+app.rectangle.Position(4)];
    delete(app.rectangle)
    end
end

I’ve attached a documentation link for the ‘rectangle’ function used to draw and change color of the box. https://www.mathworks.com/help/matlab/ref/rectangle.html

Please note that the above code covers only the case where you draw a rectangle from bottom-left corner to top-right corner.

I hope this helps.