1
00:00:00,000 --> 00:00:05,069

2
00:00:05,069 --> 00:00:06,110
THOMAS ANIMADA: D'acord.

3
00:00:06,110 --> 00:00:07,450
Hola a tothom.

4
00:00:07,450 --> 00:00:08,690
Estic Thomas Lively.

5
00:00:08,690 --> 00:00:15,160
Aquest seminari serà
escriure jocs 2D en C utilitzant SDL.

6
00:00:15,160 --> 00:00:17,970
Així que sé que ets tot
preguntant, sí, realment

7
00:00:17,970 --> 00:00:22,050
volen jugar i fer jocs,
però el que és aquest negoci SDL?

8
00:00:22,050 --> 00:00:25,320
Així SDL és una biblioteca C.

9
00:00:25,320 --> 00:00:28,270
Es destaca per la senzilla
DirectMedia Layer.

10
00:00:28,270 --> 00:00:31,340
I és una plataforma creuada,
biblioteca de desenvolupament de jocs.

11
00:00:31,340 --> 00:00:37,160
Funciona en Windows, Mac,
Linux, fins i tot iOS i Android.

12
00:00:37,160 --> 00:00:40,380
S'ocupa de coses com
l'accés als sistemes d'àudio

13
00:00:40,380 --> 00:00:44,900
per a l'ordinador, el teclat, i
ratolí, joystick, si estan units.

14
00:00:44,900 --> 00:00:48,300
El mòbil, fins i tot pot fer el
entrada tàctil i tot això.

15
00:00:48,300 --> 00:00:53,030
I, per descomptat, que s'encarrega dels gràfics,
dibuix coses a la pantalla.

16
00:00:53,030 --> 00:00:56,470
>> Així que és molt àmpliament utilitzat, tot i que
pot ser que no hagi sentit parlar d'ell abans.

17
00:00:56,470 --> 00:01:00,860
Està construït en, per exemple,
Motor de font de Valve,

18
00:01:00,860 --> 00:01:04,970
que alimenta jocs com
Portal i Team Fortress 2.

19
00:01:04,970 --> 00:01:08,680
Està també en un gran nombre
de jocs indie que surten,

20
00:01:08,680 --> 00:01:13,545
així que estic emocionat de veure el que
tot estarà fent amb ell.

21
00:01:13,545 --> 00:01:20,000
>> Els objectius del seminari són per aconseguir que
es va disposar a ser en desenvolupament amb SDL.

22
00:01:20,000 --> 00:01:22,700
Anem a aprendre
per crear una finestra de joc.

23
00:01:22,700 --> 00:01:26,130
Crearem sprites,
que són les imatges del seu joc

24
00:01:26,130 --> 00:01:27,744
que es pot moure.

25
00:01:27,744 --> 00:01:29,910
Anem a aprendre
ai animar els sprites,

26
00:01:29,910 --> 00:01:32,910
així moure'ls, fer
ells canvien amb el temps.

27
00:01:32,910 --> 00:01:35,580
I anem a aprendre
per capturar teclat i el ratolí

28
00:01:35,580 --> 00:01:38,240
d'entrada de l'ordinador.

29
00:01:38,240 --> 00:01:41,550
El que no estarem parlant
avui és gràfics en 3D,

30
00:01:41,550 --> 00:01:45,520
perquè això és molt complicat
tema que no tenim temps per a.

31
00:01:45,520 --> 00:01:49,010
No anem a aprendre a
reproduir l'àudio en els nostres jocs.

32
00:01:49,010 --> 00:01:53,300
I no estarem construint
per a res, però Linux.

33
00:01:53,300 --> 00:01:58,330
>> Ara les excepcions cal,
amb sort, al final del seminari,

34
00:01:58,330 --> 00:02:01,660
se sentirà còmode amb
la documentació de SDL,

35
00:02:01,660 --> 00:02:05,370
pel que serà capaç d'anar esbrinar
la manera de jugar d'àudio per tu mateix.

36
00:02:05,370 --> 00:02:12,150
També la construcció per a Mac o PC hauria de funcionar
exactament la mateixa que la construcció per a Linux,

37
00:02:12,150 --> 00:02:14,700
però la configuració va
ser una mica diferent.

38
00:02:14,700 --> 00:02:17,700
Pel que ha de ser capaç d'entendre
com fer aquestes coses

39
00:02:17,700 --> 00:02:20,900
per al final del seminari d'avui.

40
00:02:20,900 --> 00:02:26,980
>> Així que per a la posada en marxa, anem
utilitzar una màquina virtual.

41
00:02:26,980 --> 00:02:31,010
Volem utilitzar l'IDE CS50, perquè
només estarem escrivint en C.

42
00:02:31,010 --> 00:02:35,120
Però ja que l'IDE no és un navegador, que
no pot crear finestres o pantalla nous

43
00:02:35,120 --> 00:02:36,410
gràfics en ell.

44
00:02:36,410 --> 00:02:38,450
Així que tenim una màquina virtual.

45
00:02:38,450 --> 00:02:47,790
Així que vostè pot seguir les instruccions
aquí a manual.CS50.net/appliance/15

46
00:02:47,790 --> 00:02:53,290
per instal·lar l'aparell oficial CS50,
que no és més que una virtual de Linux

47
00:02:53,290 --> 00:02:55,110
màquina.

48
00:02:55,110 --> 00:02:58,090
>> I a continuació, una vegada que tens
que tot això es up--

49
00:02:58,090 --> 00:03:02,090
podria prendre una mica de temps, perquè
una gran download-- vas

50
00:03:02,090 --> 00:03:07,060
per funcionar en l'actualització de apt-get VM suo.

51
00:03:07,060 --> 00:03:09,410
I això és realment està passant
per actualitzar tot el programari

52
00:03:09,410 --> 00:03:12,670
paquets al sistema virtual.

53
00:03:12,670 --> 00:03:20,130
>> Després d'això, vostè va a executar
sudo apt-get install, libsdl2-2.0-0,

54
00:03:20,130 --> 00:03:27,960
libsdl2-dbg, libsdl2-dev, i
addicionalment libsdl2-image-2,0-0,

55
00:03:27,960 --> 00:03:32,560
libsdl2-image-dbg,
i libsdl2-image-dev.

56
00:03:32,560 --> 00:03:33,640
Llavors, què fa això?

57
00:03:33,640 --> 00:03:38,440
Això simplement instal·la la depuració
informació, documentació, capçaleres,

58
00:03:38,440 --> 00:03:41,260
i els binaris per a dues biblioteques.

59
00:03:41,260 --> 00:03:45,090
Regular d'edat, SDL 2.0,
i una altra biblioteca

60
00:03:45,090 --> 00:03:50,110
anomenada Imatge SDL, que
utilitzarem

61
00:03:50,110 --> 00:03:54,560
per carregar arxius d'imatge en el nostre joc.

62
00:03:54,560 --> 00:03:57,860
>> Així que una vegada que hagi de també
que, just quan se li pregunta,

63
00:03:57,860 --> 00:04:01,100
només ha de teclejar sí, pressiona Enter
per instal·lar els paquets,

64
00:04:01,100 --> 00:04:04,430
i llavors vostè ha de ser bo per anar.

65
00:04:04,430 --> 00:04:14,800
Així que per obtenir el codi de distribució,
can-- Déu meu, això no s'actualitza.

66
00:04:14,800 --> 00:04:18,480
A menys que vostè tingui un account-- GitHub
si vostè té un compte de GitHub,

67
00:04:18,480 --> 00:04:24,450
vostè pot fer això Git
comandament clon a la repo

68
00:04:24,450 --> 00:04:30,490
i que va a descarregar el Git
repo amb tot el codi en el mateix,

69
00:04:30,490 --> 00:04:31,700
de manera que vostè té el codi.

70
00:04:31,700 --> 00:04:36,470
>> Si vostè no té un GitHub
compte, el que ha de fer és tipus

71
00:04:36,470 --> 00:04:48,867
wgithttps: //github.com/tlively/sdl
seminar-- i aquí és diferent--

72
00:04:48,867 --> 00:04:49,700
/archive/master.zip.

73
00:04:49,700 --> 00:04:55,610

74
00:04:55,610 --> 00:04:59,220
Així que de nou, això és exactament el mateix
URL, si no va a ser

75
00:04:59,220 --> 00:05:09,010
tlively / SDL_seminar / master.zip i
utilitzeu wgit descarregar això.

76
00:05:09,010 --> 00:05:12,940
I llavors vostè pot simplement
descomprimir aquest arxiu

77
00:05:12,940 --> 00:05:14,900
i llavors tindràs
tot el codi font.

78
00:05:14,900 --> 00:05:17,580
Així que ho sento per això.

79
00:05:17,580 --> 00:05:23,880
I a continuació, el codi també tindrà lloc a
la pàgina web del seminari CS50 en un parell

80
00:05:23,880 --> 00:05:25,230
dia.

81
00:05:25,230 --> 00:05:26,590
>> Tot bé.

82
00:05:26,590 --> 00:05:29,932
Llavors, com comencem
escriure el nostre propi joc?

83
00:05:29,932 --> 00:05:31,890
Bé, el primer
anem a voler fer

84
00:05:31,890 --> 00:05:34,740
és mirar la documentació de SDL.

85
00:05:34,740 --> 00:05:37,020
Així que aquí està la màquina virtual.

86
00:05:37,020 --> 00:05:38,720
I aquí hi ha la pàgina web.

87
00:05:38,720 --> 00:05:40,340
He navegat viure libsdl.org.

88
00:05:40,340 --> 00:05:43,110

89
00:05:43,110 --> 00:05:48,140
El que vaig a fer aquí és anar més
a la barra lateral, a la documentació,

90
00:05:48,140 --> 00:05:51,040
i feu clic al wiki.

91
00:05:51,040 --> 00:05:56,870
Això em porta a la wiki que
té la major part de la documentació de SDL.

92
00:05:56,870 --> 00:06:01,360
Més a la barra lateral aquí, estem
va a fer clic API per categoria,

93
00:06:01,360 --> 00:06:04,300
perquè va a donar
nosaltres una bonica vista categòric

94
00:06:04,300 --> 00:06:07,770
de tota l'API per a SDL.

95
00:06:07,770 --> 00:06:12,390
>> Així, per exemple, tenim
la inicialització bàsica

96
00:06:12,390 --> 00:06:18,380
i tancat, tota la classe de
coses administratives per a l'ús de SDL,

97
00:06:18,380 --> 00:06:21,630
i després tenim la secció de
mostrar coses a la pantalla.

98
00:06:21,630 --> 00:06:23,000
Això és vídeo.

99
00:06:23,000 --> 00:06:25,790
Els esdeveniments d'entrada, que és aconseguir
entrada des del teclat,

