[lab] easy way to make pics using ui.Button

[Phuket2]

Not for experts, for newbies like me!
The code below is very limited on styles. But as you can see very easy to add params to btn_image func to modify the result.

'''
	Pythonista Forum - @Phuket2
'''
import ui, editor
import calendar

def btn_image(text, w = 256):
	btn = ui.Button( title = text)
	btn.frame = (0, 0, w, w)
	btn.bg_color = 'teal'
	btn.tint_color = 'white'
	btn.font = ('Arial Rounded MT Bold', w * .4)
	btn.corner_radius = btn.width / 2
	with ui.ImageContext(w, w) as ctx:
		btn.draw_snapshot()
		return ctx.get_image()
	
if __name__ == '__main__':
		
	for i in range(1, 13):
		m_name = calendar.month_abbr[i]
		btn_image( m_name, w = 48).show()
	
	for i in range(1, 11):
		btn_image( str(i) , w = 32).show()
	
	lst = ['stop', 'start', 'go' , 'wait']
	for lb in lst:
		btn_image( lb, w = 256).show()
				

[abcabc]

Very good idea. Although draw_snapshot is very slow, it is good for making images only once (or occasionally) . Doing this directly in image context seems bit difficult (things like getting round shape, adjusting size with draw_string etc.) Even transformations are bit easier here. Here is a slightly complicated example (our old circular layout example).

import ui, editor
import calendar
from math import pi

def make_btn(text, w = 256, v=None):
    btn = ui.Button( title = text)
    btn.frame = (0, 0, w, w)
    btn.bg_color = 'teal'
    btn.tint_color = 'white'
    btn.font = ('Arial Rounded MT Bold', w * .4)
    btn.corner_radius = btn.width / 2
    btn.center=v.bounds.center()
    btn.transform=ui.Transform.rotation(-2.*pi*i/N).concat(
        ui.Transform.translation(0,-(v.height/2-btn.height/2))).concat(
        ui.Transform.rotation(2.*pi*i/N))
    return btn

w1= 576
v=ui.View(frame=(0,0,w1, w1))
v.bg_color=(1,1,1)
N=12
for i in range(0,N):
    a = make_btn(calendar.month_abbr[i+1], w=48, v=v) 
    v.add_subview(a)

with ui.ImageContext(w1, w1) as ctx:
    v.draw_snapshot()
    img = ctx.get_image()

img.show()

[Phuket2]

@abcabc yeah agreed. It's a little slow. I wanted a quick and dirty way to supply ui.ListDataSource items.image with a non builtin image. That's how I found myself writing the above. Otherwise could just use the ui.Button or just Draw it real time. But as you point out, it's ok for a small number of images. Sometimes you just need to pass an image unless you want to do a bunch of extra work. Eg. I could render the cells contents, but if you can avoid better I think.

[Phuket2]

I was doing something like the below.

'''
	Pythonista Forum - @Phuket2
'''
import ui, editor
import calendar

def btn_image(text, w = 256, *args, **kwargs):
	btn = ui.Button( title = text)
	btn.frame = (0, 0, w, w)
	btn.bg_color = 'teal'
	btn.tint_color = 'white'
	btn.font = ('Arial Rounded MT Bold', w * .4)
	btn.corner_radius = btn.width / 2
	for k, v in kwargs.items():
		if hasattr(btn, k):
			setattr(btn, k, v)
		
	with ui.ImageContext(w, w) as ctx:
		btn.draw_snapshot()
		return ctx.get_image()
      
class MonthDataSource(ui.ListDataSource):
	def __init__(self, items = [], *args, **kwargs):
		lst = []
		for m in range(1, 13):
			rec = dict(title = calendar.month_name[m] , image=btn_image(calendar.month_abbr[m][0], w = 26, bg_color = 'deeppink'), accessory_type = 'checkmark' )
			lst.append(rec)
		items = lst
		super().__init__(items, *args, **kwargs)

class TableBase(ui.View):
	def __init__(self, *args, **kwargs):
		super().__init__(*args, **kwargs)
		self.tv = ui.TableView(name='table')
		self.tv.flex = 'wh'
		self.add_subview(self.tv)	
	
class MonthTable(TableBase):
	def __init__(self, *args, **kwargs):
		super().__init__(*args, **kwargs)
		self.tv.data_source = MonthDataSource()
	
	def layout(self):
		if self.superview:
			self.frame = self.superview.bounds
		
class MyClass(ui.View):
	def __init__(self, *args, **kwargs):
		super().__init__(*args, **kwargs)		

if __name__ == '__main__':
	_use_theme = True
	w, h = 300, 600
	f = (0, 0, w, h)
	
	mc = MyClass(frame=f, bg_color='white', name='Months')
	mc.add_subview(MonthTable())
	
	if not _use_theme:
		mc.present('sheet', animated=False)
	else:
		editor.present_themed(mc, theme_name='Oceanic', style='sheet', animated=False)

[Phuket2]

@abcabc , you should take a look at this module for guestures if you have not seen it Github. @JonB pointed me to this one. I have just started to try it. It's nice. Very easy to get up,and running. Especially for a long press. Is simple. Pinch is also easy, but I can see the more you have your head around the Transforms then do anything. Anyway, if you haven't seen, I think this would be right up your alley