[Lab] Fixed GridOverLay Class
Phuket2 last edited by
Been a bit slow here sharing etc... so I will,stand in front of the firing squad 😬😱
I have shared something like this before. Its just a view that you can add to another view that shows a fixed grid based on number of rows and columns. What I have done below is very simplistic.
My bigger idea is if based on a grid you could position and size your ui Elements. Not one grid, but a grid description with spreadsheet style references. Maybe I am not describing it so well.
But the same idea could work equally as well in the ui Designer. Rather than move things around by points, apply a grid, then when adding an ui element just select contiguous cell range to set it's size and position. Then apply another grid to add other elements the same way. It's not about layering. It's just about being able to assign a grid reference/range to a object based on a given grid definition.
Hmmm, I can see it in my head, but struggling to articulate it.
Anyway, the simplistic Lab code below. 95% is just base code.
# Pythonista Forum - @Phuket2 import ui, editor class FixedGridOverlay(ui.View): def __init__(self, parent, rows=1, cols=1, draw=False, *args, **kwargs): super().__init__(*args, **kwargs) self.draw_grid = draw self.rows = rows if rows else 1 self.cols = cols if cols else 1 self.frame = parent.bounds self.flex = 'wh' self.alpha = .3 def get_fixed_grid(self): w = self.width / self.cols h = self.height / self.rows # this list comp, is nice, for me anyway. return [ui.Rect(x*w, y*h, w, h) for x in range(self.cols) for y in range(self.rows)] def draw(self): # is an attr we can set to True or False if not self.draw_grid: return ui.set_color('lightgreen') for r in self.get_fixed_grid(): ui.Path.rect(*r).stroke() class MyClass(ui.View): def __init__(self, *args, **kwargs): super().__init__(*args, **kwargs) self.grid_overlay = FixedGridOverlay(self, rows=40, cols=40, draw=True) self.add_subview(self.grid_overlay) self.make_view() def make_view(self): btn = ui.Button(name='btn', frame=(40, 40, 100, 32)) btn.title = 'Test Button' btn.border_width = 1 btn.border_color = 'white' btn.corner_radius = 8 btn.action = self.btn_action self.add_subview(btn) def btn_action(self, sender): print(sender.title) if __name__ == '__main__': _use_theme = True w, h = 600, 800 f = (0, 0, w, h) style = 'sheet' style = '' mc = MyClass(name='Grid overlay test', frame=f, bg_color='white') if not _use_theme: mc.present(style=style, animated=False) else: editor.present_themed(mc, theme_name='Oceanic', style=style, animated=False) ```