100
00:06:25,790 --> 00:06:29,710
aconseguir l'entrada del ratolí, i
la palanca de control, si el té, fins i tot.

101
00:06:29,710 --> 00:06:32,901
Hi ha retroalimentació de força per les coses
com a dispositius de joc, que

102
00:06:32,901 --> 00:06:34,150
no parlarem.

103
00:06:34,150 --> 00:06:35,630
I aquí hi ha l'àudio.

104
00:06:35,630 --> 00:06:38,940
I després hi ha un munt d'altres
matèria que SDL pot fer per vostè.

105
00:06:38,940 --> 00:06:43,830
>> Però avui anem a enfocar
en la inicialització aquí,

106
00:06:43,830 --> 00:06:48,332
la visualització d'imatges en el vídeo
secció, i despeses dels esdeveniments d'entrada.

107
00:06:48,332 --> 00:06:50,290
Així que aquests són els principals
seccions de la documentació

108
00:06:50,290 --> 00:06:53,050
que vostè ha de preocupar.

109
00:06:53,050 --> 00:06:57,170
Només per diversió, si anem més
aquí i feu clic en l'API pel seu nom,

110
00:06:57,170 --> 00:07:04,350
podem veure una llista de tots els
cosa a la biblioteca SDL.

111
00:07:04,350 --> 00:07:11,330
Així que totes aquestes funcions, enumeracions,
estructures, una increïble quantitat de coses,

112
00:07:11,330 --> 00:07:12,820
ordre alfabètic.

113
00:07:12,820 --> 00:07:14,580
I clarament, fins
saps que estàs fent,

114
00:07:14,580 --> 00:07:19,100
això no serà massa útil,
és per això que fem API per categoria.

115
00:07:19,100 --> 00:07:20,810
>> Així que anem a començar.

116
00:07:20,810 --> 00:07:25,680
Esperem que ja tens
descarregat el codi de distribució.

117
00:07:25,680 --> 00:07:30,070
I així, el que pot fer és, a la dreta
aquí en l'aparell CS50,

118
00:07:30,070 --> 00:07:31,150
només cal obrir un terminal.

119
00:07:31,150 --> 00:07:33,750

120
00:07:33,750 --> 00:07:34,440
Aquí anem.

121
00:07:34,440 --> 00:07:40,740
Així que ja he descarregat el
codi de distribució mitjançant el .zip

122
00:07:40,740 --> 00:07:41,690
mètode.

123
00:07:41,690 --> 00:07:43,140
I he obert la cremallera.

124
00:07:43,140 --> 00:07:46,120
Així que aquí està en el mestre de seminari SDL.

125
00:07:46,120 --> 00:07:49,750
Així que vaig a entrar en aquest directori.

126
00:07:49,750 --> 00:07:55,310
I el que veiem aquí és
que tenim 7 arxius C.

127
00:07:55,310 --> 00:07:58,070
I això va a el codi
estarem buscant a l'actualitat.

128
00:07:58,070 --> 00:08:00,040
Tenim un makefile.

129
00:08:00,040 --> 00:08:06,950
I tenim un directori de recursos,
que simplement té una imatge

130
00:08:06,950 --> 00:08:09,070
que vostè va a veure molt aviat.

131
00:08:09,070 --> 00:08:16,060
>> Així que anem a obrir estos fitxers
usant l'editor de G-Edit.

132
00:08:16,060 --> 00:08:22,000
Així que vull obrir tots els arxius que
començar amb hola i acabar amb .c.

133
00:08:22,000 --> 00:08:23,380
Aquí anem.

134
00:08:23,380 --> 00:08:28,180
Així que això és una petita finestra, així que estem
va a tractar de fer que més gran.

135
00:08:28,180 --> 00:08:28,900
No, se'n va anar.

136
00:08:28,900 --> 00:08:32,836

137
00:08:32,836 --> 00:08:34,570
>> Tot bé.

138
00:08:34,570 --> 00:08:37,959
Així que aquí està la primera
arxiu que anem a veure.

139
00:08:37,959 --> 00:08:39,000
Es diu hello1_sdl.c.

140
00:08:39,000 --> 00:08:41,890

141
00:08:41,890 --> 00:08:47,980
I tot això fa és inicialitzar el SDL
biblioteca perquè puguem començar a usar-lo.

142
00:08:47,980 --> 00:08:51,550
Com ho saps per venir
amb aquest codi a tu mateix?

143
00:08:51,550 --> 00:08:53,850
Bé, si mirem més
en la documentació

144
00:08:53,850 --> 00:08:58,040
i entrem en la inicialització
i apagar la secció,

145
00:08:58,040 --> 00:09:02,230
que va a dir-nos tot
sobre com inicialitzar SDL.

146
00:09:02,230 --> 00:09:06,630
Així que definitivament llegir això en un altre moment.

147
00:09:06,630 --> 00:09:09,230
Es dirà a tots vostès
sobre el que està passant aquí.

148
00:09:09,230 --> 00:09:14,360
Però el quid de la qüestió principal és que
hem de trucar a aquesta funció SDL en ell

149
00:09:14,360 --> 00:09:18,910
i passar-ho quin tipus de coses
volem que la biblioteca per inicialitzar.

150
00:09:18,910 --> 00:09:23,620
Així que en el nostre cas, només anem
per inicialitzar el vídeo per ara,

151
00:09:23,620 --> 00:09:26,690
perquè puguem començar a mostrar les imatges.

152
00:09:26,690 --> 00:09:32,370
>> Per aquí, es pot veure si
fem clic a una SDL en ell, ens

153
00:09:32,370 --> 00:09:36,160
pot obtenir encara més informació,
incloent el valor de retorn.

154
00:09:36,160 --> 00:09:39,050
Així que veiem aquí que
returnes zero en cas d'èxit.

155
00:09:39,050 --> 00:09:43,320
Així que en el nostre codi, anem a
veure si no torna a zero,

156
00:09:43,320 --> 00:09:47,020
i si no torna
zero, pel que no s'ha realitzat correctament,

157
00:09:47,020 --> 00:09:50,650
a continuació, anem a simplement d'impressió
un error usant aquesta altra funció,

158
00:09:50,650 --> 00:09:56,260
Error get SDL, que retorna una cadena
que descriu l'error que s'ha produït.

159
00:09:56,260 --> 00:09:58,510
Anem a imprimir aquesta
error i després només som

160
00:09:58,510 --> 00:10:02,270
sortirà del programa
amb un codi d'error.

161
00:10:02,270 --> 00:10:06,470
>> Després una altra cosa que necessitem
de fer és, abans de programa es tanca,

162
00:10:06,470 --> 00:10:10,830
si inicialitzat correctament SDL,
només hem de cridar SDL deixar de fumar.

163
00:10:10,830 --> 00:10:15,750
I això va a manejar la neteja
tots els recursos interns de SDL per a nosaltres.

164
00:10:15,750 --> 00:10:21,240
Així la documentació allà- de nou,
aquí estem en la inicialització

165
00:10:21,240 --> 00:10:23,640
i apagar la secció
de la documentació.

166
00:10:23,640 --> 00:10:26,680
Vostè només pot fer clic a la
funció aquí, SDL deixar de fumar,

167
00:10:26,680 --> 00:10:28,700
i vostè pot llegir tot sobre això també.

168
00:10:28,700 --> 00:10:31,400
I moltes d'aquestes funcions
pàgines de documentació

169
00:10:31,400 --> 00:10:35,630
tenir exemple de codi, de manera que aquest
és molt bon recurs.

170
00:10:35,630 --> 00:10:39,610
Definitivament passar algun temps
llegir parts d'aquesta wiki

171
00:10:39,610 --> 00:10:42,520
si vas a fer
això per a un projecte.

172
00:10:42,520 --> 00:10:43,760
>> Tot bé.

173
00:10:43,760 --> 00:10:46,590
Així que això és tot el nostre programa.

174
00:10:46,590 --> 00:10:53,935
El que podem fer ara és-- estic
va a obrir l'arxiu MAKE aquí,

175
00:10:53,935 --> 00:10:56,150
així que em vaig a prendre un
veure com funciona.

176
00:10:56,150 --> 00:10:59,500
I és una molt simple makefile,
similar al que has vist abans.

177
00:10:59,500 --> 00:11:04,010
Una de les principals diferències
és que, aquí, això

178
00:11:04,010 --> 00:11:07,870
es va a inserir el resultat de la cursa
aquesta comanda, que ja ha

179
00:11:07,870 --> 00:11:10,850
instal·lat si teniu SDL.

180
00:11:10,850 --> 00:11:13,230
I aquest és una ordre
això generarà

181
00:11:13,230 --> 00:11:16,710
algunes banderes addicionals per al compilador.

182
00:11:16,710 --> 00:11:22,050
>> A més d'això, estem donant-li
tots els comandaments habituals, així com

183
00:11:22,050 --> 00:11:23,430
aquests dos ordres.

184
00:11:23,430 --> 00:11:30,270
Així que els mànecs -lsdl2-imatge
la vinculació de la biblioteca d'imatges SDL.

185
00:11:30,270 --> 00:11:36,200
I el -lm en realitat s'encarrega de vinculació
a la biblioteca matemàtica estàndard C.

186
00:11:36,200 --> 00:11:40,630
Així que no necessitarem
els de tots els nostres arxius de C,

187
00:11:40,630 --> 00:11:43,900
però nosaltres només posem en el que podem
utilitzar el mateix arxiu MAKE per a tot,

188
00:11:43,900 --> 00:11:44,816
sense modificacions.

189
00:11:44,816 --> 00:11:46,970

190
00:11:46,970 --> 00:11:50,080
>> Aquí a les fonts,
aquest és el lloc on vol

191
00:11:50,080 --> 00:11:53,680
posar els arxius que anaves
compilar per al seu projecte.

192
00:11:53,680 --> 00:11:57,570
Però ja que cadascun dels meus C
arxius d'aquí té una funció principal,

193
00:11:57,570 --> 00:12:00,000
que va a confondre
si tots posem en.

194
00:12:00,000 --> 00:12:06,930
Així que vaig a dir simplement,
per ara, hello1_sdl.c,

195
00:12:06,930 --> 00:12:11,150
que és el que acabem de veure.

196
00:12:11,150 --> 00:12:18,740
Així que si torno més
aquí, que puc fer fer.

197
00:12:18,740 --> 00:12:22,160
I el que va fer és només
compilat que primer arxiu.

198
00:12:22,160 --> 00:12:28,780
I llavors podem escriure ./game, perquè
que és l'executable que va produir.

199
00:12:28,780 --> 00:12:31,660
I tot el que va fer va ser d'impressió
inicialització èxit.

200
00:12:31,660 --> 00:12:33,300
Així que vam fer una cosa bé.

201
00:12:33,300 --> 00:12:36,200
Però això va ser una mica avorrit,
perquè no veiem una finestra,

