Monday, July 27, 2009

Canvas Calender

Introduction

This article demonstrates Calender on canvas. The simplest mobile application development tool, PyS60, is used to develop this canvas based calender. The code snippet given in this article generates canvas based calender.

The following modules are used when developing this application:

*appuifw module
*graphics module
*e32 module

The following functions are used to create canvas based calender:

* draw_screen()':draw the black screen on canvas
* draw_text()':write some text on square
* print_number: print number on square

The following parameters are used when developing this application. They are customizable.

* number_of_square : Initialize number of column
* number_of_lines : Initialize number of row
* Horizontal_Separator : Separate the space between column
* Vertical_Separator : Separate the space between row

All the functions and parameters are defined in source code in detail.


Code snippet

The code for the calender is below.

# import module
import appuifw,graphics,e32

# define color code
BLACK= (0,0,0)
RED=(255,0,0)
BLUE= (0,0,255)
GREEN=(0,255,0)
ORANGE= (255,127,0)
WHITE=(255,255,255)
global width,height
width=320
height=320

#Global variables
sqrt_x=width/16
sqrt_y=height/4
sqrt_width=30
sqrt_height=25
number_of_square=7
number_of_lines=6
Horizontal_Separator=3
Vertical_Separator=3

TextColor=RED
PrintNumber=WHITE
canvas=None
img=None

def handle_redraw(rect):
canvas.blit(img)

# exit function
def quit():
app_lock.signal()

#---------------------------
#draw draw screen
#---------------------------

def draw_screen():

#Global variable for application UI
global canvas

#Create an instance of Canvas and set it as the application's body
canvas = appuifw.Canvas(redraw_callback = handle_redraw,event_callback = None)
appuifw.app.body=canvas

#Set the screen to full
appuifw.app.screen = 'full'
appuifw.app.exit_key_handler=quit

#Global variable for application UI
global img
img = graphics.Image.new((canvas.size))

#Clear the image
img.clear(BLACK)
global x1,y1,x2,y2, sqrt_x, sqrt_y, sqrt_width, sqrt_height,number_of_square, Horizontal_Separator,Vertical_Separator,number_of_lines
j=0
while j i=0
k=0

#define rectangle coordinate
x1=sqrt_x
y1=sqrt_y+(j*(sqrt_height+Vertical_Separator))
x2=x1+sqrt_width
y2=y1+sqrt_height
while (i #draw rectangle
img.rectangle((x1+ (i*sqrt_width),y1,x2+ (i*sqrt_width)-Horizontal_Separator,y2),outline=BLUE)
i=i+1
handle_redraw(None)
j=j+1
Total_x, Total_y = canvas.size
img.text((35,50), u"CALENDER", fill = BLUE,font=(u'Nokia Hindi S60',40,appuifw.STYLE_BOLD))
handle_redraw(None)

#define draw_text function
def draw_text():
global sqrt_x,sqrt_y,t1,t2,sqrt_height,y3,x3, number_of_square
t1=5
t2=20
y3=sqrt_y+t2
i=1
a=[u'S',u'M',u'T',u'W',u'T',u'F',u'S']
while i< number_of_square +1:
# draw text on canvas
img.text(((sqrt_x+(i*t1)+((i-1)*sqrt_height)),y3), unicode(a[i-1]), fill=TextColor,font= (u'Nokia Hindi S60',20,appuifw.STYLE_BOLD))
i=i+1
handle_redraw(None)


def draw_number(i, no_of_days_in_month):
global number_of_lines, number_of_square
j=0
a=1
while j<(number_of_lines-1):
if i==number_of_square:
i=0
t1=5
x1=sqrt_x
y1=sqrt_y+((j+1)*sqrt_width)+14
while (i img.text((x1+ (i*sqrt_height)+((i+1)*t1),y1),unicode(a),fill=PrintNumber)
a=a+1
i=i+1
if a==no_of_days_in_month+1:
break
handle_redraw(None)
#a=a+1
j=j+1
#calling the function
draw_screen()
draw_text()
draw_number(3,31)
app_lock=e32.Ao_lock()

#Wait for the user to request the exit
app_lock.wait()




Screenshots:



























Tuesday, July 21, 2009

How to develop brick-breaker game in Python - Part 3

Introduction

Finally we have the last article in the series of "How to develop brick-breaker game in Python. If you have followed the previous articles in this series, then after finishing this one, you should be able to create your own Brick-breaker or similar game using PyS60.

In this article- Part 3, we would learn about the code for the moving ball, intializing the bricks parameter, slider parameter and sequence of calling functions. Let's discuss them in detail.


Part 3

Code for moving the ball
Here we have a little code for moving the ball in canvas.
This ball is moving automatically.

Thus the code for moving the ball could be as follows:


# import module
import e32,random
import time
import appuifw
import graphics
import math
BLACK=(0,0,0)
GREEN=(0,255,0)
RED=(255,0,0)
running=1
#define exit function
def quit():
global running
running=0

appuifw.app.exit_key_handler=quit
#Set the screen to large
appuifw.app.screen='large'
#Create an instance of Canvas and set it as the application's body
canvas=appuifw.Canvas()
appuifw.app.body=canvas
j,k=canvas.size
#define circle coordinate
x1vel=10
y1vel=10
x1=150
y1=300
speed=15
while running:
global x1,y1,x1vel,y1vel
if((x1<0)>j-15)):
x1vel=x1vel*-1
if ((y1<0)>k-15)):
y1vel=y1vel*-1
x1=x1+x1vel
y1=y1+y1vel
x2=x1+speed
y2=y1+speed
#draw circle
canvas.ellipse((x1,y1,x2,y2),outline=None,fill=RED)
# Sleep for 0.1
e32.ao_sleep(0.1)
#clear canvas
canvas.clear(BLACK)
e32.ao_yield()

