1
00:00:00,370 --> 00:00:01,460
Tamam, tekrar hoş geldin diyorum.

2
00:00:01,620 --> 00:00:06,150
Bu videoda zaten yaptığımız şeyleri alacağız ve biraz canlandıracağız.

3
00:00:06,720 --> 00:00:12,090
Nihayetinde gerçekleşmesini istediğimiz şey, her tuşa basarak rasgele bir yerde bir renk

4
00:00:14,010 --> 00:00:17,360
elde ettik ve bu renk biraz canlandırmaktır.

5
00:00:18,300 --> 00:00:21,120
Ayrıca boyutu animasyonunu da alıyoruz.

6
00:00:21,460 --> 00:00:25,620
Dolayısıyla değişen renkleri alıp alamayacağınızı bilmiyorum, ancak renk tonuna biraz eklemeniz

7
00:00:25,620 --> 00:00:26,980
çok güzel oluyor.

8
00:00:27,330 --> 00:00:30,220
Fakat onlardan biri bizim için başlasın.

9
00:00:30,210 --> 00:00:34,770
Aslında sadece bu çevrelerin rengini değiştirmeye başlayacağız ve aslında bir dairenin

10
00:00:34,770 --> 00:00:37,950
rengini değiştirerek daha basit bir şekilde başlayacağız.

11
00:00:38,040 --> 00:00:40,660
Öyleyse hepsi daha sonra gelecektir.

12
00:00:40,680 --> 00:00:48,150
Paperchase'ye gidersek derslere dönersek alttaki animasyona bakarsınız.

13
00:00:48,150 --> 00:00:51,400
Yapabileceğiniz ilk şey, bazı örneklere göz atmanızdır.

14
00:00:51,540 --> 00:00:53,180
İşte bir örnek.

15
00:00:53,730 --> 00:00:57,440
Ve animasyonu yapmak gerçekten çok basit olduğunu da görebilirsiniz.

16
00:00:57,440 --> 00:01:01,260
Yaptığımız şey bu davada bir dikdörtgen tanımlamak.

17
00:01:01,260 --> 00:01:08,310
Bizim durumumuzda bir daire olacak ve daha sonra çerçeve üzerinde var ve burada koyduğumuz kod

18
00:01:08,310 --> 00:01:11,610
ne olursa olsun, animasyonun her karesinde çalışacak.

19
00:01:11,610 --> 00:01:18,360
Bu durumda bu animasyonun her karesinde o dikdörtgeni üç derece döndürüyoruz ya

20
00:01:18,360 --> 00:01:26,730
da bu durumda her kareyi kullanacağımız şey şu ki burada tanımladığımız bu dairenin tonuna bir

21
00:01:26,760 --> 00:01:28,200
tane ekliyoruz.

22
00:01:28,980 --> 00:01:31,580
O halde bunu deneyelim.

23
00:01:31,770 --> 00:01:35,290
Hadi devam edin ve anahtarda olmayan yeni bir daire oluşturalım.

24
00:01:35,310 --> 00:01:38,290
Böylece sayfa yüklendiğinde bu sadece orada olacaktır.

25
00:01:38,430 --> 00:01:50,250
Buna, var animasyonlu daire, yeni yollu nokta dairesine eşit ve bunu yeni noktalar haline getirelim ve

26
00:01:50,250 --> 00:01:55,870
bu daireyi 300 virgül 300 ve yarıçapta yapalım.

27
00:01:56,010 --> 00:01:58,200
100'ü daha büyük yapalım.

28
00:01:58,560 --> 00:01:59,870
Aynen böyle.

29
00:02:00,150 --> 00:02:09,190
Sonra, nokta dolgu rengini hareketlendirmek yerine animasyonlu ve animasyonlu daire olarak adlandıracağızızı yapacağız ve bunun gibi

30
00:02:09,260 --> 00:02:12,380
kırmızıya başlamak için kırmızı olarak ayarlayacağız.

31
00:02:12,540 --> 00:02:13,790
Harika.

32
00:02:13,890 --> 00:02:18,690
elde edersek ve bir tuşa her basışınızda rasgele küçük daireler elde edersek.

33
00:02:18,690 --> 00:02:22,260
Bu yüzden henüz canlandırılmayacak, fakat yenilerseniz bir büyük daire

34
00:02:22,260 --> 00:02:31,110
Şimdi animasyonumuza eklememiz gerekiyor ve işlevi çerçeve üzerinde gördüğümüz için gerçekten basittir ve bu olay argümanı

35
00:02:31,110 --> 00:02:33,640
dışında içeri girip çıkabiliriz.