202
00:12:36,200 --> 00:12:37,900
res es movia.

203
00:12:37,900 --> 00:12:41,030
>> Tan gran, arribem SDL inicialitzat.

204
00:12:41,030 --> 00:12:43,520
Ara, anem a passar a alguna cosa
una mica més interessant.

205
00:12:43,520 --> 00:12:54,700
Així que aquí tenim hello2_window.c, i
això serà una mica més

206
00:12:54,700 --> 00:13:00,010
programa en C complexa que
inicialitza SDL igual que abans,

207
00:13:00,010 --> 00:13:04,250
excepte que ara també anem
per inicialitzar el temporitzador SDL.

208
00:13:04,250 --> 00:13:07,720
I això ens va a permetre
accedir al temporitzador intern

209
00:13:07,720 --> 00:13:10,550
i funcions d'ús en relació amb el temps.

210
00:13:10,550 --> 00:13:11,920
>> I després anem a veure aquí sota.

211
00:13:11,920 --> 00:13:16,840
El que fem és que tenim aquest punter
a una finestra struct SDL, que

212
00:13:16,840 --> 00:13:21,160
serà creat per la present convocatòria
a la funció, SDL crear finestra.

213
00:13:21,160 --> 00:13:25,380
Ara, això pren molt dels arguments,
així que anirem a buscar la documentació.

214
00:13:25,380 --> 00:13:27,930
Així que de nou, vaig a
API per categoria, estic

215
00:13:27,930 --> 00:13:33,820
baixar al vídeo aquí, i la primera
secció, que mostra la gestió de finestres.

216
00:13:33,820 --> 00:13:36,470
Així que aquesta secció té
un munt de coses en ella,

217
00:13:36,470 --> 00:13:39,970
però si es mira a través
aquestes funcions, se li

218
00:13:39,970 --> 00:13:43,620
veure que, probablement, la qual
volen que es diu SDL crear finestra,

219
00:13:43,620 --> 00:13:46,600
que passa a ser just al cim.

220
00:13:46,600 --> 00:13:49,080
>> I pel que aquest és el
documentació per a aquesta funció.

221
00:13:49,080 --> 00:13:53,710
La finestra tindrà un títol,
una posició xiy a la pantalla,

222
00:13:53,710 --> 00:13:56,960
que tindrà una amplada, alçada,
i després es va a prendre algunes banderes.

223
00:13:56,960 --> 00:14:01,220
Ara, en realitat no importa
qualsevol d'aquestes banderes en aquest moment,

224
00:14:01,220 --> 00:14:04,560
però si volia fer alguna cosa
com fer una finestra de pantalla completa,

225
00:14:04,560 --> 00:14:07,920
vostè pot fer una ullada a això.

226
00:14:07,920 --> 00:14:13,190
Per ara, només anem
per utilitzar aquests valors especials,

227
00:14:13,190 --> 00:14:18,775
Finestra de SDL, més centrada
per x i y per tal

228
00:14:18,775 --> 00:14:21,800
només crear la finestra
al centre de la nostra pantalla.

229
00:14:21,800 --> 00:14:24,370
>> Així que això és el que està fent.

230
00:14:24,370 --> 00:14:27,960
I si la finestra passa a ser
nul·la, el que significa que hi ha un error,

231
00:14:27,960 --> 00:14:32,570
després una altra vegada només anem a
imprimir l'error utilitzant error get SDL.

232
00:14:32,570 --> 00:14:36,570
I després, ja hem inicialitzat
SDL, ara hem de tancar-la.

233
00:14:36,570 --> 00:14:40,900
Així que anomenem SDL renunciar abans
lliurament d'un principal.

234
00:14:40,900 --> 00:14:42,905
>> Així que tenim aquesta finestra oberta amb sort.

235
00:14:42,905 --> 00:14:44,613
I el que anem
de fer és que anem

236
00:14:44,613 --> 00:14:50,340
cridar SDL per a 5.000 mil·lisegons,
que és el mateix que cinc segons.

237
00:14:50,340 --> 00:14:55,640
I quan hàgim acabat amb això,
que va a destruir la finestra,

238
00:14:55,640 --> 00:14:59,470
netejar la biblioteca SDL,
i sortir del programa.

239
00:14:59,470 --> 00:15:05,240
Així que seguirem endavant i donar-li que un tret.

240
00:15:05,240 --> 00:15:08,660
>> Així que ara en lloc de canviar
el makefile cada vegada,

241
00:15:08,660 --> 00:15:12,180
Jo simplement no puc fer, i
a continuació, en la línia d'ordres,

242
00:15:12,180 --> 00:15:16,090
diuen les fonts és igual i després
l'arxiu que estem compilant.

243
00:15:16,090 --> 00:15:17,090
Així que és hello2_window.c.

244
00:15:17,090 --> 00:15:21,390

245
00:15:21,390 --> 00:15:21,890
Fantàstic.

246
00:15:21,890 --> 00:15:22,970
No hi ha erros.

247
00:15:22,970 --> 00:15:26,085
Ara bé, si correm la nostra executable,
veiem aquesta finestra.

248
00:15:26,085 --> 00:15:27,960
Ara hi ha uns pocs
problemes amb la finestra.

249
00:15:27,960 --> 00:15:32,820
Podem moure-ho, però té
aquestes escombraries de fons dins de la mateixa.

250
00:15:32,820 --> 00:15:34,660
Així que no hem dibuixat
res, i pel que és

251
00:15:34,660 --> 00:15:38,210
només plena d'escombraries, que
és bastant més del que esperem.

252
00:15:38,210 --> 00:15:41,010
>> D'altra banda, no podem tancar la finestra.

253
00:15:41,010 --> 00:15:44,780
Estic pressionant aquest X a la
cantonada i no passa res.

254
00:15:44,780 --> 00:15:47,840
Així que veurem com arreglar
que en una mica.

255
00:15:47,840 --> 00:15:51,750
Així que anem a resoldre la part on el
finestra està plena d'escombraries en primer lloc.

256
00:15:51,750 --> 00:16:00,850
Així que si anem a hello3_image.c, el
podem veure és que hem afegit uns quants

257
00:16:00,850 --> 00:16:03,360
més coses aquí.

258
00:16:03,360 --> 00:16:08,740
Hem afegit aquesta nova capçalera
presentar per obtenir les funcions de temporitzador.

259
00:16:08,740 --> 00:16:11,490
Suposo que ho vam fer en el passat
un, també, i jo no esmento.

260
00:16:11,490 --> 00:16:13,550
Però ara perquè som
treballar amb imatges,

261
00:16:13,550 --> 00:16:18,720
necessitem incloure la SDL
arxiu de capçalera d'imatge també.

262
00:16:18,720 --> 00:16:22,087
Pel que és el mateix que
abans, la inicialització de SDL aquí,

263
00:16:22,087 --> 00:16:23,420
mateix acord amb la creació de finestres.

264
00:16:23,420 --> 00:16:25,380
Hem vist que abans d'ara.

265
00:16:25,380 --> 00:16:29,870
>> Ara hem de crear alguna cosa que es diu
un processador, que tipus de va de la mà

266
00:16:29,870 --> 00:16:30,800
amb la finestra.

267
00:16:30,800 --> 00:16:33,860
Però és una espècie de
abstracte objecte que és

268
00:16:33,860 --> 00:16:37,370
a càrrec de fer tot això
operacions de dibuix a la finestra.

269
00:16:37,370 --> 00:16:41,580
I el que realment correspon
a un programa carregat

270
00:16:41,580 --> 00:16:47,880
en el maquinari de gràfics en la seva
ordinador o el telèfon o el que sigui.

271
00:16:47,880 --> 00:16:51,005
Així que les banderes que volem passar it--
i es pot veure a la documentació

272
00:16:51,005 --> 00:16:56,160
per obtenir més detall aquí-- van
SDL que es rendeixi accelerat, que

273
00:16:56,160 --> 00:16:58,550
vol dir que serà
utilitzant el maquinari de gràfics

274
00:16:58,550 --> 00:17:01,490
i no només emulat en programari.

275
00:17:01,490 --> 00:17:07,390
>> I utilitzarem
SDL Renderer PRESENTVSYNC.

276
00:17:07,390 --> 00:17:12,280
VSync és una cosa que simplement fa
seus gràfics es veuen millor i evita

277
00:17:12,280 --> 00:17:14,970
aquesta pantalla cosa anomenada
terror, on la meitat

278
00:17:14,970 --> 00:17:17,720
d'una trama i un mitjà de la següent
marc es veuen immersos en el mateix temps

279
00:17:17,720 --> 00:17:20,056
i es veu horrible.

280
00:17:20,056 --> 00:17:23,130
Però, de nou, vostè pot anar a llegir
d'això pel seu compte.

281
00:17:23,130 --> 00:17:24,319
>> Així que tenim algunes banderes aquí.

282
00:17:24,319 --> 00:17:27,810
I pel que només anem a trucar
aquesta funció SDL crear render.

283
00:17:27,810 --> 00:17:31,340
Anem a donar-li la finestra
associar amb aquest processador.

284
00:17:31,340 --> 00:17:34,520
Un aspecte negatiu significa que no ens importa el que
controlador de gràfics que utilitzarem.

285
00:17:34,520 --> 00:17:36,603
Així que en cas de més o menys
sempre ser un negatiu,

286
00:17:36,603 --> 00:17:39,010
llevat que sàpiga sobre els controladors de gràfics.

287
00:17:39,010 --> 00:17:41,650
I llavors només anem
passar-ho les nostres banderes.

288
00:17:41,650 --> 00:17:47,240
Així que si això retorna null, llavors estem
va imprimir l'error, com de costum,

289
00:17:47,240 --> 00:17:49,550
però llavors també anem
per destruir la finestra

290
00:17:49,550 --> 00:17:54,970
per netejar aquests recursos abans
trucant SDL deixar de fumar i tornar.

291
00:17:54,970 --> 00:17:58,110
>> Ara, l'interessant aquí
és on ens carreguem la nostra imatge

292
00:17:58,110 --> 00:18:00,870
utilitzar aquesta funció IMG_load.

293
00:18:00,870 --> 00:18:04,050
Aquesta és l'única funció que anem
utilitzar de la biblioteca d'imatges SDL.

294
00:18:04,050 --> 00:18:05,480
És l'únic que necessitem.

295
00:18:05,480 --> 00:18:12,950
És una funció que pren la cadena
aquest és el camí de qualsevol recurs d'imatge.

296
00:18:12,950 --> 00:18:18,024
I pot ser un .png, un GIF,
mapa de bits, cap d'aquestes coses.

297
00:18:18,024 --> 00:18:19,690
I és per això que aquesta funció és tan agradable.

298
00:18:19,690 --> 00:18:22,560
Es pot gestionar gairebé qualsevol format.

