BUILDING SOFTWARE I
กลลลุ่ม 3 นาย ททักษษ์ดนทัย ขลุ่นแสน นาย นนิธก นิ านตษ์ เสนนีวงศษ์ ณ อยลุ่ธยา นาย จนิตวทัต แสงสลุ่วรรณ
Canvas ●
Canvas คคือชลุ่ดคคาสทัสั่งของ Widget ทนีใสั่ ชช้สคาหรทับวาดรรูป บน Coordinate Space
●
ทลุ่กๆ Widget จะมนี Canvas เปป็ นของตทัวเอง
●
Coordinate Space คคือ พคืพื้นทนีสั่สคาหรทับวาดรรูป
Canvas ●
การวาดรรูปทรงเลขาคณนิตแบบพคืพื้นฐาน
#พคืพื้นฐานแตลไมลงลายเลย
Canvas ●
วาดสนีสั่เหลนีย สั่ ม Rectangle:
pos: self.x+10,self.top-80
size: self.width*0.15, self.height*0.3
Canvas ●
วาดวงกลม / วงรนี Ellipse:
angle_start: 120 angle_end: 420 pos: 110, 110
# กคาหนดองศาเรนิม สั่ ตช้น
# กคาหนดองศาสนิพื้นสลุ่ด
Size: 80, 80 Ellipse:
angle_start: 120 angle_end: 420 pos: 110, 110 Size: 80, 120
# กคาหนดองศาเรนิม สั่ ตช้น
# กคาหนดองศาสนิพื้นสลุ่ด
Canvas ●
วาดรรูปเหลนีสั่ยมดช้วย Ellipse Ellipse:
Segments: 3
pos: 210,110
# กคาหนดจคานวนเหลนีสั่ยม
size: 60,80
Ellipse:
Segments: 5
pos: 210,110 size: 60,80
# กคาหนดจคานวนเหลนีสั่ยม
Canvas ●
วาดรรูปสามเหลนีสั่ยม / สนีสั่เหลนีสั่ยม / เสช้นตรง / จลุ่ด
Triangle:
Line:
Quad:
Point:
points: 310,110,340,190,380,130 points: 410,110,430,180,470,190,490,120
points: 10,30, 90,90, 90,10, 10,60 points: 110,30, 190,90, 190,10, 110,60 pointsize: 3
Canvas ●
วาดเสช้นโคช้ง Bezier:
points: 210,30, 290,90, 290,10, 210,60 segments: 360
dash_length: 10 dash_offset: 5
Canvas ●
วาดรรูปหลายเหลนีสั่ยม # รรูป I Mesh:
mode: 'triangle_fan'
vertices: 310,30,0,0,390,90,0,0, 390,10,0,0, 310,60,0,0 Indices: 0,1,2,3 # รรูป J Mesh:
mode: 'triangle_fan'
vertices: 430,90,0,0, 470,90,0,0, 490,70,0,0, 450,10,0,0, 410,70,0,0, indices: 0,1,2,3,4
Canvas
Canvas ●
วาดเสช้นใหช้เปป็ นรรูปทรง canvas:
Line:
ellipse: 10, 20, 80, 60, 120, 420, 180 width: 2
Line:
circle: 150, 50, 40, 0, 360, 180
Line:
rectangle: 210,10,80,80
Line:
points: 310,10,340,90,390,20
close: True # กคาหนดใหช้เสช้นปนิ ดเชคืสั่อมตลอกทัน
Canvas ●
การใสลรรูปและใสลสนี
Color:
rgba: 0,0,1,.75 # กคาหนดสนีและความโปรลงแสง
Line:
points: 10,10,390,10 width: 10
cap: 'square' # กคาหนดรรูปแบบเสช้นเปป็ นสนีสั่เหลนีสั่ยม
canvas:
Ellipse:
pos: 10,10 size: 80,80
source: 'kivy.png' # เรนียกใชช้รรูป kivy.png Rectangle:
pos: 110,10 size: 80,80
source: 'kivy.png' # เรนียกใชช้รรูป kivy.png
Color:
rgba: 0,1,0,1 # กคาหนดสนีและความโปรลงแสง
Rectangle:
pos: 210,10 size: 80,80
source: 'kivy.png' # เรนียกใชช้รรูป kivy.png Rectangle:
pos: 310,10 size: 80,80
Canvas ●
before & after
canvas:
Color:
rgba: 0,1,0,1
Rectangle:
pos: 100,0
size: 100,100
canvas.before: Color:
rgba: 1,0,0,1
Rectangle:
pos: 0,0
size: 100,100
canvas.after: Color:
rgba: 0,0,1,1
Rectangle:
pos: 200,0
size: 100,100
Button:
text: 'A very very very long button'
pos_hint: {'center_x': .5, 'center_y': .5} size_hint: .9,.2
Canvas ●
การหมลุ่นและการยช้าย
pos_hint: {'x':.5, 'y':.5} canvas:
Rectangle:
source: 'kivy.png'
Rotate:
angle: 90
axis: 0,0,1
Color:
rgb: 1,0,0
Rectangle:
source: 'kivy.png'
Canvas ●
การหมลุ่นและการยช้าย
Translate:
x: -100
Color:
rgb: 0,1,0
Rectangle:
source: 'kivy.png'
Translate:
y: -100
Scale:
xyz:(.5,.5,0)
Color:
rgb: 0,0,1
Rectangle:
source: 'kivy.png'
Canvas ●
Comic Creator
# ศศึกษาไมลททัน ขอเวลานนิดนศึง
สนิสั่งทนีไสั่ ดช้เรนียนรช้รู ●
ไดช้รช้รูจก ทั การ Canvas
●
ไดช้นคาชลุ่ดคคาสทัสั่ง Canvas มาใชช้ฝศึกวาดรรูปทรงตลางๆ
●
รช้จ รู ทักการเรนียกใชช้รรูปภาพ
●
รช้จ รู ทักการใชช้คคาสทัสั่งการยลอขยาย และเคลคืสั่อนยช้าย
สนิสั่งทนีต สั่ ช้องกลทับไปทคา ●
รนีบศศึกษาบทตลอๆไป
●
ฝศึ กฝนและทบทวนความรช้รูทนีสั่ไดช้
# ตช้องรนีบไปศศึกษาดลวนๆ # ตามกลลลุ่มอคืสั่นไมลททันแลช้ว