36
00:02:33,660 --> 00:02:38,790
Her bir çerçeveyle ilgili bir şeyler yapmak istersek, bununla ilgili bazı veri istediysek, aslında buna

37
00:02:38,790 --> 00:02:39,560
ihtiyacımız yoktur.

38
00:02:39,840 --> 00:02:48,050
Ve sonra burada, animasyonlu daire dolgusu rengini artı birine eşittir.

39
00:02:48,120 --> 00:02:50,750
Ve bu örnekte doğrudur.

40
00:02:50,820 --> 00:02:57,330
bir çerçeve istiyor, bu bize göre değil bu nedenle bu kodun ne sıklıkta çağrıldığı kare hızına karar vermiyoruz.

41
00:02:57,480 --> 00:02:59,730
Bu nedenle animasyon her zaman yeni

42
00:02:59,790 --> 00:03:06,570
Her zaman sadece kağıtla ilgilenen yeni bir çerçeve var, animasyonlu çemberin tonuna

43
00:03:06,570 --> 00:03:08,160
bir tane ekliyoruz.

44
00:03:08,160 --> 00:03:10,650
Yenileyelim oraya gidelim.

45
00:03:10,650 --> 00:03:13,720
Bu türden bir animasyonu yapmak gerçekten çok basit.

46
00:03:13,830 --> 00:03:20,040
Her ne kadar bir şeyin yerini değiştirirken animasyonlar da yapabiliriz ve bu biraz

47
00:03:20,040 --> 00:03:21,250
daha karmaşıktır.

48
00:03:21,270 --> 00:03:26,760
başka bir noktaya hareketli değil aynı zamanda da eşit şekilde hızlandırılmamaktadır.

49
00:03:26,760 --> 00:03:31,360
Bu örnek daha karmaşıktır, çünkü bunlar yalnızca bir noktadan

50
00:03:31,410 --> 00:03:35,630
Dolayısıyla biraz daha karmaşık ama yine de sadece birkaç satır.

51
00:03:36,600 --> 00:03:39,830
İşte şeyleri hareket ettirmenin başka bir örneği.

52
00:03:40,500 --> 00:03:42,610
Bazı diğer animasyonlar.

53
00:03:42,610 --> 00:03:48,450
Gerçi göstermeyeceğimiz şeyleri kullanıyor ve burada, örnek vermek istediğimiz şeyleri dokümanlara

54
00:03:48,450 --> 00:03:54,840
kazmak için biraz zaman harcıyor; her bir kareyi her birinde ölçeklendirmek.

55
00:03:56,340 --> 00:04:00,360
Bu yüzden yaptığımız temelde bir anahtar kurduğumuzda daire oluşturduğumuz.

56
00:04:00,390 --> 00:04:09,060
yarıçapa 300 olarak başladıysam ya da temelde dokuz dokuz dokuz dokuzu sekizli ölçeklendirerek onu küçültün.

57
00:04:09,060 --> 00:04:15,680
Diyelim ki her karede bu karakteri vurduğumda 300 ya da 300

58
00:04:15,720 --> 00:04:22,590
Tam sayıyı unuttum, ancak onu her karede daha küçük bir boyutla çarpıyoruz ve sadece

59
00:04:22,590 --> 00:04:24,760
küçülüyor ve küçülüyor, böylece kayboluyor.

60
00:04:25,110 --> 00:04:26,940
Bu işin nasıl yürüdüğünü size göstereceğim.

61
00:04:27,090 --> 00:04:35,130
Döngü kodumuza geri dönelim, daire tonlamaya eklenmek yerine hareketsizce animasyon yapıyor ve

62
00:04:35,250 --> 00:04:36,910
çerçeve içinde kalalım.

63
00:04:37,110 --> 00:04:40,370
animasyonlu daire skalerini yapmaktır ve

64
00:04:42,910 --> 00:04:51,950
istediğimiz herhangi bir fraksiyonla çarpıp bir araya getirebilirsek, aynı büyüklüğe sahip olacağız, böylece onu gerçekten göremeyeceğiz.

65
00:04:51,950 --> 00:04:55,760
Yapacağımız şey, bulduğumuz bir yöntem olan

66
00:04:55,970 --> 00:05:08,600
Ancak, dokuzuncu gibi bir şey yaparsak ve yenilersek, her çerçeve değişikliklerini 1 oranında artırırız.

67
00:05:08,960 --> 00:05:14,560
Ve önceki karede yüzde dokuz veya yüzde 90 oranında ölçekli.

68
00:05:14,570 --> 00:05:23,960
Yani, bunu 9 puan gibi bir şeye bırakırsak, daha yavaş bir geçiş olur ve