299
00:18:22,560 --> 00:18:27,240
Càrrega en la memòria i l'emmagatzema
com ho diu una superfície SDL.

300
00:18:27,240 --> 00:18:34,660
>> Ara una superfície SDL és merament una estructura
que representa les dades d'imatge en la memòria.

301
00:18:34,660 --> 00:18:38,054
Així que vostè pot llegir més sobre
que en la documentació de dos.

302
00:18:38,054 --> 00:18:40,720
I si aquest error, llavors estem
farem tot l'assumpte, on

303
00:18:40,720 --> 00:18:44,480
imprimim l'error, tanquem la nostra
recursos i, a continuació, sortir del programa.

304
00:18:44,480 --> 00:18:48,970
Ara l'interessant és, abans
podem treure aquesta imatge a la finestra,

305
00:18:48,970 --> 00:18:51,390
hem de fer realment una textura.

306
00:18:51,390 --> 00:18:54,460
Ara una textura correspon
a les dades d'imatge carregats

307
00:18:54,460 --> 00:18:57,820
en la memòria del maquinari del gràfic.

308
00:18:57,820 --> 00:19:00,720
>> Així que una superfície és en main
la memòria, la memòria normal

309
00:19:00,720 --> 00:19:05,550
que hem estat utilitzant tot el semestre,
i una textura és en aquest VRAM separada

310
00:19:05,550 --> 00:19:09,410
memòria que els controls de la targeta gràfica.

311
00:19:09,410 --> 00:19:13,170
Així que cridem a aquesta funció
SDL_CreateTextureFromSurface.

312
00:19:13,170 --> 00:19:17,104
Li donem el nostre processador i la nostra superfície.

313
00:19:17,104 --> 00:19:19,020
I llavors estem realment
fet amb la superfície,

314
00:19:19,020 --> 00:19:20,311
així que només anem a alliberar-lo.

315
00:19:20,311 --> 00:19:22,210
Nosaltres no ho necessitem més.

316
00:19:22,210 --> 00:19:26,650
I llavors el que si aquesta crida
amb error i va tornar nul·la,

317
00:19:26,650 --> 00:19:29,630
llavors nosaltres farem tot
informe d'errors cosa una altra vegada.

318
00:19:29,630 --> 00:19:30,920
>> Tot bé.

319
00:19:30,920 --> 00:19:34,810
Aquí, ens fiquem en algun
funcions de renderitzat reals.

320
00:19:34,810 --> 00:19:37,730
Així que cridar SDL_RenderClear
i passant-ho

321
00:19:37,730 --> 00:19:42,550
el processador associat amb la finestra
simplement fa que la finestra veu negre.

322
00:19:42,550 --> 00:19:47,650
Per tant, elimina aquestes escombraries que va veure en
la nostra finestra abans i fa que sigui negre.

323
00:19:47,650 --> 00:19:50,750
I després anem
cridar SDL_RenderCopy,

324
00:19:50,750 --> 00:19:53,010
donar-li el nostre processador, la nostra textura.

325
00:19:53,010 --> 00:19:55,800
I anem a parlar del que
aquests camps estan en una mica.

326
00:19:55,800 --> 00:19:57,830
Però això va a
prendre les dades de textura

327
00:19:57,830 --> 00:20:03,100
i copiar-lo en la nostra
finestra per dibuixar la imatge.

328
00:20:03,100 --> 00:20:07,020
Així que després del que hem fet aquesta còpia
les dades a la nostra finestra,

329
00:20:07,020 --> 00:20:11,180
que hem de fer aquesta funció addicional
anomenada SDL_RenderPresent.

330
00:20:11,180 --> 00:20:15,360
>> I això és interessant
perquè això es posa

331
00:20:15,360 --> 00:20:18,770
en un tema anomenat doble buffer.

332
00:20:18,770 --> 00:20:24,380
Així que la memòria intermèdia doble és una tècnica que
fa que els seus gràfics es veuen molt millor.

333
00:20:24,380 --> 00:20:28,240
Un cop més, impedeix que l'estrip de pantalla
Jo estava parlant d'abans, on

334
00:20:28,240 --> 00:20:29,590
té dos buffers.

335
00:20:29,590 --> 00:20:32,260
Hi ha una memòria intermèdia de tornada a
memòria i un tampó frontal.

336
00:20:32,260 --> 00:20:36,410
El tampó front és literalment
el que està a la pantalla en el moment.

337
00:20:36,410 --> 00:20:42,070
Així que fem totes aquestes variacions es basen,
com SDL fer còpia o SDL_RenderClear

338
00:20:42,070 --> 00:20:43,080
a la memòria intermèdia de tornada.

339
00:20:43,080 --> 00:20:44,800
Així que es modifiquen les coses
en la memòria intermèdia per servei.

340
00:20:44,800 --> 00:20:48,970
Aquí podríem estar dibuixant aquest
quadrat verd en la memòria intermèdia d'esquena.

341
00:20:48,970 --> 00:20:52,300
>> Així que quan acabem fent
els nostres render operacions, que

342
00:20:52,300 --> 00:20:55,700
podria prendre un temps molt llarg
temps, què farem

343
00:20:55,700 --> 00:20:57,860
és canviar els amortidors.

344
00:20:57,860 --> 00:21:00,720
Així que, literalment, només pren el
memòria intermèdia frontal i la memòria intermèdia de reserva

345
00:21:00,720 --> 00:21:02,990
i els interruptors, per la qual
que, instantàniament,

346
00:21:02,990 --> 00:21:06,630
en una sola operació, en lloc de
potser centenars o milers,

347
00:21:06,630 --> 00:21:10,910
tot el nostre recent prestats
amb objectes sobre la pantalla.

348
00:21:10,910 --> 00:21:13,160
I això impedeix que les coses
com el refrescant pantalla

349
00:21:13,160 --> 00:21:16,710
mitjà quan només hem dibuixat
dels nostres objectes per al marc.

350
00:21:16,710 --> 00:21:21,280
Així que per això hem de trucar
SDL_RenderPresent, així

351
00:21:21,280 --> 00:21:23,320
com SDL_RenderCopy.

352
00:21:23,320 --> 00:21:25,749
>> Un cop més, només anem
d'esperar cinc segons.

353
00:21:25,749 --> 00:21:27,540
Llavors anem a
netejar els nostres recursos.

354
00:21:27,540 --> 00:21:29,540
Tenim uns quants més en aquesta ocasió.

355
00:21:29,540 --> 00:21:31,750
I llavors només anem
per sortir del programa.

356
00:21:31,750 --> 00:21:35,350
Així que anem a fer això.

357
00:21:35,350 --> 00:21:41,880
Vaig a escriure marca, i després les fonts
és igual a hello-- això és ara 3image.c.

358
00:21:41,880 --> 00:21:49,632

359
00:21:49,632 --> 00:21:52,240
Molt bé, que compila sense errors.

360
00:21:52,240 --> 00:21:57,210
I es pot veure aquí tinc ara
tret la meva imatge, Hola, CS50!

361
00:21:57,210 --> 00:22:00,560
a la nostra finestra, que
desapareix després de cinc segons.

362
00:22:00,560 --> 00:22:02,090
>> Ara, això encara té problemes, oi?

363
00:22:02,090 --> 00:22:05,750
Això no és una bona aplicació,
perquè quan tracte de tancar la finestra,

364
00:22:05,750 --> 00:22:06,500
no passa res.

365
00:22:06,500 --> 00:22:09,540
Això x encara no respon.

366
00:22:09,540 --> 00:22:17,420
Així que donem una ullada a la
següent arxiu, hello4animation.

367
00:22:17,420 --> 00:22:21,850
Així que aquest és l'arxiu
això va a introduir

368
00:22:21,850 --> 00:22:25,124
moviment i moviment a la nostra imatge.

369
00:22:25,124 --> 00:22:27,040
Així que anem a fer el
el mateix que abans,

370
00:22:27,040 --> 00:22:30,190
iniciar SDL, creu el
finestra, crear el processador,

371
00:22:30,190 --> 00:22:33,030
carregar la imatge en
memòria, crear la textura.

372
00:22:33,030 --> 00:22:35,090
Hem vist tot això abans.

373
00:22:35,090 --> 00:22:36,770
Ara, això és nou.

374
00:22:36,770 --> 00:22:42,305
Tindrem una estructura anomenada
1 rect SDL, que és només un rectangle.

375
00:22:42,305 --> 00:22:49,950
Si anem per aquí, podem
fer una recerca de SDL rect,

376
00:22:49,950 --> 00:22:54,040
i es pot veure que és un
estructura molt simple.

377
00:22:54,040 --> 00:22:56,760
Compta amb una x, a i per
la posició, i

378
00:22:56,760 --> 00:23:02,080
té una amplada i una alçada de
la mida del rectangle.

379
00:23:02,080 --> 00:23:07,785
>> Llavors, què farem és que estem
va definir aquesta SDL rect dest,

380
00:23:07,785 --> 00:23:09,480
per a la destinació.

381
00:23:09,480 --> 00:23:14,130
I aquest és el lloc
a la pantalla on

382
00:23:14,130 --> 00:23:16,005
estarem arribant
la nostra imatge, a la dreta Així

383
00:23:16,005 --> 00:23:17,880
si serem
movent la imatge voltant,

384
00:23:17,880 --> 00:23:20,300
llavors el destí on
anem a dibuixar la imatge

385
00:23:20,300 --> 00:23:22,620
s'han de moure.

386
00:23:22,620 --> 00:23:24,910
Així que anem a trucar a aquest
SDL_QueryTexture funció.

387
00:23:24,910 --> 00:23:27,550

388
00:23:27,550 --> 00:23:33,500
I noto que estic passant la direcció
de dest.w, que és l'ample,

389
00:23:33,500 --> 00:23:36,950
i dest.h, que és l'altura.

390
00:23:36,950 --> 00:23:40,425
I així SDL_QueryTexture va
emmagatzemar en aquests camps de l'amplada

391
00:23:40,425 --> 00:23:41,675
i l'altura de la nostra textura.

392
00:23:41,675 --> 00:23:44,680

393
00:23:44,680 --> 00:23:47,030
>> I llavors el que vaig
de fer és que vaig

394
00:23:47,030 --> 00:23:55,580
per establir dest.x finestra per a ser
dest.w menys amplada, que és

395
00:23:55,580 --> 00:23:59,000
l'amplada de la sprite, dividit per 2.

396
00:23:59,000 --> 00:24:03,860
I això va a configurar-
que la imatge està perfectament centrada

397
00:24:03,860 --> 00:24:06,780
a la nostra finestra, ¿d'acord?

398
00:24:06,780 --> 00:24:08,652
Així que ara tinc una posició i.

399
00:24:08,652 --> 00:24:10,360
I això va a
ser una variable que és