Sequence of calling functions

The defined functions need to be called in a proper sequence. sequence of calling functions are as follows:

draw_screen()
draw_slider()
draw_bricks()
erase_bricks(12)
app_lock = e32.Ao_lock()
app_lock.wait()
Screenshots














We have concluded the series of articles related on "How to develop Brick-Breaker game. If you will follow this series, you would be able to create a Brick-Breaker game in Python for S60.

Sunday, July 19, 2009

How to develop brick-breaker game in Python - Part 2

Introduction

In the Part 1 of this article series the slider functions were discussed and one has an idea about how to create a moving slider for the Brick-breaker game. In this article - Part 2, we would learn about different brick functions.

Brick functions of this game include functions for drawing the number of bricks needed and erase the required bricks. Following functions are discussed in this article.

1.draw_bricks: draw number of bricks

2.erase_bricks: erase bricks

Part 2

In this Brick-breaker game, we initialize some brick parameters. One can change the value of this parameter according to his customization requirements. The bricks can be replaced by certain fancy or game characters by birds or insects as shown in the following screenshot. The parameters for simple bricks used in this game are initialized as follows:

# Initializing bricks parameter######
brick_x=10
brick_y=40
brick_width=32
brick_height=20
number_of_bricks=7
number_of_lines=3
Horizontal_Separator=2
Vertical_Separator=3
BrickColour=BLUE
BrickBorder=GREEN
Draw_bricks()

By using this function, we can draw numbers of bricks in horizontal as well as vertical direction. Here, I have created total 30 bricks.

The defination of the draw_screen() is as follows:

