add img.text and img.rectangle in an image

[bagindraerix]

i have code imgviewer.py from some website (i forget it name).
the problem is i want to add some img.text and img.rectangle in the image
for example i want to add:
img.text((10,40),u"Hello",fill=WHITE)
img.rectangle((50,100,100,150),fill=YELLOW)
but until now i cant do that.
anybody can help me?

import appuifw
from graphics import *
import e32
import key_codes
import os

appuifw.app.screen = "full"
appuifw.app.body=canvas=appuifw.Canvas()
backup_image=Image.new(canvas.size)
canvas.clear(0)
center=[0,0]
zoom=1
zoomstepindex=0
screensize=canvas.size
screenrect=(0,0,screensize[0],screensize[1])
step=30
textloc=(screensize[0]*0.3,screensize[1]*.5)

if e32.in_emulator():
    imagedir=u'c:\\images'
else:
    imagedir=u'e:\\images'
files=map(unicode,os.listdir(imagedir))

index=appuifw.selection_list(files)

lock=e32.Ao_lock()

def fullupdate():
    backup_image.clear(bgcolor)
    update()
    
def nextpic():
    global index,finished
    index=(index+1)%len(files)
    finished=1
    loaded_image.stop()
    lock.signal()

def prevpic():
    global index,finished
    index=(index-1)%len(files)
    finished=1
    loaded_image.stop()
    lock.signal()

def zoomin():
    global zoomstepindex,zoom
    if zoomstepindex < (len(zoomsteps)-1):
        zoomstepindex+=1
    zoom=zoomsteps[zoomstepindex]
    fullupdate()

def zoomout():
    global zoomstepindex
    if zoomstepindex > 0:
        zoomstepindex-=1
    zoom=zoomsteps[zoomstepindex]
    backup_image.clear(bgcolor)
    fullupdate()


def isvalidcenter(c):
    iw,ih=(loaded_image.size[0],loaded_image.size[1])
    srcsize=(int(screensize[0]/zoom),int(screensize[1]/zoom))
    vw,vh=(srcsize[0]/2,srcsize[1]/2)    
    return (c[0]+vw<iw and c[0]-vw>=0 and
            c[1]+vh<ih and c[1]-vh>=0)
def move(delta):
    global center
    c=center
    for k in range(1,4):
        t=[c[0]+int(delta[0]*k*20/zoom),
           c[1]+int(delta[1]*k*20/zoom)]
        center=t
        update()

bgcolor=0

canvas.bind(key_codes.EKey3,nextpic)
canvas.bind(key_codes.EKey1,prevpic)
canvas.bind(key_codes.EKey5,zoomin)
canvas.bind(key_codes.EKey0,zoomout)
canvas.bind(key_codes.EKeyLeftArrow,lambda:move((-1,0)))
canvas.bind(key_codes.EKeyRightArrow,lambda:move((1,0)))
canvas.bind(key_codes.EKeyUpArrow,lambda:move((0,-1)))
canvas.bind(key_codes.EKeyDownArrow,lambda:move((0,1)))

def rect_intersection(r1,r2):
    return (max(r1[0],r2[0]),max(r1[1],r2[1]),
            min(r1[2],r2[2]),min(r1[3],r2[3]))
    
def update():
    global zoom
    zoom=zoomsteps[zoomstepindex]
    # We convert the screen rect into image coordinates, compute its
    # intersection with the image rect and transform it back to screen
    # coordinates.
    imgrect=(0,0,loaded_image.size[0],loaded_image.size[1])    
    ss=(int(screensize[0]/zoom),int(screensize[1]/zoom))
    screenrect_imgcoords=(center[0]-ss[0]/2,center[1]-ss[1]/2,
                          center[0]+ss[0]/2,center[1]+ss[1]/2)
    sourcerect=rect_intersection(screenrect_imgcoords,imgrect)
    targetrect=(int((sourcerect[0]-center[0])*zoom+screensize[0]/2),
                int((sourcerect[1]-center[1])*zoom+screensize[1]/2),
                int((sourcerect[2]-center[0])*zoom+screensize[0]/2),
                int((sourcerect[3]-center[1])*zoom+screensize[1]/2))
    backup_image.clear(bgcolor)
    backup_image.blit(loaded_image,source=sourcerect,target=targetrect,scale=1)
    if not finished:
        backup_image.text(textloc,u'Loading....',(255,255,0))
    backup_image.text((0,10),files[index],(0,255,0))
    canvas.blit(backup_image)