400
00:24:10,360 --> 00:24:16,390
canviar, perquè serem
moure la imatge a la direcció i.

401
00:24:16,390 --> 00:24:19,050
I ara tenim una mica
anomenat un bucle d'animació.

402
00:24:19,050 --> 00:24:21,180
>> Llavors, com funciona l'animació?

403
00:24:21,180 --> 00:24:27,630
Bé, ull humà pot detectar 12 diferent
imatges en cada segon, ¿d'acord?

404
00:24:27,630 --> 00:24:33,060
Així que si vostè flash 12 targetes d'imatge de mi
en un segon, vaig veure a cadascuna d'aquestes imatges

405
00:24:33,060 --> 00:24:35,950
com la seva pròpia imatge individu diferent.

406
00:24:35,950 --> 00:24:39,690
Ara, si vostè flaix més
imatges a mi en un segon,

407
00:24:39,690 --> 00:24:42,140
llavors el meu ull començaria
a desdibuixar junts

408
00:24:42,140 --> 00:24:46,920
i em percebre com a moviment,
en lloc d'una imatge diferent.

409
00:24:46,920 --> 00:24:51,930
Així, per exemple, les pel·lícules i la televisió,
parpellegen imatges en vostè 24 vegades

410
00:24:51,930 --> 00:24:52,570
un segon.

411
00:24:52,570 --> 00:24:55,110
Així que això és 24 fotogrames per segon.

412
00:24:55,110 --> 00:25:00,136
Les pantalles d'ordinador, d'altra banda,
sovint són a 60 quadres per segon.

413
00:25:00,136 --> 00:25:01,260
Aquesta és la seva velocitat de refresc.

414
00:25:01,260 --> 00:25:04,650
Aquesta és la freqüència amb què s'actualitzen
la imatge a la pantalla.

415
00:25:04,650 --> 00:25:08,960
Així que el nostre objectiu serà 60
fotogrames per segon per als nostres jocs.

416
00:25:08,960 --> 00:25:11,770

417
00:25:11,770 --> 00:25:13,710
>> Així que anem a veure que en el codi.

418
00:25:13,710 --> 00:25:19,064
Així que per a cada quadre, estem primer
va esborrar la finestra.

419
00:25:19,064 --> 00:25:20,230
Aquest és el patró general.

420
00:25:20,230 --> 00:25:22,450
Sempre es desactiva la
finestra de cada quadre, i després

421
00:25:22,450 --> 00:25:25,210
fer tot del seu dibuix
operacions, i després, al final,

422
00:25:25,210 --> 00:25:29,610
Què RenderPresent per mostrar
tot en el marc.

423
00:25:29,610 --> 00:25:33,910
I després vas a
haver d'esperar al final

424
00:25:33,910 --> 00:25:36,340
d'esperar fins a la propera
marc ha de començar.

425
00:25:36,340 --> 00:25:38,650
>> Així que si jo estava fent una gran quantitat de
computació complexa aquí

426
00:25:38,650 --> 00:25:43,100
que va tenir més de 16 milisegons,
seria impossible per a mi

427
00:25:43,100 --> 00:25:46,890
per aconseguir que la velocitat de fotogrames de 60 que
Jo volia, perquè cada quadre és

428
00:25:46,890 --> 00:25:48,750
prenent massa temps per calcular.

429
00:25:48,750 --> 00:25:52,340
A més, realment estem fent
tipus d'una quantitat insignificant de treball

430
00:25:52,340 --> 00:25:54,820
aquí, perquè només hi ha
una cosa que estem dibuixant.

431
00:25:54,820 --> 00:25:59,390
Així que només espero 1/60 de
segon, que és la longitud

432
00:25:59,390 --> 00:26:01,520
d'una trama en entre fotogrames.

433
00:26:01,520 --> 00:26:05,610
Així que estic espècie de pretendre fer
tot el meu treball requereix temps zero.

434
00:26:05,610 --> 00:26:09,050
Però en un joc real,
caldria restar

435
00:26:09,050 --> 00:26:13,760
la quantitat de temps que es va trigar a fer-ho
tot aquest treball del seu temps de descans.

436
00:26:13,760 --> 00:26:16,970
>> Així que de totes maneres, ¿què sóc jo
realment fer en aquest circuit?

437
00:26:16,970 --> 00:26:19,070
Em aclareixo la finestra.

438
00:26:19,070 --> 00:26:27,470
Vaig posar el dest.y, que és un int a
la meva posició real i tirat en un int.

439
00:26:27,470 --> 00:26:32,070
Ara, vull surar resolució
per a mi i posició en el meu joc,

440
00:26:32,070 --> 00:26:34,150
però llavors per realment
dibuixar a la pantalla,

441
00:26:34,150 --> 00:26:39,070
que necessita sencers, perquè és en unitats de
píxels, de manera que això és el que l'elenc és per.

442
00:26:39,070 --> 00:26:41,745
Vaig a dibuixar la imatge.

443
00:26:41,745 --> 00:26:45,180
Així que aquest és el rectangle d'origen.

444
00:26:45,180 --> 00:26:47,060
I aquest és el rectangle de destinació.

445
00:26:47,060 --> 00:26:50,310
Així que vaig passar nul per
rectangle d'origen

446
00:26:50,310 --> 00:26:53,426
per dir vull cridar tota la meva textura.

447
00:26:53,426 --> 00:26:55,300
Però si hi havia un munt de
textures en el seu joc

448
00:26:55,300 --> 00:26:59,120
i tots estan en un gran mapa de textura
que es va carregar en SDL com una sola

449
00:26:59,120 --> 00:27:02,850
textura, poguessis
utilitzar un rectangle d'origen

450
00:27:02,850 --> 00:27:06,750
per recollir una de les textures més petites,
un dels sprites més petites,

451
00:27:06,750 --> 00:27:09,450
fora d'aquest gran mapa de textura.

452
00:27:09,450 --> 00:27:14,740
>> Així que de nou, estic passant el meu render, el meu
textura, i ara el destí.

453
00:27:14,740 --> 00:27:18,320
Això va ser on en el
finestra que serà dibuixat.

454
00:27:18,320 --> 00:27:21,390
I després, perquè m'estic animant
alguna cosa, necessito moviment,

455
00:27:21,390 --> 00:27:25,150
Vaig a ser l'actualització del
posició de sprites en cada fotograma.

456
00:27:25,150 --> 00:27:30,190
Així que tinc aquesta crida de desplaçament constant
accelerar en unitats de píxels per segon.

457
00:27:30,190 --> 00:27:34,320
Ara, cada vegada que fem un moviment,
el marc és només 1/60 de segon.

458
00:27:34,320 --> 00:27:36,740
Així que vaig a dividir que per 60.

459
00:27:36,740 --> 00:27:42,350
I després, anem a veure, jo sóc
restant que a partir de la posició i.

460
00:27:42,350 --> 00:27:44,470
Per què estic restant?

461
00:27:44,470 --> 00:27:46,169
Anem a arribar a això en un segon.

462
00:27:46,169 --> 00:27:48,460
Així que puc netejar els meus recursos
i el programa ha acabat.

463
00:27:48,460 --> 00:27:49,830
>> Així que anem a fer això.

464
00:27:49,830 --> 00:27:52,450

465
00:27:52,450 --> 00:28:03,570
Així que anirem a maquillatge MLRS = hello4
animation.c, ¿d'acord?

466
00:28:03,570 --> 00:28:05,720
Joc.

467
00:28:05,720 --> 00:28:06,770
Cal anar.

468
00:28:06,770 --> 00:28:12,690
Així que he de desplaçar-se fins la
finestra, que és bastant ordenada.

469
00:28:12,690 --> 00:28:17,110
Però espera, que estava restant
des de la posició i cada vegada.

470
00:28:17,110 --> 00:28:18,910
Què està passant allà?

471
00:28:18,910 --> 00:28:24,010
Bé, resulta que a SDL, i
de fet, en la majoria dels gràfics per ordinador,

472
00:28:24,010 --> 00:28:28,890
l'origen del sistema de coordenades
és la part superior esquerra de la finestra.

473
00:28:28,890 --> 00:28:34,960
>> Així que la direcció x positiva va
a través de la finestra a la dreta.

474
00:28:34,960 --> 00:28:38,110
I la direcció i positiva
en realitat disminueix.

475
00:28:38,110 --> 00:28:40,470
Així que de nou, en l'origen
la part superior esquerra de la finestra,

476
00:28:40,470 --> 00:28:46,190
direcció positiva és cap avall,
ix positiu és cap a la dreta.

477
00:28:46,190 --> 00:28:48,770
Així que quan li resta de
la posició i, això és

478
00:28:48,770 --> 00:28:52,640
farà que es vagi en el negatiu
i direcció, que és la finestra.

479
00:28:52,640 --> 00:28:55,500
Així que això és el que està passant allà.

480
00:28:55,500 --> 00:28:56,510
Fresc.

481
00:28:56,510 --> 00:28:59,240
>> Fem una ullada a la següent foto.

482
00:28:59,240 --> 00:29:05,700
Aquí està la part de la
mostrar on finalment

483
00:29:05,700 --> 00:29:08,920
aconseguir que la X a la cantonada de la finestra
que se suposa per tancar la finestra

484
00:29:08,920 --> 00:29:10,660
treballar.

485
00:29:10,660 --> 00:29:12,800
Llavors, què està passant?

486
00:29:12,800 --> 00:29:17,520
Inicialitzem SDL, crear la finestra,
crear el processador, carregar la imatge,

487
00:29:17,520 --> 00:29:19,770
crear la textura
com hem vist abans.

488
00:29:19,770 --> 00:29:26,850
Tenim el mateix rectangle de destinació
com abans, mateixa crida per consultar textura.

489
00:29:26,850 --> 00:29:29,780
Però aquesta vegada, estem llavors
va dividir l'ample

490
00:29:29,780 --> 00:29:33,110
i l'altura del nostre destí per 4.

491
00:29:33,110 --> 00:29:36,430
Això només té l'efecte de
escalar la nostra imatge cap avall quan

492
00:29:36,430 --> 00:29:39,884
mostrem a la finestra per quatre.

493
00:29:39,884 --> 00:29:40,800
Així que això és bastant ordenada.

494
00:29:40,800 --> 00:29:42,770
Només podem escalar així com així.

495
00:29:42,770 --> 00:29:45,970
Anem a començar el sprite
al centre de la pantalla.

496
00:29:45,970 --> 00:29:49,410
I ara tenim x i velocitat i, i
que estan tant va a començar de zero.

497
00:29:49,410 --> 00:29:53,740

498
00:29:53,740 --> 00:29:55,880
>> Aquest és l'arxiu incorrecte.

499
00:29:55,880 --> 00:29:56,380
Ho sento.

500
00:29:56,380 --> 00:29:57,960
Així que això és cert.