69
00:05:23,960 --> 00:05:30,540
onu beşinci nokta gibi değiştirirsek, çok hızlı bir şekilde küçülür.

70
00:05:30,680 --> 00:05:34,090
Bu nedenle her çerçeve önceki koşula kıyasla yarısı kadar büyük olur.

71
00:05:34,280 --> 00:05:37,180
Bence birlikte gittigim nokta 9. Nokta'ydi.

72
00:05:37,370 --> 00:05:39,040
Bu yüzden bunda bırakacağız.

73
00:05:39,140 --> 00:05:45,680
Şimdi renk değiştiren tek bir çevreye sahibiz ve bundan sonra yapmak istediğimiz şey bu tuşlara

74
00:05:45,680 --> 00:05:46,530
bastığımızda küçülüyor.

75
00:05:46,730 --> 00:05:52,300
Bu çevrelerin aynı şeyi yapmasını istiyorsan biraz daha karışıktır.

76
00:05:52,490 --> 00:05:58,730
Ancak dürüstçe buradaki kod aynı kalıyor, hepsi farklı, sayfadaki her daire

77
00:05:58,760 --> 00:06:01,410
için bunu yapmamız gerekiyor.

78
00:06:01,790 --> 00:06:06,410
Ve aslında muhtemelen yapacakları en önemli değişiklik, bir dizi daireye

79
00:06:06,410 --> 00:06:12,950
sahip olmak ve bir tuşa her basışımızda o daireyi yeni dizide ekleyeceğiz çünkü şu anda

80
00:06:12,950 --> 00:06:17,380
aslında tümü takip etmiyoruz çevreler bizleri bir şekilde kurtarmak zorundayız.

81
00:06:17,420 --> 00:06:24,830
Dolayısıyla, burada bu işlevi gördüğünüzde, halihazırda var olan ve hareketli olan her daireye

82
00:06:24,890 --> 00:06:26,240
geri dönebiliriz.

83
00:06:26,840 --> 00:06:28,210
Dolayısıyla bu kodu saklayacağız.

84
00:06:28,610 --> 00:06:33,770
Ancak yapmak istediğimiz, var olmayan bir dizi ile döngü yapmaktır, bu nedenle sadece daire diyebiliriz.

85
00:06:33,770 --> 00:06:42,230
Dolayısıyla var i sıfıra eşittir Ayas Circle StarLink'den daha azdır.

86
00:06:42,690 --> 00:06:47,420
Artı artı yapmak istediğimiz şey daire yapmak.

87
00:06:47,580 --> 00:06:50,260
Ben renk dolduruyorum burada yaparım.

88
00:06:50,260 --> 00:06:54,130
Dolayısıyla en başında dolgu rengiyle başlayacağız.

89
00:06:54,140 --> 00:06:56,500
Bu yüzden bu satırı kopyalayacağım.

90
00:06:58,550 --> 00:07:01,050
Dolayısıyla henüz çalışmayacak çünkü daire mevcut değil.

91
00:07:01,070 --> 00:07:08,780
Fakat fikir, her çerçevede bu dizideki tüm çevreleri birbirine bağlamamız ve her kareye her

92
00:07:08,780 --> 00:07:11,590
bir renge bir tane eklediğimizdir.

93
00:07:12,470 --> 00:07:17,900
Ve bunun oldukça yoğun olduğunu düşünüyorsunuz ve bu gerçekleşmekte olan bir çok şey ama kağıt sadece

94
00:07:17,900 --> 00:07:18,760
onunla ilgileniyor.

95
00:07:18,890 --> 00:07:25,550
Ancak sonuna doğru küçük bir optimizasyon da ekleyeceğiz, böylece gelecekteki bir videoda ne kastettiğimi size

96
00:07:25,550 --> 00:07:25,910
göstereceğim.

97
00:07:25,910 --> 00:07:27,780
Ama şu an bizde bunu yapacağız.

98
00:07:28,340 --> 00:07:35,660
Ve şimdi yapmak zorunda olduğumuz şey aslında yaptığımız bu daireyi daireler dizisine ekleyin, böylece

99
00:07:35,660 --> 00:07:42,590
dairelerimiz için bu diziyi boş bir dizi olarak tanımlayabiliriz ve anahtar üzerinde bir

100
00:07:42,590 --> 00:07:51,830
tuşa bastığınızda sadece çevreler yukarı çıkıp bu yeni daireyi daire durağına itin bu yeni yolu bu rasgele noktada

101
00:07:51,830 --> 00:07:53,140
daire içine itin.