global finished
finished=0
def finishload(err):
    global finished
    finished=1

running=1
def quit():
    global running,lock
    running=0
    lock.signal()

appuifw.app.title = u"Image Viewer"    
appuifw.app.exit_key_handler=quit
backup_image.clear(bgcolor)

selected_file=imagedir+"\\"+files[index]
imginfo=Image.inspect(selected_file)
imgsize=imginfo['size']
loaded_image=Image.new(imgsize)

im=None
while running:
    selected_file=imagedir+"\\"+files[index]
    imgsize=Image.inspect(selected_file)['size']
    backup_image.text(textloc,u'Loading.',(255,255,0))
    finished=0
    if imgsize != loaded_image.size:
        loaded_image=Image.new(imgsize)
    loaded_image.load(selected_file, callback=finishload)
    backup_image.text(textloc,u'Loading..',(255,255,0))
    zoomsteps=[1.*screensize[0]/loaded_image.size[0],.25,.5,1]
    zoomstepindex=0
    center=[loaded_image.size[0]/2,loaded_image.size[1]/2]    
    backup_image.text(textloc,u'Loading...',(255,255,0))
    while not finished:
        update()
        e32.ao_sleep(0.5)
    fullupdate()
    lock.wait()
loaded_image=None
backup_image=None

[bogdan.galiceanu]

When you say something like "until now i cant do that" you should also say why. Does it throw an error (if so, what is the error?)? Does nothing happen?

Just by looking at your examples I think you should replace WHITE with 0xFFFFFF and YELLOW with 0xFFFF00 since Python expects either int or RGB tuples for colors.

[bagindraerix]

When you say something like "until now i cant do that" you should also say why. Does it throw an error (if so, what is the error?)? Does nothing happen?

Just by looking at your examples I think you should replace WHITE with 0xFFFFFF and YELLOW with 0xFFFF00 since Python expects either int or RGB tuples for colors.

it doesn't show error. it only display the image(picture) not with the img.text or img.rectangle

[bogdan.galiceanu]

Where did you put img.text and img.rectangle in your code?

[bagindraerix]

Where did you put img.text and img.rectangle in your code?

i have tried in any place, but it still doesnt work.
or maybe we have to edit the code?

[bogdan.galiceanu]

Put them in the update function, right before the last line:

def update():
  ...
  backup_image.text((10,40),u"Hello",fill=0xFFFFFF)
  backup_image.rectangle((50,100,100,150),fill=0xFFFF00)
  canvas.blit(backup_image)

[bagindraerix]

Put them in the update function, right before the last line:

def update():
  ...
  backup_image.text((10,40),u"Hello",fill=0xFFFFFF)
  backup_image.rectangle((50,100,100,150),fill=0xFFFF00)
  canvas.blit(backup_image)

i tried, but why the text and rectangle not move when i move the picture?

[bogdan.galiceanu]

i tried, but why the text and rectangle not move when i move the picture?

Because backup_image is the entire image as seen on the screen (with the black frame and everything). If you want to put the "Hello" and rectangle on the actual image, call the text and rectangle methods on loaded_image right after the line "backup_image.clear(bgcolor)" instead of on backup_image.

[bagindraerix]

Because backup_image is the entire image as seen on the screen (with the black frame and everything). If you want to put the "Hello" and rectangle on the actual image, call the text and rectangle methods on loaded_image right after the line "backup_image.clear(bgcolor)" instead of on backup_image.

thank you very much bogdan.galiceanu, it works !