501
00:29:57,960 --> 00:30:00,170
Això és tot encara en aquest arxiu.

502
00:30:00,170 --> 00:30:03,210
Tenim el dividir per 4 i tot.

503
00:30:03,210 --> 00:30:07,830
Així que aquí tenim la nostra xii posició
per al centre de la finestra.

504
00:30:07,830 --> 00:30:12,480
I li donem una velocitat inicial
d'aquesta velocitat constant, la qual cosa

505
00:30:12,480 --> 00:30:15,180
Crec que és de 300 píxels per segon.

506
00:30:15,180 --> 00:30:19,850
Ara, tenim aquest int podríem igual de bé
ser un booleà anomenat prop sol·licitada.

507
00:30:19,850 --> 00:30:23,970
I en comptes de fer una
bucle infinit en un temporitzador aquí,

508
00:30:23,970 --> 00:30:29,180
serem com l'animació
sempre que tancament no es demana.

509
00:30:29,180 --> 00:30:30,960
>> Llavors, com processem esdeveniments?

510
00:30:30,960 --> 00:30:35,600
Bé, SDL posa en cua els esdeveniments d'un
cua literal darrere de les escenes.

511
00:30:35,600 --> 00:30:38,860
I llavors cada trama,
podem treure de la cua d'esdeveniments

512
00:30:38,860 --> 00:30:43,900
des d'aquesta cua utilitzant
aquest SDL_PullEvent trucada.

513
00:30:43,900 --> 00:30:46,730
I de nou, sens dubte veu a llegir
sobre això en la documentació.

514
00:30:46,730 --> 00:30:50,450
Hi ha molt més detall i un munt
més funcions que es poden utilitzar amb aquest.

515
00:30:50,450 --> 00:30:54,750
Ens passem la direcció
d'aquesta cosa, SDL_Event

516
00:30:54,750 --> 00:30:56,990
que tenim aquí a la pila.

517
00:30:56,990 --> 00:30:58,840
>> Ara, què és un SDL_Event?

518
00:30:58,840 --> 00:31:02,356
A causa de SDL, si ens fixem en
els documentation-- anem

519
00:31:02,356 --> 00:31:07,580
veure, API per categoria, d'entrada
esdeveniments, maneig d'esdeveniments,

520
00:31:07,580 --> 00:31:15,150
podem mirar el nombre
de diferents esdeveniments aquí

521
00:31:15,150 --> 00:31:18,600
i podem veure que hi ha
tot un munt d'ells.

522
00:31:18,600 --> 00:31:22,150
Llavors, què és aquesta cosa SDL_Event?

523
00:31:22,150 --> 00:31:28,190

524
00:31:28,190 --> 00:31:31,107
SDL_Event és una unió.

525
00:31:31,107 --> 00:31:31,940
Wow, què és un sindicat?

526
00:31:31,940 --> 00:31:33,910
Has de probablement mai
sentit a parlar d'això abans.

527
00:31:33,910 --> 00:31:35,610
I això està bé.

528
00:31:35,610 --> 00:31:39,420
>> Un sindicat és una espècie de
una estructura, a excepció d'una estructura

529
00:31:39,420 --> 00:31:41,960
té un espai per a tots
seus camps i la memòria,

530
00:31:41,960 --> 00:31:45,060
mentre que un sindicat només té
espai suficient per adaptar-se a la major

531
00:31:45,060 --> 00:31:49,660
un dels seus camps, el que significa que
només pot emmagatzemar un dels seus camps

532
00:31:49,660 --> 00:31:52,830
alhora, quin tipus de
té sentit per a esdeveniments, oi?

533
00:31:52,830 --> 00:31:55,810
Podem tenir un teclat
esdeveniment o un esdeveniment de finestra,

534
00:31:55,810 --> 00:31:59,750
però un sol esdeveniment no pot ser alhora un
esdeveniment de teclat i un esdeveniment de finestra,

535
00:31:59,750 --> 00:32:05,450
així que seria ximple tenir espai per
tant dels que estan dins de la nostra unió esdeveniment.

536
00:32:05,450 --> 00:32:07,770
Així que si vostè volia
crear el seu propi sindicat,

537
00:32:07,770 --> 00:32:10,020
es veu exactament el mateix
com la creació d'una estructura,

538
00:32:10,020 --> 00:32:14,140
excepte que s'utilitza la paraula clau unió
en lloc de la paraula clau struct.

539
00:32:14,140 --> 00:32:17,490
I recorda, per la totalitat de la
coses dins del seu sindicat,

540
00:32:17,490 --> 00:32:22,020
la variable real que és la unió
només pot tenir un d'aquests valors

541
00:32:22,020 --> 00:32:24,780
en un moment.

542
00:32:24,780 --> 00:32:29,940
>> Llavors, com podem saber quin tipus d'esdeveniment
ens vam ficar fora d'aquesta cua?

543
00:32:29,940 --> 00:32:33,370
Bé, podem provar Event.type.

544
00:32:33,370 --> 00:32:35,792
I si això és igual
a SDL_Quit, sabem

545
00:32:35,792 --> 00:32:37,500
és el cas que
es va generar quan

546
00:32:37,500 --> 00:32:39,510
colpejar aquesta X a la cantonada de la finestra.

547
00:32:39,510 --> 00:32:44,270
I podem establir estreta sol·licitada és igual a 1.

548
00:32:44,270 --> 00:32:47,230
La resta és només una mica d'animació
que has vist abans.

549
00:32:47,230 --> 00:32:52,802
Així que seguirem endavant i fer
això i veure el bé que funciona.

550
00:32:52,802 --> 00:32:55,135
Així que vaig a escriure marca i
llavors MLRS = hello5_events.c.

551
00:32:55,135 --> 00:33:03,760

552
00:33:03,760 --> 00:33:04,770
Allà anem.

553
00:33:04,770 --> 00:33:05,780
Jocs.

554
00:33:05,780 --> 00:33:08,920
>> Ara, podem veure que era
de fet reduït per quatre.

555
00:33:08,920 --> 00:33:10,360
I ara està rebotant.

556
00:33:10,360 --> 00:33:14,630
Tinc una mica de detecció de col·lisions
passant amb els costats de la finestra

557
00:33:14,630 --> 00:33:16,840
que podem fer una ullada a.

558
00:33:16,840 --> 00:33:21,190
¿I què passa quan vaig a tancar-?

559
00:33:21,190 --> 00:33:22,120
Es tanca.

560
00:33:22,120 --> 00:33:22,740
Fantàstic.

561
00:33:22,740 --> 00:33:24,290
Vam rebre aquest esdeveniment.

562
00:33:24,290 --> 00:33:26,630
I ho fem servir.

563
00:33:26,630 --> 00:33:30,730
>> Així que anem a mirar cap enrere en el codi.

564
00:33:30,730 --> 00:33:33,020
Llavors, Com el puc aconseguir
rebotant així?

565
00:33:33,020 --> 00:33:37,200
Recordeu em vaig posar dos xi
i inicialment a les velocitats.

566
00:33:37,200 --> 00:33:39,260
I la velocitat és positiva
constant, per la qual cosa és

567
00:33:39,260 --> 00:33:42,680
va a aconseguir que s'està començant
anar cap avall ia la dreta.

568
00:33:42,680 --> 00:33:45,680

569
00:33:45,680 --> 00:33:50,310
>> Ara, cada trama, a més de la manipulació
qualsevol esdeveniment que pugui haver ocorregut,

570
00:33:50,310 --> 00:33:57,520
Vaig a detectar si el meu sprites
està tractant de sortir de la finestra.

571
00:33:57,520 --> 00:34:03,610
Pel que podem fer això amb només comprovar
x_pos amb 0, pos_y 0, a continuació,

572
00:34:03,610 --> 00:34:07,370
també x_pos i pos_y amb
amplada de la finestra i altura de la finestra.

573
00:34:07,370 --> 00:34:11,010
Cal notar que he resti
l'ample del sprite.

574
00:34:11,010 --> 00:34:14,090
I això es deu al fet que si no ho feia
restar l'amplada del sprite,

575
00:34:14,090 --> 00:34:17,760
només seria comprovar que
l'origen del sprite

576
00:34:17,760 --> 00:34:19,690
no anar fora de la finestra.

577
00:34:19,690 --> 00:34:21,480
Però volem que la totalitat
ample del sprite

578
00:34:21,480 --> 00:34:24,030
per estar sempre dins de la finestra i
tota l'altura del sprite

579
00:34:24,030 --> 00:34:25,321
per estar sempre dins de la finestra.

580
00:34:25,321 --> 00:34:27,429
Així que això és el que la resta és per.

581
00:34:27,429 --> 00:34:30,080
Una gran quantitat de geometria aquí pot
ser d'utilitat per treure-

582
00:34:30,080 --> 00:34:33,929
en paper amb la coordenada
sistema per veure el que està passant.

583
00:34:33,929 --> 00:34:38,090
>> Així que si em xoquen, jo només
simplement restablir la posició

584
00:34:38,090 --> 00:34:41,400
de manera que no es va
fora de la pantalla.

585
00:34:41,400 --> 00:34:47,179
I jo vaig a, si rebota
en una de les parets laterals,

586
00:34:47,179 --> 00:34:51,469
Vaig a negar la
x velocitat de manera que

587
00:34:51,469 --> 00:34:53,210
comença rebotant en l'altra direcció.

588
00:34:53,210 --> 00:34:56,210
I de manera similar, si colpeja
la part superior o inferior,

589
00:34:56,210 --> 00:34:59,820
Vaig a establir la velocitat i
igual a la velocitat i negativa,

590
00:34:59,820 --> 00:35:01,690
de manera que es recuperarà.

591
00:35:01,690 --> 00:35:03,860
Així que això és el que tenim això aquí.

592
00:35:03,860 --> 00:35:07,560
>> I les posicions d'actualització
de la mateixa manera que hem vist abans,

593
00:35:07,560 --> 00:35:12,510
dividir per 60, perquè som
només el maneig d'1/60 d'un segon.

594
00:35:12,510 --> 00:35:15,750
I llavors la representació,
exactament el mateix que abans.

595
00:35:15,750 --> 00:35:19,810
I això és tot
que anava en aquest arxiu.

596
00:35:19,810 --> 00:35:22,490
Així que això és el que fem esdeveniments.

597
00:35:22,490 --> 00:35:29,260
El més important per portar aquí
És aquesta funció SDL_PullEvent.

598
00:35:29,260 --> 00:35:33,020
I vostè hauria de llegir el
documentació més sobre SDL_Event

599
00:35:33,020 --> 00:35:38,630
el sindicat, ja que aquest tipus de dades és
molt, molt important, perquè la fem servir

600
00:35:38,630 --> 00:35:40,690
per a tot tipus d'esdeveniments.