102
00:07:53,240 --> 00:07:58,180
Şu anda 10 bir yarıçapımız var ve öldürme dolgu rengini turuncu olarak sıfırlıyoruz.

103
00:07:58,220 --> 00:08:03,660
Bu yüzden zaten sahip olduğumuz bu daireyi bu dairenin dizisine itiyoruz.

104
00:08:04,040 --> 00:08:06,830
Ve sonra her daireyi güncelliyoruz.

105
00:08:06,830 --> 00:08:09,950
Dolayısıyla, bir daire olabilir ve orada 20 daire olabilir.

106
00:08:10,070 --> 00:08:12,270
Herhangi bir zamanda 100 daire olabilir.

107
00:08:12,320 --> 00:08:19,790
Hepsini dolaşırız ve her kuyruğa bir tane ekleriz ve şimdi bir göz atıp yenileyelim,

108
00:08:19,790 --> 00:08:21,670
henüz işe yaramaz.

109
00:08:21,770 --> 00:08:25,550
Ve bu, itme işlemi hakkında gerçekten ilginç bir nokta ortaya çıkarıyor.

110
00:08:25,550 --> 00:08:33,650
Konsolu açarsam, bana burada, tanımlanmamış zihin Prakriti tonunu 24 okuyamayacağımı

111
00:08:33,650 --> 00:08:34,570
söylüyor.

112
00:08:35,150 --> 00:08:41,150
Bu yüzden, Phil rengin Hugh mülkünün Phil kodunun mevcut olmadığını söylememesi bir şekilde değil.

113
00:08:41,540 --> 00:08:43,870
Böylece sürekli günlük çevreleri yapalım.

114
00:08:44,330 --> 00:08:48,390
Ve sorunun ne olduğunu göreceksin.

115
00:08:49,100 --> 00:08:53,610
Bunu açarsam bir hata oluştuğu için durdurulur.

116
00:08:53,780 --> 00:09:00,390
Fakat biz aslında turuncu dize yerine gerçek yeni daire ekledi.

117
00:09:00,530 --> 00:09:06,710
Bunun nedeni, bastırdıklarımız yeni bir daire oluşturduğumuz yeni bir çevre değil.

118
00:09:06,740 --> 00:09:09,470
Ve sonra dolgu rengini turuncu olacak şekilde ayarlıyoruz.

119
00:09:09,500 --> 00:09:13,010
Bu yüzden geri gönderilen son şey turuncu dizedir.

120
00:09:13,010 --> 00:09:16,780
Sonuçta, sonuçta sadece turuncu her seferinde bastırıyoruz.

121
00:09:16,850 --> 00:09:18,530
İstediğimiz şey bu değil.

122
00:09:19,190 --> 00:09:28,310
Bu yüzden yeni bir değişkene geçeceğiz ve bunu yeni daire diyeceğiz ve daha sonra

123
00:09:28,310 --> 00:09:35,920
turuncuya eşit yeni daire dolgusu rengi yapacağız ve ardından Yeni Daire'yi tıkacağız.

124
00:09:35,990 --> 00:09:40,480
Bu yüzden bunu düzenlemektense, görmek önemli bir hata olduğunu düşünüyorum.

125
00:09:40,760 --> 00:09:44,870
Tamamen beni bir an için korudu ancak önemli olan şu

126
00:09:44,870 --> 00:09:51,760
ki bu birbirine zincirleme yöntemler uyguladık ve bu daireyi geçtikten sonra nokta dolgu rengi turuncuye eşitti

127
00:09:51,770 --> 00:09:56,450
ve biz de o şeyi bütünüyle içine ekledik. itme ile dizi.

128
00:09:56,560 --> 00:09:57,800
Sadece turuncu ekliyorduk.

129
00:09:57,830 --> 00:09:59,980
Bu yüzden düzeltmek gerekir.

130
00:10:00,110 --> 00:10:01,290
Umarım bu işi yapar.

131
00:10:01,310 --> 00:10:08,300
Aslında bunun farkındayım ama eğer biz yeniyse ve bir göz atın şimdi yeni

132
00:10:09,700 --> 00:10:15,290
çevrelerde rasgele yerleştirin ve hepsini düşman Heugh sadece mükemmel harekete geçirir.

133
00:10:15,290 --> 00:10:17,450
Şimdi bunu boyutla çalışacak şekilde güncelleyelim.

134
00:10:17,570 --> 00:10:21,550
Yani aslında burada aynen sahip olduğumuz aynı çizgi.

135
00:10:22,280 --> 00:10:23,860
Sürekli günlüğümden kurtulacağım.

136
00:10:23,930 --> 00:10:26,140
İsterseniz daire istiyoruz.