def draw_bricks():
global x1,y1,x2,y2, brick_x, brick_y, brick_width, brick_height,number_of_bricks, Horizontal_Separator,Vertical_Separator,number_of_lines
j=0
while j
i=0
x1=brick_x
y1=brick_y+(j*(brick_height+Vertical_Separator))
x2=x1+brick_width
y2=y1+brick_height
while (i
img.rectangle((x1+ (i*brick_width),y1,x2+ (i*brick_width)-Horizontal_Separator,y2), width=1, outline=BrickBorder,fill= BrickColour)
i=i+1
handle_redraw(None)
j=j+1

erase_bricks()

By using this function, we erase the bricks by passing the number of brick that is required to be earased. The definition of the add_location() could be as follows:

def erase_bricks(number):
global x1,y1,x2,y2, brick_x, brick_y, brick_width, brick_height,number_of_bricks, Horizontal_Separator,Vertical_Separator,number_of_lines
i=0
if (number < i="number" x1="brick_x" y1="brick_y" x2="x1+brick_width" y2="y1+brick_height" fill=" BLACK)"> (number_of_bricks-1)):
i=number-number_of_bricks
x1=brick_x
y1=brick_y+(1*(brick_height+Vertical_Separator))
x2=x1+brick_width
y2=y1+brick_height
img.rectangle((x1+ (i*brick_width),y1,x2+ (i*brick_width)-Horizontal_Separator,y2),fill= BLACK)
handle_redraw(None)

if (number < (3*number_of_bricks)) and (number > (2*number_of_bricks-1)):
i=number-(2*number_of_bricks)
x1=brick_x
y1=brick_y+(2*(brick_height+Vertical_Separator))
x2=x1+brick_width
y2=y1+brick_height
img.rectangle((x1+ (i*brick_width),y1,x2+ (i*brick_width)-Horizontal_Separator,y2),fill= BLACK)
handle_redraw(None)

That finishes the brick functions (Part 2) for the Brick-Breaker Game.

The next article in the series- Part 3 for brick-Breaker , would cover Bouncing ball in canvas, game operation and would conclude this game.

Screenshots

These screenshots demonstrate the Brick function on canvas. The screenshots are relevant only to Part 2.











Wednesday, July 15, 2009

Brick-breaker game in Python - Part 1


Introduction

In this article, I would be explaining how to create a Brick-Breaker game in Python for S60. The Brick-Breaker game is an arcade game. In this game, the player moves a paddle on the screen and bounces a ball. The objective of the game is to destroy bricks which are at the top.

Development tools

1. Text editor - notepad is sufficient.

2. Python for S60 - preferred version: PyS60 1.4.5 stable release

3. Python for S60 script shell - preferred version: PyS60 1.4.5 stable release

The PyS60 tools can be downloaded from Sourceforge resources.

The following modules are used when developing this application:

  • appuifw module
  • sysinfo module
  • graphics module
  • e32 module
  • key_codes module
  • random module
  • math module
  • time module

Part 1

In this article (Part-1) we would discuss the different slider functions in detail.

Initializing slider parameter

Before discussing, any functions in detail - let us define some of the slider parameters.

#SLIDER PARAMETERS########
SliderX1=120
SliderY1=305
SliderX2=160
SliderY2=315
SliderSpeed=22

SliderColor=RED
TotalScreenWidth=230

draw_screen()

By using this function, We create a black screen in canvas. The definition of the draw_screen() is as follows:

def draw_screen():
appuifw.app.screen = 'full'
global canvas
canvas = appuifw.Canvas(redraw_callback=handle_redraw)
appuifw.app.body = canvas
appuifw.app.exit_key_handler = quit

global img
img = graphics.Image.new(canvas.size)
img.clear(BLACK)
handle_redraw(None)

draw_slider()

By using this function, we create a slider in canvas using keyboard shortcuts. The defination of the draw_screen() is as follows:

def draw_slider():

global canvas
#Keyboard shortcuts
canvas.bind(key_codes.EKeyLeftArrow,lambda: leftkey())
canvas.bind(key_codes.EKeyRightArrow,lambda: rightkey())
appuifw.app.body = canvas
appuifw.app.exit_key_handler = quit
img.rectangle((SliderX1,SliderY1,SliderX2,SliderY2),fill=SliderColor)
handle_redraw(None)

leftkey()

The leftkey() is called from the draw_slider() function. By using this function, we can move the slider to left side by pressing left key. Thus, the code of leftkey() function is as follows:

def leftkey():
if (SliderX1>0):


img.rectangle((SliderX1, SliderY1, SliderX2, SliderY2),fill=BLACK)
global img, canvas,SliderX1, SliderY1, SliderX2, SliderY2
SliderX1=SliderX1-SliderSpeed
SliderX2=SliderX2-SliderSpeed
img.rectangle((SliderX1, SliderY1, SliderX2, SliderY2),fill=SliderColor)
#appuifw.note(u"Left arrow was pressed")
handle_redraw(None)

rightkey()

The rightkey() is called from the draw_slider() function. By using this function, we can move the slider to right side by pressing right key. Thus the code of rightkey() function is as follows:

def rightkey():
if (SliderX2<230):

img.rectangle((SliderX1, SliderY1, SliderX2, SliderY2),fill=BLACK)
global img, canvas,SliderX1, SliderY1, SliderX2, SliderY2
SliderX1=SliderX1+SliderSpeed
SliderX2=SliderX2+SliderSpeed
img.rectangle((SliderX1, SliderY1, SliderX2, SliderY2),fill=SliderColor)
#appuifw.note(u"Left arrow was pressed")
handle_redraw(None)


That finishes the slider functions (Part 1) for the Brick-Breaker Game.

The next article in the series : Part 2 for brick-Breaker, would cover Brick functions for this game.

Screenshots These screenshots demonstrate the Slider and its movable position on canvas. The screenshots are relevant only to Part 1.