601
00:35:40,690 --> 00:35:46,539
>> Per exemple, la utilitzem per al teclat
esdeveniments, que és el que aquest arxiu és per.

602
00:35:46,539 --> 00:35:47,330
Llavors, què tenim?

603
00:35:47,330 --> 00:35:50,180
Tenim el mateix que abans,
inicialitzar SDL, crear una finestra,

604
00:35:50,180 --> 00:35:55,260
crear un render, carregar la imatge
en la memòria, crear la textura.

605
00:35:55,260 --> 00:36:00,530
Un cop més, anem a
tenir aquest dest rectangle,

606
00:36:00,530 --> 00:36:04,890
anem a escalar la imatge
per quatre, que sigui una mica més petit.

607
00:36:04,890 --> 00:36:08,000
Ara, anem a iniciar el
sprite al centre de la pantalla.

608
00:36:08,000 --> 00:36:12,090
Però aquesta vegada, anem a establir el
x i velocitats inicials I a zero,

609
00:36:12,090 --> 00:36:15,140
pel fet que el teclat és
va a controlar aquests.

610
00:36:15,140 --> 00:36:18,900
I, a més, anem a
realitzar un seguiment d'aquestes variables

611
00:36:18,900 --> 00:36:20,450
amunt, avall, esquerra i dreta.

612
00:36:20,450 --> 00:36:23,090
I això seguirà
seguiment de si ens hem

613
00:36:23,090 --> 00:36:27,370
pressiona els botons del teclat que
corresponen a dalt, a baix, esquerra,

614
00:36:27,370 --> 00:36:28,460
i la dreta.

615
00:36:28,460 --> 00:36:32,440
>> Ara, això és una espècie de luxe
perquè podem usar W, A, S,

616
00:36:32,440 --> 00:36:35,480
D aquí, o les tecles de fletxa reals.

617
00:36:35,480 --> 00:36:38,590
Anem a veure que en tan sols un segon.

618
00:36:38,590 --> 00:36:41,140
Així que anem a processar
l'esdeveniment de la mateixa manera que abans.

619
00:36:41,140 --> 00:36:42,530
Tirem l'esdeveniment.

620
00:36:42,530 --> 00:36:45,840
Però ara anem a
canviar el tipus d'esdeveniment.

621
00:36:45,840 --> 00:36:47,710
Si és SDL_Quit, estem
va a establir prop

622
00:36:47,710 --> 00:36:49,990
sol·licitat a un, igual que abans.

623
00:36:49,990 --> 00:36:52,315
Que s'encarrega de les x en
la cantonada de la finestra,

624
00:36:52,315 --> 00:36:55,050
de manera que la nostra finestra en realitat es tanca.

625
00:36:55,050 --> 00:37:00,110
>> Altrament, si aconseguim una clau SDL baix
esdeveniment, el que significa que prem una tecla,

626
00:37:00,110 --> 00:37:04,470
llavors el que farem és que estem
canviarà en aquesta cosa aquí,

627
00:37:04,470 --> 00:37:11,370
designant totes ho event.key
significa tractar a la nostra unió esdeveniment,

628
00:37:11,370 --> 00:37:15,490
anar a buscar la clau
estructura d'esdeveniments en el mateix.

629
00:37:15,490 --> 00:37:18,810
Així que resulta que aquesta
unió és una estructura esdeveniment clau.

630
00:37:18,810 --> 00:37:22,820
I després anar a la clau
L'estructura de l'esdeveniment el seu camp

631
00:37:22,820 --> 00:37:26,140
anomenada keysym i després scancode.

632
00:37:26,140 --> 00:37:29,480
I de nou, sens dubte llegir
la documentació sobre això.

633
00:37:29,480 --> 00:37:31,220
Entrades de paraules clau molt interessant.

634
00:37:31,220 --> 00:37:34,020
Vostè pot obtenir els codis d'exploració o codis clau.

635
00:37:34,020 --> 00:37:38,590
I és una mica subtil, però
la documentació és bastant bo.

636
00:37:38,590 --> 00:37:43,380
>> Així que si veiem el codi d'exploració per
la nostra premsa clau és W o amunt,

637
00:37:43,380 --> 00:37:45,450
anem a configurar de la mateixa a 1.

638
00:37:45,450 --> 00:37:47,240
I llavors vam sortir d'aquest interruptor.

639
00:37:47,240 --> 00:37:52,980
Si es tracta d'una o d'esquerra, que ajusti l'esquerra a 1, et
etc., etc., per sota ia la dreta.

640
00:37:52,980 --> 00:37:57,080
Ara, en aquest interruptor extern,
si veiem una clau fins esdeveniment,

641
00:37:57,080 --> 00:38:00,730
això vol dir que hem llançat una clau
i ja no estem pressionant.

642
00:38:00,730 --> 00:38:05,380
Així que vaig a dir per igual a 0,
esquerra és igual a 0, a baix és igual a 0, a la dreta

643
00:38:05,380 --> 00:38:08,260
és igual a 0, etcètera.

644
00:38:08,260 --> 00:38:12,070
>> I noti que tenim en cadascuna d'elles
2 casos posen un al costat de l'altre

645
00:38:12,070 --> 00:38:14,490
sense codi separat
per al primer cas, que

646
00:38:14,490 --> 00:38:18,180
vol dir que si es tracta de
1 S o baix a la dreta aquí,

647
00:38:18,180 --> 00:38:20,520
que va a executar aquest codi.

648
00:38:20,520 --> 00:38:22,090
Així que això és bastant pràctic.

649
00:38:22,090 --> 00:38:24,830
Impedeix que haguem de fer més
condicions i IFS i coses

650
00:38:24,830 --> 00:38:26,980
així.

651
00:38:26,980 --> 00:38:29,420
>> Així que anem a
determinar la velocitat.

652
00:38:29,420 --> 00:38:31,020
Fixem la velocitat a 0.

653
00:38:31,020 --> 00:38:33,910
Llavors, si es pressiona fins
i no cap avall, llavors nosaltres

654
00:38:33,910 --> 00:38:37,450
ajustar la velocitat i la velocitat negativa.

655
00:38:37,450 --> 00:38:42,930
Recordeu negatiu, a causa que el
direcció i negatiu és cap amunt.

656
00:38:42,930 --> 00:38:45,540
I la direcció positiva és cap avall.

657
00:38:45,540 --> 00:38:47,510
Si es pressiona cap avall
i no cap amunt, llavors estem

658
00:38:47,510 --> 00:38:53,860
va a posar-ho en velocitat positiva,
el que significa que va avall de la pantalla.

659
00:38:53,860 --> 00:38:55,460
El mateix amb l'esquerra i la dreta.

660
00:38:55,460 --> 00:38:58,200
>> I després anem a actualitzar
les posicions igual que abans.

661
00:38:58,200 --> 00:39:00,740
Anem a fer de col·lisió
detecció amb límits,

662
00:39:00,740 --> 00:39:04,290
però nosaltres no anem a restablir l'
velocitat, perquè la velocitat és només

663
00:39:04,290 --> 00:39:06,780
controlat pel teclat.

664
00:39:06,780 --> 00:39:11,230
Però anem a restablir l'
posicions per mantenir-lo en la finestra.

665
00:39:11,230 --> 00:39:14,400
I anem a establir el
posicions en l'estructura

666
00:39:14,400 --> 00:39:17,400
i després fer tot el
fent coses d'abans.

667
00:39:17,400 --> 00:39:20,750
Així que anem a veure el que fa.

668
00:39:20,750 --> 00:39:25,460
Així fan SRCS-- veurem,
això és hello6_keyboard.c.

669
00:39:25,460 --> 00:39:38,140

670
00:39:38,140 --> 00:39:38,820
>> Oh, no.

671
00:39:38,820 --> 00:39:40,150
Així que ens va donar alguns advertiments aquí.

672
00:39:40,150 --> 00:39:43,840
I això és simplement dir que no ho vam fer
comprovar si cada tipus possible

673
00:39:43,840 --> 00:39:45,610
d'esdeveniment.

674
00:39:45,610 --> 00:39:49,470
Això està bé, perquè
hi ha 236 d'ells o així.

675
00:39:49,470 --> 00:39:51,760
Així que vaig a ignorar aquestes advertències.

676
00:39:51,760 --> 00:39:53,530
Encara està compilat bé.

677
00:39:53,530 --> 00:39:56,100
Així que vaig a jugar el joc.

678
00:39:56,100 --> 00:39:57,590
No es mou.

679
00:39:57,590 --> 00:40:04,150
Però ara, quan em puré en el meu teclat,
Jo puc fer algun moviment WASD aquí,

680
00:40:04,150 --> 00:40:06,870
Utilitzo les meves tecles de direcció també.

681
00:40:06,870 --> 00:40:10,070
I noto, encara que sóc
pressionant la dreta en aquest moment,

682
00:40:10,070 --> 00:40:13,804
no va per la finestra,
perquè puc restablir en cada fotograma.

683
00:40:13,804 --> 00:40:14,720
Així que això és bastant ordenada.

684
00:40:14,720 --> 00:40:19,420
Vostè pot imaginar moure amb Mario
algunes tecles de fletxa o alguna cosa per l'estil.

685
00:40:19,420 --> 00:40:22,880
I sí, el X funciona.

686
00:40:22,880 --> 00:40:26,900
>> Arxiu Així definitiva anem
a la vista, hellow7_mouse.

687
00:40:26,900 --> 00:40:29,600
Es tracta d'aconseguir l'entrada del ratolí.

688
00:40:29,600 --> 00:40:34,790
Així que en aquest, ens
importar la capçalera de matemàtiques,

689
00:40:34,790 --> 00:40:38,100
perquè tindrem
una mica de matemàtiques aquí.

690
00:40:38,100 --> 00:40:45,260
El mateix vell, el mateix vell coses, destinació,
mateixa edat, vist això abans.

691
00:40:45,260 --> 00:40:46,910
Bé, això és interessant.

692
00:40:46,910 --> 00:40:51,730
Així que estem de tornada a l'única comprovació
per al SDL deixar esdeveniment.

693
00:40:51,730 --> 00:40:52,460
Perquè és això?

694
00:40:52,460 --> 00:40:55,110
Així que vostè pot aconseguir l'entrada del ratolí d'esdeveniments.

695
00:40:55,110 --> 00:40:57,670
Com quan el ratolí es movia,
s'obté un esdeveniment per això.

696
00:40:57,670 --> 00:41:00,520
Quan es prem un botó del ratolí,
vostè pot aconseguir un esdeveniment per això.

697
00:41:00,520 --> 00:41:05,760
>> Però hi ha una altra, una mica més senzill
potser, API per aconseguir l'entrada del ratolí.

698
00:41:05,760 --> 00:41:09,500
I això és simplement l'estat get ratolí SDL.