137
00:10:26,160 --> 00:10:28,420
BEN.

138
00:10:30,680 --> 00:10:31,370
TAMAM.

139
00:10:31,730 --> 00:10:36,420
İşe yarayıp yaramadığını göstermeden önce, yaptığımız şeyi gözden geçirelim.

140
00:10:36,440 --> 00:10:42,860
Dolayısıyla, rasgele bir noktada bir daireye eklediğimiz herhangi bir anahtarı vurduğunuzda, rastgele bir nokta olan 10 piksel

141
00:10:42,860 --> 00:10:49,100
yarıçaplı yeni bir daire yapmak için rastgele bir nokta oluşturuyoruz ve bunu aslında, beş yüz olan

142
00:10:49,100 --> 00:10:54,590
çözümde bulduğumuz ile eşleştirmek için değiştirelim. ve sonra sonunda değişecek turuncu olarak başlamak için

143
00:10:54,590 --> 00:10:55,770
dolum kartı satıyoruz.

144
00:10:55,880 --> 00:10:58,840
Ve sonra onu daire olarak adlandırılan bir diziye sokuyoruz.

145
00:10:59,060 --> 00:11:07,200
Sonra her yeni bir çerçeveye Her animasyon karesi denirse tüm daireler arasında döngüyüz.

146
00:11:07,520 --> 00:11:13,180
Ve her biri için bir tane daha hayran kalacağız ve ölçeğin boyutunu dokuzuncu çarpı çiziyoruz.

147
00:11:13,430 --> 00:11:17,260
Bu yüzden onu her kare kadar küçük düşürüyoruz.

148
00:11:17,360 --> 00:11:22,130
Ancak, çok hızlı bir şekilde küçülen çok fazla çerçeve

149
00:11:22,130 --> 00:11:26,540
var ve artık sayfa yüklemeye başlayan animasyonlu çevremizden kurtulabiliriz.

150
00:11:26,540 --> 00:11:28,240
Siyah bir ekranla başlamak istemiyoruz.

151
00:11:28,250 --> 00:11:30,700
Sonra bir tuşa basarsanız daire ekleriz.

152
00:11:30,710 --> 00:11:33,320
Öyleyse deneyelim.

153
00:11:33,320 --> 00:11:37,110
Oraya gidiyoruz.

154
00:11:37,130 --> 00:11:40,920
Dolayısıyla bu neredeyse aynı şekilde.

155
00:11:40,980 --> 00:11:43,130
İşte ses.

156
00:11:43,130 --> 00:11:51,260
Büyük bir fark renk, burada her tuşun atanmış bir rengine sahip olduğunu söylediği için, Q bu mavi,

157
00:11:52,220 --> 00:11:54,000
koyu mavi bir yarısıdır.

158
00:11:54,110 --> 00:11:55,810
Gri renkte mi

159
00:11:55,980 --> 00:12:02,310
Yani bizim için şu anda mor renkte, başlamak üzere herkesi turuncu ve daha sonra ton

160
00:12:02,310 --> 00:12:03,070
değiştirerek ayarlıyoruz.

161
00:12:03,500 --> 00:12:08,500
Bu yüzden bunu düzeltmeliyiz, ancak ses eklemek için bunu yapmak için sabırsızlanıyoruz.

162
00:12:08,510 --> 00:12:10,990
Bu yüzden şimdi bittik.

163
00:12:11,210 --> 00:12:16,820
Bunu sona erdirecek küçük bir optimizasyon var çünkü şu anda bu

164
00:12:16,820 --> 00:12:19,000
çevreleri daire dizisinden çıkarmıyoruz.

165
00:12:19,040 --> 00:12:25,490
Dolayısıyla 10 saniye sonra çemberin üç saniye sonra bile gittiğini bilseniz bile biz onu göremiyoruz.

166
00:12:25,490 --> 00:12:27,330
Teknik olarak hala bu dizide.

167
00:12:27,620 --> 00:12:29,540
Bu ideal değil.

168
00:12:29,540 --> 00:12:34,640
daire varsa ve bunlardan hiçbirini görmüyorsak, hepsinin üzerine dönmek istemiyoruz.

169
00:12:34,640 --> 00:12:36,170
Yarattığımız on bin

170
00:12:36,170 --> 00:12:41,360
Bu yüzden son videoda bir çevrenin bittiğini ya da artık mümkün olmadığını bildiğimizde bir

171
00:12:41,360 --> 00:12:43,090
çevreyi nasıl kaldıracağınızı size göstereceğim.

172
00:12:43,490 --> 00:12:45,320
Tamam öyleyse sıra ile sesle çalışacağız