Unexpected Margin/Padding on AddCustomGui



  • Hi,

    My custom gui button has a width and height of 100 (i.e. should be square). The images are also in 100x100 dimension. But as you can see there are unwanted margin making it a portrait.

    You can see the problem here:
    https://www.dropbox.com/s/zo198h5b34igh3o/c4d191_unexpected_margin_on_custom_gui_button.jpg?dl=0

    This is the code with the AddCustomGui:

            sample_bmp   = c4d.bitmaps.BaseBitmap()
            sample_bmp.InitWith(sample_img)
    
            bcBitmapButton = c4d.BaseContainer()
            bcBitmapButton[c4d.BITMAPBUTTON_BUTTON] = True
    
            buttonId = 2000
            w = 100
            h = 100
    
            self.GroupBegin(id=9001, flags=c4d.BFH_SCALEFIT, groupflags = c4d.BFV_GRIDGROUP_EQUALCOLS | c4d.BFV_GRIDGROUP_EQUALROWS, cols=4, rows=4,initw=0, inith=0)
    
            for image in images: # iterates for every image in the image folder
                image_bmp = c4d.bitmaps.BaseBitmap()
                image_copy = os.path.join(image_path, image)
                image_bmp.InitWith(image_copy)
                # bitmapButton = self.AddCustomGui(buttonId, c4d.CUSTOMGUI_BITMAPBUTTON, "", c4d.BFH_CENTER|c4d.BFV_CENTER, w, h, bcBitmapButton)
                bitmapButton = self.AddCustomGui(buttonId, c4d.CUSTOMGUI_BITMAPBUTTON, "", c4d.BFH_FIT|c4d.BFV_TOP, w, h, bcBitmapButton)
                bitmapButton.SetImage(image_bmp, True)
    
            self.GroupEnd()
    
    

    Thank you for looking at my problem



  • Hi @bentraje

    CustomBitmapButton take by default the size of the icon and ignore the passed width/height. If you want to force the CustomBitmapButton you have to use BITMAPBUTTON_FORCE_SIZE with an Int32 value that represents the size of the icon.

    Since it "ignore" the passed width/height you may also consider to use something else than BFH_FIT in a BFH_SCALEFIT group.

    Cheers,
    Maxime.



  • @m_adam

    Thanks for the response.

    I added a line with
    bcBitmapButton[c4d.BITMAPBUTTON_FORCE_SIZE] = 100.00
    and revised a line to
    bitmapButton = self.AddCustomGui(buttonId, c4d.CUSTOMGUI_BITMAPBUTTON, "", c4d.BFV_CENTER | c4d.BFV_CENTER , w, h,

    However, it still gives an unwanted margin/padding but this time at the bottom.
    You can see the problem here:
    https://www.dropbox.com/s/i6eb8ccszzc35ov/c4d191_unexpected_margin_on_custom_gui_button_02.jpg?dl=0



  • Hi @bentraje

    Could you try to use

            w = c4d.gui.SizePix(100)
            h = c4d.gui.SizePix(100)
    

    For more information see GUI Layout Issues.

    If not could you try to zip bmp + a complete working script?

    Thanks in advance,
    Cheers,
    Maxime.



  • Thanks for the response.
    Almost close now. is there a way to totally remove the border space within the custom gui buttons?

    You can check it here:
    https://www.dropbox.com/s/vs31t2flu51gnej/c4d191_unexpected_margin_on_custom_gui_button_03.jpg?dl=0

    I tried the self.GroupSpace(0, 0) but it has no effect.
    I also tried self.GroupBorderSpace(0, 0, 0, 0) but the whole button disappeared.

    Are there any other settings for spaces?



  • Here is working correctly, please share your code.

        def CreateLayout(self):
            self.GroupBegin(10002, c4d.BFH_SCALE| c4d.BFV_SCALE,  initw=50, inith=50)
            
            bcBitmapButton = c4d.BaseContainer()
            bcBitmapButton[c4d.BITMAPBUTTON_BUTTON] = True
            bcBitmapButton[c4d.BITMAPBUTTON_ICONID1] = c4d.Ocube
            bcBitmapButton[c4d.BITMAPBUTTON_BORDER] = c4d.BORDER_IN
    
            buttonId = 2000
            w = c4d.gui.SizePix(100)
            h = c4d.gui.SizePix(100)
    
            self.GroupBegin(id=9001, flags=c4d.BFH_SCALEFIT, groupflags = c4d.BFV_GRIDGROUP_EQUALCOLS | c4d.BFV_GRIDGROUP_EQUALROWS, cols=4, rows=4,initw=0, inith=0)
            self.GroupSpace(0, 0)
            for imageId in xrange(10):
                bitmapButton = self.AddCustomGui(imageId, c4d.CUSTOMGUI_BITMAPBUTTON, "", c4d.BFH_FIT|c4d.BFV_TOP, w, h, bcBitmapButton)
    
            self.GroupEnd()
            
            
            self.GroupEnd()
            return True
    

    Cheers,
    Maxime.



  • @m_adam

    There's actually still space between buttons on your code.
    Anyhow here is my working code for your reference. It's in archive file since it includes the images
    https://www.dropbox.com/s/leb10klpvm4o8ps/c4d191_unexpected_margin_on_custom_gui_button.rar?dl=0



  • Hi @bentraje
    thanks for the archive.

    Here my code in R21.115
    spacing_perso.jpg

    In your code you call self.GroupSpace(0, 0) before the GroupBegin it has to be called just after the creation.

            self.GroupBegin(id=9001, flags=c4d.BFH_SCALEFIT, groupflags = c4d.BFV_GRIDGROUP_EQUALCOLS | c4d.BFV_GRIDGROUP_EQUALROWS, cols=4, rows=4,initw=0, inith=0)
            self.GroupSpace(0, 0)
    

    Which give me the next result
    spacing_bentraje.jpg

    Cheers,
    Maxime.



  • Oh I see. Thanks for pointing that out.

    Thanks!



  • @m_adam

    Sorry for reviving the thread but I just hit a snag on using the same code but for colored buttons. It doesn't respect the settings and gives an unnecessary margin even though I used the c4d.gui.SizePix() code.

    You can see the problem here:
    https://www.dropbox.com/s/17yqc1i0puoau77/c4d191_unexpected_margin_on_custom_gui_button_04.jpg?dl=0

    You can see the working code here:

    import c4d
    from c4d import bitmaps, documents, gui, plugins, threading, utils
    
    class ColorButton(object):
    
        def __init__(self):
            self.width = None
            self.height = None
            self.color = None
            self.btn_id = 3000
    
    
        def create(self, dlg, w, h, color, btn_id):
    
            self.width = c4d.gui.SizePix(w)
            self.height = c4d.gui.SizePix(h)
            self.color = color
    
            bmp_color = c4d.bitmaps.BaseBitmap()
            bmp_color.Init(w, h)
    
            for y in xrange(w):
                for x in xrange(h):
                    bmp_color.SetPixel(x, y, color[0], color[1], color[2])
    
            bcBitmapButton = c4d.BaseContainer()
            bcBitmapButton[c4d.BITMAPBUTTON_BUTTON] = True
            bcBitmapButton[c4d.BITMAPBUTTON_BORDER] = c4d.BORDER_IN
            
    
    
            bmp_btn = dlg.AddCustomGui(btn_id, c4d.CUSTOMGUI_BITMAPBUTTON, "",c4d.BFH_FIT|c4d.BFV_TOP, w, h, bcBitmapButton)
    
            bmp_btn.SetImage(bmp_color, True)
            
    class MyDialog(c4d.gui.GeDialog):
    
        def CreateLayout(self):
            self.GroupBegin(10002, c4d.BFH_SCALE| c4d.BFV_SCALE,  initw=50, inith=50)
            
            bcBitmapButton = c4d.BaseContainer()
            bcBitmapButton[c4d.BITMAPBUTTON_BUTTON] = True
            bcBitmapButton[c4d.BITMAPBUTTON_ICONID1] = c4d.Ocube
            bcBitmapButton[c4d.BITMAPBUTTON_BORDER] = c4d.BORDER_IN
    
            buttonId = 2000
            w = c4d.gui.SizePix(100)
            h = c4d.gui.SizePix(100)
    
            self.GroupBegin(id=9001, flags=c4d.BFH_SCALEFIT, groupflags = c4d.BFV_GRIDGROUP_EQUALCOLS | c4d.BFV_GRIDGROUP_EQUALROWS, cols=4, rows=4,initw=0, inith=0)
    
            self.GroupSpace(0, 0)
            for imageId in xrange(10):
                bitmapButton = self.AddCustomGui(imageId, c4d.CUSTOMGUI_BITMAPBUTTON, "", c4d.BFH_FIT|c4d.BFV_TOP, w, h, bcBitmapButton)
            # Red Button Through Class
            red_button = ColorButton()
            red_button.create(self, w=100,h=100,color=(255,0,0), btn_id=6000)
    
            self.GroupEnd()
            
            
            self.GroupEnd()
            return True
        
    if __name__ == "__main__":
        dlg = MyDialog()
        dlg.Open(dlgtype=c4d.DLG_TYPE_ASYNC)
    


  • @bentraje said in Unexpected Margin/Padding on AddCustomGui:

    Sorry for reviving the thread but I just hit a snag on using the same code but for colored buttons. It doesn't respect the settings and gives an unnecessary margin even though I used the c4d.gui.SizePix() code.

        def create(self, dlg, w, h, color, btn_id):
            bmp_btn = dlg.AddCustomGui(btn_id, c4d.CUSTOMGUI_BITMAPBUTTON, "",c4d.BFH_FIT|c4d.BFV_TOP, w, h, bcBitmapButton)
    
            
    class MyDialog(c4d.gui.GeDialog):
    
        def CreateLayout(self):
            red_button = ColorButton()
            red_button.create(self, w=100,h=100,color=(255,0,0), btn_id=6000)
            return True
    

    You don't use c4d.gui.SizePix() in your code and that's why it fails.

    Cheers,
    Maxime.



  • You are right.

    self.width = c4d.gui.SizePix(w)
    self.height = c4d.gui.SizePix(h)
    self.color = color
    

    wasn't actually used.

    Will close this thread now and crawl to my little cave of shame. lol


Log in to reply