Archived:Getting started with custom ui components in PySymbian

Comments

21 Sep
2009

---

Log in or Join to leave comments.

Aquivado: Este artigo foi arquivado, pois o conteúdo não é mais considerado relevante para se criar soluções comerciais atuais. Se você achar que este artigo ainda é importante, inclua o template {{ForArchiveReview|escreva a sua justificativa}}.

All PySymbian articles have been archived. PySymbian is no longer maintained by Nokia and is not guaranteed to work on more recent Symbian devices. It is not possible to submit apps to Nokia Store.

Article Metadata

---

Article

Created: anees042 (21 Oct 2008)

Last edited: hamishwillee (08 May 2013)

Today, im going to show you how to start with developing custom ui components.

The ui component which we will be programming is selection_list like component and i named it ImageList.

note: the image area.png is a 40×240 image, this example is developed and tested on s60v3, if you wants to check it on another series, please change the images resoulotions accordingly.

Here is the code;

# __author__='Fayyaz Ali'
# version = '1.0 beta'
# filename='ImageList.py'
# license='GNU GPL'
 
import appuifw, e32, graphics
 
#Define the exit function
def quit():app_lock.signal()
appuifw.app.exit_key_handler=quit
appuifw.app.screen='large'
selectedindex=0
 
def handle_redraw(rect):
     canvas.blit(img)
 
def selected_index():
    return selectedindex
 
img=graphics.Image.new((240,320))
 
img1=graphics.Image.open("e:\\Images\\goback.gif")
img2=graphics.Image.open("e:\\Images\\area.png")
 
#draw list item background
img.blit(img2, (0,0), (2,2))
#draw list item icon
img.blit(img1, (-5,-12))
#draw list item text
img.text((30,30),u'List Text',(0,0,0),"title")
 
#draw list item background
img.blit(img2, (0,0), (2,44))
#draw list item icon
img.blit(img1, (-5,-54))
#draw list item text
img.text((30,72),u'List Text',(0,0,0),"title")
 
#draw list item background
img.blit(img2, (0,0), (2,86))
#draw list item icon
img.blit(img1, (-5,-96))
#draw list item text
img.text((30,114),u'List Text',(0,0,0),"title")
 
#draw list item background
img.blit(img2, (0,0), (2, 128))
#draw list item icon
img.blit(img1, (-5,-138))
#draw list item text
img.text((30,156),u'List Text',(0,0,0),"title")
 
#draw list item background
img.blit(img2, (0,0), (2, 170))
#draw list item icon
img.blit(img1, (-5,-180))
#draw list item text
img.text((30,198),u'List Text',(0,0,0),"title")
 
#draw list item background
img.blit(img2, (0,0), (2, 212))
#draw list item icon
img.blit(img1, (-5,-222))
#draw list item text
img.text((30,240),u'List Text',(0,0,0),"title")
 
#draw list item background
img.blit(img2, (0,0), (2, 254))
#draw list item icon
img.blit(img1, (-5,-264))
#draw list item text
img.text((30,282),u'List Text',(0,0,0),"title")
 
#draw scrollbar
img.line((236,0,236,328),0)
img.rectangle((235,105,238,215), fill=0x000000)
 
canvas=appuifw.Canvas(event_callback=None, redraw_callback=handle_redraw)
 
appuifw.app.body=canvas
 
app_lock=e32.Ao_lock()
app_lock.wait()

Our first control is ready but needs alot of more work, so see you soon.