Pixelating a Bezier Path



  • Hello everyone, I'm struggling with a script to make fake hinting within the Bezier Path, my doubt resides in the incognita that if there's a method to join two points with a series of squares, something like adding a stroke with a pattern and replicate this to the fill of the shape, this way I can loop the effect through the whole characters of the typeface and make individual gifs with different square size.

    This is the code I've been working on:

    pageSize, inset = 1080, 100
    sz = 5
    
    def pixeling(sz):
        
        newPage(pageSize, pageSize)
    
        path = BezierPath()
        path.text('E', fontSize=300, font='Menlo')
    
        minx, miny, maxx, maxy = path.bounds()
        w = maxx - minx
        h = maxy - miny
    
        boxWidth = width() - inset * 2
        boxHeight = height() - inset * 2
    
        s = min([boxWidth / float(w), boxHeight / float(h)])
        translate(width()*.5, height()*.5)
        scale(s)
        translate(-minx, -miny)
        translate(-w*.5, -h*.5)
        letterPaths = path.points
        
        x = []
        y = []
        for i in range(len(letterPaths)):
            x.append(int(letterPaths[i][0]))
            y.append(int(letterPaths[i][1]))
            
        print(x, y)
    
        for i in range(len(x)):
            for j in range(len(y)):
                fill(0)
                rect(x[j], y[j], sz, sz)
                        
    pixeling(sz)
    
    #saveImage('~/Desktop/hint_{0}_px.png'.format(sz))
    

    Thank you very much for your help.


  • admin

    In the current release you can set antiAliasing as an option while saving the context to an image. Set it to True.

    see https://www.drawbot.com/content/canvas/saveImage.html#drawBot.saveImage

    hope this helps


  • admin

    an other option is to use path.expandStroke(10) so you can do point inside testing.

    see https://www.drawbot.com/content/shapes/bezierPath.html#drawBot.context.baseContext.BezierPath.expandStroke



  • @frederik said in Pixelating a Bezier Path:

    antiAliasing

    Thank you Frederik, it's working now, I'm having this message randomly *** DrawBot warning: Unrecognized saveImage() option found for PNGContext: antiAliasing *** but I don't know why because the exported image is good. Could it be because of the font? for example, Menlo doesn't make it but a test font do it.

    x, y = 500, 500
    resolutions = [72, 18]
    mfont = 'Menlo'
    font(mfont)
    print(listFontGlyphNames())
    
    letters = ['a', 'A']
    
    def pixelar(tx, t, al=True):
        
        newPage(x, y)
        
        path = BezierPath()
        path.text(tx, fontSize=500, font=mfont)
    
        coords = path.bounds()
        
        translate((x - (coords[0] + coords[2])) * 0.5, (y - (coords[1] + coords[3])) * 0.5)
        drawPath(path)
        
        saveImage('~/Desktop/hint_{0}_{1}_aal_{2}.png'.format(tx, t, str(al).lower()), imageResolution=int(t), antiAliasing = bool(al))
        newDrawing()
    
    
    for letter in letters:
        for resolution in resolutions:
            pixelar(letter, resolution, False)                   
            pixelar(letter, resolution)
    

  • admin



  • @frederik thank you 😊

    It worked great now:

    x, y = 500, 500
    resolutions = [72, 18]
    
    mfont = '/Library/Application Support/Adobe/Fonts/SansNom-Regular.otf'
    
    installFont(mfont)
    font(mfont)
    print(listFontGlyphNames())
    
    letters = ['n', 'E']
    
    def pixelar(tx, t, al=True):
        
        newPage(x, y)
        
        path = BezierPath()
        path.text(tx, fontSize=500, font=mfont)
    
        coords = path.bounds()
        
        translate((x - (coords[0] + coords[2])) * 0.5, (y - (coords[1] + coords[3])) * 0.5)
        drawPath(path)
        
        saveImage('~/Desktop/hint_{0}_{1}_aal_{2}.png'.format(tx, t, str(al).lower()), imageResolution=int(t), antiAliasing = al)
        newDrawing()
    
    
    for letter in letters:
        for resolution in resolutions:
            pixelar(letter, resolution, False)                   
            pixelar(letter, resolution)
    

Log in to reply