Adding text to CurrentGlyphView



  • Hi @frederik, could you elaborate on how to use CurrentGlyphWindow().addGlyphEditorSubview(yourVanillaView)?

    I'm trying to set some text in the glyph view:

    0_1543196654159_Screen Shot 2018-11-25 at 8.43.39 PM.png

    For the image above, I used the snippet I found in the Show Coordinates extension.

    Thanks!


  • admin

    here’s an example of addGlyphEditorSubview:

    (I got it from @frederik some time ago, made a few small changes only)

    0_1543224269517_Screen Shot 2018-11-26 at 07.22.30.png

    from vanilla import *
    import mojo.drawingTools as ctx
    from mojo.events import addObserver, removeObserver
    from mojo.canvas import CanvasGroup
    from mojo.UI import CurrentGlyphWindow
    
    class OverlayViewController(object):
        
        def __init__(self):
            ### for debugging only
            self.w = FloatingWindow((150, 50), "debug only")
            self.w.bind("close", self.windowClose)
            self.w.open()
            ### end debugging
            self.view = None
            addObserver(self, "observerGlyphWindowWillOpen", "glyphWindowWillOpen")
            addObserver(self, "observerDraw", "draw")
            addObserver(self, "observerDrawPreview", "drawPreview")
            
        def windowClose(self, sender):
            removeObserver(self, "glyphWindowWillOpen")
            removeObserver(self, "draw")
            removeObserver(self, "drawPreview")
        
        def observerGlyphWindowWillOpen(self, notification):
            self.window = notification["window"]
            # create a view with some controls
            self.view = CanvasGroup((0, -200, -0, -0), delegate=self)
            self.view.button1 = Button((-130, -40, 120, 22), "Hit Me")
            self.view.button2 = Button((-260, -40, 120, 22), "Show Controls")
            self.view.button2.getNSButton().setShowsBorderOnlyWhileMouseInside_(True)
            self.view.list = List((-260, 10, -10, -50), ["a", "b", "c", "Do SomeThing"]) 
            # add the view to the GlyphEditor
            self.window.addGlyphEditorSubview(self.view)
                
        def observerDraw(self, notification):
            if self.view:
                self.view.show(True)
            
        def observerDrawPreview(self, notification):
            # hide the view in Preview mode
            if self.view:
                self.view.show(False)
    
        # canvas delegate callbacks
        
        def opaque(self):
            return True
        
        def acceptsFirstResponder(self):
            return False
        
        def acceptsMouseMoved(self):
            return True
            
        def becomeFirstResponder(self):
            return False
        
        def resignFirstResponder(self):
            return False
            
        def shouldDrawBackground(self):
            return False
        
        def draw(self):
            g = self.window.getGlyph()
            if g is None:
                return
    
            f = g.getParent()
            x, y, w, h = self.window.getVisibleRect()        
            h = self.view.height() - y
            
            # draw a rect around the view area
            ctx.fill(None)        
            ctx.stroke(0, 1, 0)
            ctx.rect(x+5, y+5, w-10, h-10)
            ctx.stroke(None)
            
            # draw some preview glyphs
            testGlyphs = ["n", "o"]
            glyphs = []
            for c in testGlyphs:
                if c in f:
                    glyphs.append(f[c])
            glyphs.append(g)
    
            ctx.scale(0.15)
            ctx.translate(50, 150)        
            ctx.fill(0)
            for glyph in glyphs:
                ctx.drawGlyph(glyph)
                ctx.translate(glyph.width, 0)
            
    
    OverlayViewController()
    

    will be added to the docs soon…



  • @gferreira @frederik That was really helpful, thank you!

    If I'm understanding this right, CanvasGroup is a thin layer on top of the glyph view, and we can add whatever vanilla elements to that CanvasGroup?

    Will play around with this. I'm not sure I understand what all of these delegate callbacks do just yet, since sometimes they're not immediately obvious:

    • opaque() — does this need to be specified if shouldDrawBackground() already returns False?

    • acceptsMouseMoved()

    • becomeFirstResponder() & resignFirstResponder() — do these have to be specified if acceptsFirstResponder() already returns False?

    0_1543233080466_Screen Shot 2018-11-26 at 6.50.00 AM.png


  • admin

    It should not be a CanvasGroup, it could also be a vanilla.Group. In this example it shows how to draw something on top of a glyph view disconnected from the zoom level.

    The delegate callbacks are related to a CanvasGroup see more info http://robofont.com/documentation/building-tools/api/mojo/mojo-canvas/#mojo.canvas.CanvasGroup


  • admin

    and if you want to remove the view from the glyph editor: glyphWindow.removeGlyphEditorSubview(view)



  • This post is deleted!


  • Ok, seems that I can just use vanilla.Group to set text, since I don't need to draw anything.

    (I asked earlier about disconnecting from the zoom level, but I assume that's what magnifyWithEvent() is for?)

    Also, will more documentation be added to the page that lists possible delegate methods?

    And one more thing... this is a bit of a side question, but would you ever use a separate object as a delegate?

    from vanilla import *
    from mojo.events import addObserver, removeObserver
    from mojo.canvas import CanvasGroup
    
    class OverlayViewController(object):
        def __init__(self):
            addObserver(self, "observerGlyphWindowWillOpen", "glyphWindowWillOpen")
            addObserver(self, "observerGlyphWindowWillClose", "glyphWindowWillClose")
    
        def observerGlyphWindowWillOpen(self, notification):
            self.window = notification["window"]
            
            delegateObj = DelegateObj()
            self.view = CanvasGroup((0, -200, -0, -0), delegate=delegateObj)
            self.view.button1 = Button((-130, -40, 120, 22), "Hit Me")
    
            self.view.show(True)
            self.window.addGlyphEditorSubview(self.view)
                
        def observerGlyphWindowWillClose(self, notification):
            self.window.removeGlyphEditorSubview(self.view)
            removeObserver(self, "glyphWindowWillOpen")
            removeObserver(self, "glyphWindowWillClose")
    
    class DelegateObj:
        def acceptsFirstResponder(self):
            return False
            
        def shouldDrawBackground(self):
            return False
        
        def draw(self):
            print('eh')
            
    OverlayViewController()
    

  • admin

    Each view added with window.addGlyphEditorSubview will be detached from zoom level or panning. The other option is to draw inside the glyph canvas in glyph coordinate space.

    magnifyWithEvent is an event that is called in a Canvas delegate whenever there is a pinch on a trackpad for example.


Log in to reply
 

Looks like your connection to RoboFont ● Forum was lost, please wait while we try to reconnect.