699
00:41:09,500 --> 00:41:14,370
Així que tinc un int per xi
i de la posició del cursor.

700
00:41:14,370 --> 00:41:18,910
Pas a SDL_GetMouseState,
que estableix aquests.

701
00:41:18,910 --> 00:41:22,200
I aquesta és la posició en el
sistema de la finestra de coordenades.

702
00:41:22,200 --> 00:41:25,520
Així que si la massa està a la part superior esquerra
de la finestra, que seria 0, 0.

703
00:41:25,520 --> 00:41:28,040

704
00:41:28,040 --> 00:41:33,380
>> Ara, el que faré és que vaig
fer una mica de matemàtiques de vectors.

705
00:41:33,380 --> 00:41:36,910
Aposto a que va pensar que no ho faria
veure que en CS50, però aquí està.

706
00:41:36,910 --> 00:41:40,720
Vaig a fer una mica de vector
matemàtiques per obtenir el vector

707
00:41:40,720 --> 00:41:43,840
a partir de la imatge per al cursor.

708
00:41:43,840 --> 00:41:53,280
I així, per què he
aquesta resta aquí?

709
00:41:53,280 --> 00:42:01,350
Bé, si acabo d'utilitzar dest .-- així
Necessito traduir el ratolí x

710
00:42:01,350 --> 00:42:05,166
e i per mitjà l'amplada i
l'alçada de la imatge,

711
00:42:05,166 --> 00:42:08,040
perquè vull que el centre de la
imatge que es va cap al ratolí,

712
00:42:08,040 --> 00:42:10,160
no l'origen de la imatge.

713
00:42:10,160 --> 00:42:15,650
>> Així que això és només per assegurar-se que estic parlant
voltant del centre de la imatge aquí.

714
00:42:15,650 --> 00:42:19,510
Llavors vam aconseguir delta x i y, que
és la diferència de la diana

715
00:42:19,510 --> 00:42:23,430
a la posició real de la imatge.

716
00:42:23,430 --> 00:42:25,690
I llavors podem obtenir la
distanciar-aquí, que

717
00:42:25,690 --> 00:42:29,140
serà de Pitàgores
teorema, arrel quadrada de x

718
00:42:29,140 --> 00:42:32,720
per x més vegades i i.

719
00:42:32,720 --> 00:42:38,400
>> Ara, per evitar que la inquietud, i puc mostrar
vostè el que això fa, si no faig això,

720
00:42:38,400 --> 00:42:45,830
si la distància entre el cursor i
el centre de la imatge és inferior a cinc,

721
00:42:45,830 --> 00:42:48,730
Jo no vaig a moure la imatge.

722
00:42:48,730 --> 00:42:52,900
En cas contrari, ens vam posar a la velocitat.

723
00:42:52,900 --> 00:42:55,960
I hem creat perquè el
la velocitat serà sempre constant.

724
00:42:55,960 --> 00:42:58,770
I el resultat net de tot
aquest matemàtiques és que la imatge

725
00:42:58,770 --> 00:43:01,660
va avançar cap al cursor.

726
00:43:01,660 --> 00:43:08,470
>> Ara, resulta que
SDL_GetMouseState,

727
00:43:08,470 --> 00:43:14,490
més d'establir la
x i arguments aquesta opció,

728
00:43:14,490 --> 00:43:21,340
també retorna un int que correspon
amb l'estat dels botons del ratolí.

729
00:43:21,340 --> 00:43:24,600
Així que no podem llegir que
directament, però podem

730
00:43:24,600 --> 00:43:29,090
utilitzar aquestes macros, una sola
operador de bits, no és que fa por,

731
00:43:29,090 --> 00:43:30,650
només un bit a bit i.

732
00:43:30,650 --> 00:43:38,320
Per això diem botons, que és el resultat
de la nostra SDL_GetMouseState, si això

733
00:43:38,320 --> 00:43:43,990
i bit a bit i, aquesta macro
aquí, SDL_BUTTON_LEFT.

734
00:43:43,990 --> 00:43:47,680
>> Així que això va a resoldre simplement
al mapa de bits que correspon

735
00:43:47,680 --> 00:43:51,090
al botó esquerre del ratolí està pressionat.

736
00:43:51,090 --> 00:43:55,470
I així, si el bit a bit
i es produeix i és

737
00:43:55,470 --> 00:43:59,340
no és zero, el que significa
S'ha premut el botó esquerre,

738
00:43:59,340 --> 00:44:04,320
llavors estem realment va a negar
tant la x i la y velocitats,

739
00:44:04,320 --> 00:44:06,700
que acaba de fer el fora de control d'imatge.

740
00:44:06,700 --> 00:44:07,980
Actualitzar posicions.

741
00:44:07,980 --> 00:44:10,920
Col·lisions deteccions, vist
tot abans, el que fa, està bé.

742
00:44:10,920 --> 00:44:11,510
Anem a fer-ho.

743
00:44:11,510 --> 00:44:14,200

744
00:44:14,200 --> 00:44:16,050
Així que has de MLRS = hello7_mouse.c.

745
00:44:16,050 --> 00:44:21,720

746
00:44:21,720 --> 00:44:22,220
Gran.

747
00:44:22,220 --> 00:44:23,490
No hi ha errors.

748
00:44:23,490 --> 00:44:24,900
I joc.

749
00:44:24,900 --> 00:44:26,440
>> Així que aquí tinc el meu ratolí.

750
00:44:26,440 --> 00:44:29,000
I la imatge és de fet
perseguint el meu ratolí.

751
00:44:29,000 --> 00:44:33,140
Ara, en un joc que vostè fa, potser
això és com una persecució enemiga

752
00:44:33,140 --> 00:44:35,240
el seu petit personatge o el que sigui.

753
00:44:35,240 --> 00:44:37,440
Però aquí tenim la
imatge perseguint al ratolí.

754
00:44:37,440 --> 00:44:41,000
I quan faig clic al ratolí
comença perseguint la imatge

755
00:44:41,000 --> 00:44:42,860
i la imatge és
fugint de ratolí.

756
00:44:42,860 --> 00:44:43,810
Així que això és molt bo.

757
00:44:43,810 --> 00:44:47,770
I avís de nou, no és
sent la detecció de col·lisions aquí.

758
00:44:47,770 --> 00:44:53,930
>> Així que aquest és el petit definitiva
Demo he posat aquí.

759
00:44:53,930 --> 00:44:58,870
I anem a fer una ullada a una cosa més.

760
00:44:58,870 --> 00:45:02,970
Així que de tornada aquí, he esmentat això jitter.

761
00:45:02,970 --> 00:45:05,000
Tot bé.

762
00:45:05,000 --> 00:45:12,890
Així que si la distància és de menys de cinc píxels,
Jo estava assegut x i y la velocitat a zero.

763
00:45:12,890 --> 00:45:15,960
Què passa si ens desfem d'això?

764
00:45:15,960 --> 00:45:19,070
Així que em vaig a fer això sol.

765
00:45:19,070 --> 00:45:23,820

766
00:45:23,820 --> 00:45:30,150
Si us plau, disculpi aquest estil horrible,
però vam comentar el codi correcte.

767
00:45:30,150 --> 00:45:38,080
Així que vaig a guardar això i fer el
mateix comando de davant per fer-ho.

768
00:45:38,080 --> 00:45:38,785
>> Tot bé.

769
00:45:38,785 --> 00:45:39,660
I ara què passa?

770
00:45:39,660 --> 00:45:43,260

771
00:45:43,260 --> 00:45:43,760
Bé.

772
00:45:43,760 --> 00:45:45,801
Encara estem seguint el
ratolí de la mateixa manera que abans,

773
00:45:45,801 --> 00:45:49,310
però quan vam arribar al ratolí,
tenim aquesta fluctuació brut.

774
00:45:49,310 --> 00:45:50,320
Què està passant allà?

775
00:45:50,320 --> 00:45:52,600
Doncs bé, en el nostre vector
matemàtiques, recordem que érem

776
00:45:52,600 --> 00:45:57,540
tenint la distància entre el
cursor i el centre de la imatge?

777
00:45:57,540 --> 00:46:00,710
Bé, com que s'acosta
0, comencem a aconseguir

778
00:46:00,710 --> 00:46:06,280
igual que aquest tipus de comportament boig
on la imatge és una espècie de

779
00:46:06,280 --> 00:46:08,910
com oscil·lant al voltant del cursor.

780
00:46:08,910 --> 00:46:12,000
I això és la creació d'aquesta fluctuació.

781
00:46:12,000 --> 00:46:13,020
I això és molt lleig.

782
00:46:13,020 --> 00:46:15,103
I és probable que no ho fa
vol que els seus jocs de fer això,

783
00:46:15,103 --> 00:46:17,350
llevat que sigui algun tipus d'efecte especial.

784
00:46:17,350 --> 00:46:21,960
>> Així que és per això que tenim
només per aquesta arbitrària

785
00:46:21,960 --> 00:46:27,150
tallem de cinc píxels, on diem
si es tracta d'un termini de cinc píxels, estem bé.

786
00:46:27,150 --> 00:46:29,560
No necessitem per moure la imatge més.

787
00:46:29,560 --> 00:46:32,260
Així que això és el que està passant allà.

788
00:46:32,260 --> 00:46:37,390

789
00:46:37,390 --> 00:46:40,870
>> Així que això és pràcticament tot.

790
00:46:40,870 --> 00:46:44,390
Ara ja sap com crear
una finestra, carregar una imatge,

791
00:46:44,390 --> 00:46:49,330
dibuixar una imatge a la finestra, obtenir
entrada de teclat, obtenir l'entrada del ratolí,

792
00:46:49,330 --> 00:46:52,190
hi ha un munt d'altres
d'entrada que no ho faria

793
00:46:52,190 --> 00:46:56,070
saber com arribar si vostè acaba de passar una
uns minuts mirant documentació.

794
00:46:56,070 --> 00:46:59,670
Així que realment té un bon
poques eines a la seva disposició ara

795
00:46:59,670 --> 00:47:01,650
per escriure un joc en tota regla.

796
00:47:01,650 --> 00:47:05,030
>> Ara, cada joc necessita una mica d'àudio,
però la documentació d'àudio

797
00:47:05,030 --> 00:47:06,460
també és bastant bo.

798
00:47:06,460 --> 00:47:09,200
I estic disposat a apostar que si
vostè entén totes les coses

799
00:47:09,200 --> 00:47:14,560
hem parlat avui amb
les imatges i les superfícies,

800
00:47:14,560 --> 00:47:18,370
les finestres, i tot, llavors
esbrinar l'API d'àudio no és

801
00:47:18,370 --> 00:47:21,170
serà tan dolent.

802
00:47:21,170 --> 00:47:27,420
Així que espero veure
el que creguis amb SDL.

803
00:47:27,420 --> 00:47:31,595