Სარჩევი:

დიზაინერისთვის საინტერესო პროგრამირების სახელმძღვანელო-გაუშვით თქვენი სურათი (ნაწილი პირველი): 16 ნაბიჯი
დიზაინერისთვის საინტერესო პროგრამირების სახელმძღვანელო-გაუშვით თქვენი სურათი (ნაწილი პირველი): 16 ნაბიჯი

ვიდეო: დიზაინერისთვის საინტერესო პროგრამირების სახელმძღვანელო-გაუშვით თქვენი სურათი (ნაწილი პირველი): 16 ნაბიჯი

ვიდეო: დიზაინერისთვის საინტერესო პროგრამირების სახელმძღვანელო-გაუშვით თქვენი სურათი (ნაწილი პირველი): 16 ნაბიჯი
ვიდეო: ვიდეო ბლოგის პირდაპირი ტრანსლაცია ოთხშაბათს საღამოს საუბარია სხვადასხვა თემაზე! #SanTenChan 2024, ივლისი
Anonim
დიზაინერისთვის საინტერესო პროგრამირების სახელმძღვანელო-გაუშვით თქვენი სურათი (ნაწილი პირველი)
დიზაინერისთვის საინტერესო პროგრამირების სახელმძღვანელო-გაუშვით თქვენი სურათი (ნაწილი პირველი)

გაიქეცი! გაიქეცი! გაიქეცი!

პროგრამირება არც ისე რთულია. მთავარი ის არის, რომ იპოვოთ თქვენი რიტმი და გააკეთოთ ეს სათითაოდ.

ამ თავის წაკითხვამდე, ვიმედოვნებ, რომ თქვენ უკვე იცნობთ ძირითადი ფუნქციის ხატვის მეთოდს, ან თავბრუსხვევა და დაბნეულობა გექნებათ ორი დიდი თავის ფუნქციით: დაყენება და დახაზვა.

ვინაიდან ჩვენ გვსურს მოძრავი გრაფიკის გაკეთება, ჩვენ უნდა ვიცოდეთ როგორ იქმნება ანიმაცია.

ზემოთ მოყვანილი სურათი საკმაოდ მიმზიდველად გამოიყურება და ვიზუალურად ავლენს ანიმაციის განხორციელების პრინციპს.

ანიმაცია ჯადოსნურია. ეს ჯადოსნურია ვიზუალური მოტყუების შესახებ. თუმცა, ეს ინფორმაცია აფეთქდა, ვიდეო დატბორვის ხანაში, ჩვენ უკვე შევეჩვიეთ მას. რამდენიმე ადამიანს გაუკვირდება, რომ საოცარი რამ არის ანიმაციის ნახვა.

იგივე პრინციპი შეიძლება გამოყენებულ იქნას პროგრამით ანიმაციის დახატვაში. ჩვენ უნდა განვიხილოთ, თუ როგორ დავხატოთ სხვადასხვა გრაფიკა თითოეულ ჩარჩოში და პროგრამა ავტომატურად გადააქცევს გვერდებს, სანამ ჩვენ დავამატებთ დასრულებულ ანიმაციას ჩვენს თავში. მომდევნო თავში ჩვენ ვისაუბრებთ იმაზე, თუ როგორ უნდა განხორციელდეს ძირითადი გრაფიკული მოძრაობა. მანამდე ჩვენ უნდა ვიცოდეთ ძირითადი ცოდნა ცვლადების შესახებ.

ნაბიჯი 1: ცვლადი

ცვლადი არის მონაცემების კონტეინერი. ის შეიძლება არაერთხელ იქნას გამოყენებული პროგრამის ფარგლებში.

Მაგალითად:

[cceN_cpp თემა = "გამთენიისას"] ზომა (500, 500); ელიფსი (100, 250, 50, 50); ელიფსი (200, 250, 50, 50); ელიფსი (300, 250, 50, 50); ელიფსი (400, 250, 50, 50);

[/cceN_cpp]

კოდის ამ ნაწილს არ აქვს გამოყენებული ცვლადები. ის ოთხ წრეს ხატავს ეკრანზე. ჩვენ ვხვდებით, რომ მათ აქვთ იგივე სიგანე და სიმაღლე. ახლა, როდესაც ეს იგივეა, მონაცემების განმეორებითი შეყვანის მინიმუმამდე შესამცირებლად, ჩვენ შეგვიძლია განვსაზღვროთ ნიშანი, რომელიც წარმოადგენს მას. ეს ნიშანი ცვალებადია.

აქ არის კოდი ცვლადის დამატების შემდეგ:

[cceN_cpp თემა = "გამთენიისას"] ზომა (500, 500); int a = 50; ელიფსი (100, 250, a, a); ელიფსი (200, 250, a, a); ელიფსი (300, 250, a, a); ელიფსი (400, 250, a, a);

[/cceN_cpp]

ჩვენ ვიღებთ აბსოლუტურად ერთსა და იმავე შედეგს!

ვინაიდან ჩვენ განვსაზღვრეთ ცვლადი a, ჩვენ შეგვიძლია მოხერხებულად შევცვალოთ პარამეტრები. თუ a = 50 -ს შევცვლით = 100 -ში, მაშინ ყველა წრის სიგანე და სიმაღლე 100 ერთგვაროვანი გახდება. ასე რომ, ჩვენ არ გვჭირდება პარამეტრების სათითაოდ შეცვლა. ცვლადი მართლაც კარგი გამოგონებაა.

ნაბიჯი 2: ცვლადის შექმნა

ცვლადის გამოყენებამდე ჩვენ უნდა გავაკეთოთ განცხადება და მივუთითოთ მისი მონაცემთა ტიპი.

int i;

მე 50 ფუნტი;

კოდის პირველმა წინადადებამ გააკეთა განცხადება ცვლადისთვის i. int არის სიმბოლო, რომელიც ძირითადად გამოიყენება ცვლადის გამოსაცხადებლად. დეკლარირებისას ის დაზოგავს ოთახს კომპიუტერის მეხსიერებაში, რაც ექვივალენტურია "ყუთის" გენერირებისთვის, რომელიც სპეციალურად გამოიყენება მთლიანი მონაცემების აღსადგენად. მეორე წინადადება ნიშნავს იმას, რომ დავალება 50 უნდა განხორციელდეს ცვლადი i. ამ წინადადების განხორციელების შემდეგ მონაცემები სტაბილურად შეინახება i ცვლადში. ან შეიძლება უფრო ზარმაცი იყოთ, რომ ზემოხსენებული ორი წინადადება გაერთიანდეს ერთ და სრულყოფილ დავალებად განცხადების გაკეთებისას.

int i = 50;

შედარებით თავისუფალია ცვლადის დასახელება. მაგრამ ხანდახან რაღაცას უნდა მივაქციოთ ყურადღება.

ნაბიჯი 3: ცვლადის სახელის რეგულირება

• ის უნდა იყოს ანბანისა და ხაზგასმის კომბინაცია. ეს შეიძლება იყოს სიმბოლო ან სიტყვა.

• შემთხვევისადმი მგრძნობიარე. სახელი და სახელი შეიძლება განსხვავდებოდეს სხვადასხვა ცვლადისათვის.

• შეეცადეთ რაც შეიძლება მარტივად დაასახელოთ, რათა მოგცეთ ერთი შეხედვით გაგების საშუალება. საწყისი სიმბოლო უნდა იყოს ანბანი რიცხვის ნაცვლად ან სპეციალური სიმბოლო.

• არ არის საკვანძო სიტყვები, როგორიცაა int, float

ქვემოთ მოცემულია რამდენიმე არასწორი განცხადება.

int $ a;

int 89b;

აქ არის სწორი განცხადებები:

int r;

int super_24;

int openTheDoor;

ნაბიჯი 4: ცვლადი ტიპი

რიცხვითი მონაცემების გამოცხადების გარდა, ჩვენ შეგვიძლია გამოვაცხადოთ ათობითი მონაცემები (ასევე უწოდებენ მცურავი წერტილის მონაცემებს) საკვანძო სიტყვით float.

float b = 0.5

ჩვენ უნდა გავითვალისწინოთ, თუ რა სახის მონაცემთა ტიპი გამოვიყენეთ ჩვენი განცხადებისთვის. თუ ჩვენ გამოვიყენეთ საკვანძო სიტყვა int, ამ უკანასკნელ დავალებას არ შეუძლია ჩაწერო i = 0.5 ან რამე მსგავსი, ან პროგრამა შეცდომა გახდება. მაგრამ თუ ჩვენ საპირისპიროდ ვწერთ, ყველაფერი კარგადაა. მაგალითად, float i = 5 არის სწორი გრამატიკა, მაგრამ პროგრამა მას ათწილად რიცხვად აღიარებს.

ზოგიერთი ცვლადი უკვე განსაზღვრულია სისტემის მიხედვით. ჩვენ არ გვჭირდება მათი დამოუკიდებლად გამოცხადება. ისევე როგორც ადრე ნახსენები "სიგანე, სიმაღლე", ის ავტომატურად შეიძენს კომპიუტერის ეკრანის სიგანეს და სიმაღლეს. გამოყენების ისეთი მაღალი სიხშირე, რომ დიზაინერი პირდაპირ განსაზღვრავს, რომ იყოს ნაგულისხმევი ცვლადი, რათა ჩვენთვის უფრო მოსახერხებელი იყოს მისი გამოყენება.

ნაბიჯი 5: ოპერატორი

ქვემოთ მოცემულია დამუშავების ოპერატორები:

+ პლუს

- მინუს

* გამრავლება

გაყოფა

% მოდულის ნარჩენი

თქვენ უნდა იცნობდეთ ყველა ამ ოპერატორს %-ის გარდა. ეს საკმაოდ უცნაურად გამოიყურება, რადგან მისი შედეგი არის დარჩენილი. 9%3 არის 0. ხოლო 9%5 არის 4.

ოპერატორები შეიძლება გამოყენებულ იქნას დავალებებსა და ცვლადებს შორის.

[cceN_cpp theme = "გამთენიისას"] int a = 1; // გამოაცხადე მთელი ცვლადი a, დავალება არის 1. int b = 2; // გამოაცხადე მთელი ცვლადი b, დავალება არის 2. int c; // გამოაცხადე მთელი ცვლადი გ. c = a + b; // პლუს ორი დავალება და მიაკუთვნოს მისი შედეგი გ. ამობეჭდვა (გ); // გამომავალი ცვლადი გ.

[/cceN_cpp]

ნაბიჯი 6: ოპერაციის შედეგი:

გამომავალი შედეგი არ იქნება ნაჩვენები ფანჯარაში, არამედ კონსოლში ბოლოში.

მეოთხე სტრიქონის წერის მეთოდი საკმაოდ უცნაურად გამოიყურება. მაგრამ ეს არის ჩვეულებრივი ფორმატი, რომელიც ხშირად გამოიყენება კომპიუტერის დავალების დროს. თანაბარი სიმბოლოს მარცხენა მხარე უნდა იყოს საბოლოო მინიჭებული ცვლადი, ხოლო მარჯვენა მხარე უნდა იყოს ოპერაციის პროცესი.

მეხუთე სტრიქონში დაბეჭდვის ფუნქციას შეუძლია ცვლადების ამობეჭდვა კონსოლში, რომელიც ხშირად გამოიყენება მონაცემთა გამომავალი მდგომარეობის შესამოწმებლად.

ნაბიჯი 7: ოპერაციის რეგულირება

დამუშავების პრობლემური წერტილი არის ცვლადის ტიპის გარკვევა. განსაკუთრებული ყურადღება უნდა მივაქციოთ მცურავი წერტილების რიცხვისა და მთელი რიცხვის ტიპის პროცესს.

ამობეჭდვა (6/5); // შედეგი 1

მთელ რიცხვს შორის ოპერაციას ექნება ახალი მთელი რიცხვი. 6 გაყოფილი 5 -ზე არის 1.2. მაგრამ პროგრამის გამომავალი შედეგი არის 1. ეს ეწინააღმდეგება ჩვენს ინტუიციას. პროგრამა არ გაუმკლავდება რაუნდს, არამედ წაშლის რიცხვს ათწილადის მიღმა.

ბეჭდვა (6.0 / 5.0); // შედეგი 1.2

მცურავ წერტილებს შორის მოქმედება გამოიწვევს მცურავი წერტილების ახალ რიცხვს. თუ ფაქტობრივი შედეგი არის 1.2, პროგრამის გამომავალი შედეგი იგივე იქნება.

ბეჭდვა (6 / 5.0); // შედეგი 1.2

ბეჭდვა (6.0 / 5); // შედეგი 1.2

დაბოლოს, ეს არის მთელი რიცხვისა და მცურავი წერტილის რიცხვის ნაზავი. საბოლოო გამომავალი შედეგი იქნება 1.2.

• სინამდვილეში, თქვენ უნდა გაითვალისწინოთ, რომ ამ რეგულაციის მიზანია მონაცემების სიზუსტის დაკარგვა. ასე რომ, თუ ერთი ელემენტი არის მცურავი წერტილის ნომერი, შედეგი იქნება მცურავი წერტილის რიცხვიც.

ნაბიჯი 8: დააყენეთ ფუნქცია და დახაზეთ ფუნქცია

ადრე ჩვენ ვისაუბრეთ დასაბუთებული ცოდნის დასტის შესახებ. ახლა ჩვენ საბოლოოდ მოვედით, რომ ვითამაშოთ რაიმე საინტერესო. ფუნქციის დაყენება და დახაზვა უდრის დამუშავების ძირითად ფუნქციებს. ეს ორი ფუნქცია ძალიან განსაკუთრებულია. მას შეუძლია გააკონტროლოს პროგრამის პროცედურა. შედარებით რთული პროგრამა მოიცავს ამ ორ ფუნქციას, რადგან ისინი პროგრამის ძირითადი ჩარჩოა. ფორმატი:

void setup () {

}

ბათილად გათამაშება () {

}

სპეციალური გამოყენება მათ გამოძახების ფორმატს სხვა ფუნქციებისგან განსხვავდება. ჩვენ უნდა დავამატოთ "void" ფუნქციის სახელის წინ, რომელიც დგას არა "დაბრუნებული მნიშვნელობის". ფუნქციის სახელის უკან, ჩვენ უნდა დავამატოთ ფრჩხილები და ბრეკეტები.

[cceN_cpp theme = "dawn"] void setup () {print (1); } void draw () {ბეჭდვა (2); } [/cceN_cpp]

მოდით შევხედოთ მაგალითს:

როდესაც დააჭირეთ ოპერაციის ღილაკს, კონსოლი პირველ რიგში გამოუშვებს "1" -ს და შემდეგ მუდმივად გამოუშვებს "2" -ს, სანამ არ დააჭერთ ღილაკს "გაჩერება" ან დახურეთ ფანჯარა.

დაყენების ფუნქციაში ფრჩხილებში არსებული კოდი განხორციელდება მხოლოდ ერთხელ. სანამ ფუნქციის ფარგლებში კოდი გამუდმებით მიმოქცევაში იქნება (ნაგულისხმევი განხორციელება 60 -ჯერ/წამში).

ამ ხასიათის გამო, კონფიგურაცია ჩვეულებრივ გამოიყენება გარემოს თვისებების ინიციალიზაციისთვის, როგორიცაა ეკრანის სიგანე და სიმაღლე, ფონის ფერი და ყველა სახის ცვლადის დავალება. მიუხედავად იმისა, რომ ჩვენ ხშირად ვათავსებთ ხატვის ფუნქციებს ფუნქციის გათამაშებაში, რათა განვახორციელოთ მუდმივად შეცვლილი გრაფიკა.

ნაბიჯი 9: წრე ჰორიზონტალურ მოძრაობაში

ფუნქციის დახაზვით, ჩვენ შეგვიძლია დავიწყოთ ჩვენი ანიმაციების შექმნა. ანიმაციის ეფექტის დაწერის მეთოდი დამუშავებით საკმაოდ "უხერხულია". მას არ აქვს არანაირი ბრძანება. მაგალითად, დანიშნეთ გარკვეული ფორმა მოსახვევის გასაკეთებლად.

ეს დეტალები ჩვენ თვითონ უნდა განვსაზღვროთ. თქვენ უნდა უთხრათ პროგრამას, რა გრაფიკა სჭირდება თითოეულ ჩარჩოს.

ჩაწერეთ მასში შემდეგი კოდი (ახლა დავიწყოთ ამის გაკეთება ხელით):

[cceN_cpp თემა = "გამთენიისას"] int x; int y; void setup () {ზომა (300, 300); x = 0; y = სიმაღლე/2; } void draw () {ფონი (234, 113, 107); noStroke (); ელიფსი (x, y, 50, 50); x = x+1; }

[/cceN_cpp]

კოდის ეს მონაკვეთი აჩვენებს მოძრავ წრეს. ყოფილი დეკლარირებული ცვლადი x, y გამოიყენება კოორდინატის პოზიციის შესანახად. მისი დავალებები ფუნქციონირებს ფუნქციის კონფიგურაციაში. ძირითადი კოდი შემდეგია ფუნქციის გათამაშებაში:

x = x + 1

ნუ ჩათვლით მათემატიკურ განტოლებას, თორემ ძალიან უცნაური იქნება. აქ "=" არის სიმბოლო დავალებისთვის. ეს არის მარცხენა ცვლადში მარჯვენა რიცხვების განთავსება. დავუშვათ x არის 50, კოდის ამოქმედებისთანავე, "=" - ის მარჯვენა ტოლია 50+1, ანუ 51. საბოლოო შედეგი გადანაწილდება x ცვლადზე. ასე რომ x- ის მნიშვნელობა ხდება 51.

დაიცავით პროგრამის პროცედურა, ყოველ ჯერზე, როდესაც ფუნქციის დახაზვა მოქმედებს ერთხელ, x მნიშვნელობა გაიზრდება 1. ასე რომ, ყოველ ჯერზე, როდესაც ჩვენ ვხატავთ, წრე გადაინაცვლებს პიქსელის მიმართულებას ჰორიზონტალურად მარჯვნივ, წინა კადრთან შედარებით. ამიტომ, გრაფიკა ხდება მოძრავი.

• იმისათვის, რომ კოდმა მიიღოს უკეთესი წაკითხვა, ჩვენ უნდა გამოვყოთ გარკვეული ოთახი ბრეკეტებში თითოეული კოდის ხაზის წინ. და ის მაქსიმალურად გასწორებული უნდა იყოს. დააჭირეთ TAB ან რამდენიმე ცარიელ ადგილს, მას შეუძლია უკან დახევა.

• პროგრამაში ცარიელი სივრცის სიმბოლო და ხაზის წყვეტა არ იმოქმედებს პროგრამაზე. ასე რომ, კარგია, თუ ერთს მეტნაკლებად ვწერთ.

აქ არის მისი გამოხატვის კიდევ ერთი მარტივი გზა. იმისათვის, რომ ცვლადი წრე გაიზარდოს 1 ავტომატურად, ჩვენ უნდა დავწეროთ ის შემდეგი ფორმატით.

წრე = წრე +1

საკმაოდ მოუხერხებელია! თუ ცვლადის სახელი უფრო გრძელია, მაშინ მეტი სიტყვა უნდა ჩავწეროთ. ასე რომ, ჩვენი ზარმაცი წინამორბედები ფიქრობენ მსგავს იდეაზე.

წრე

არ არის ძალიან მარტივი? ეს ნიშნავს 1 -ის გაზრდას ავტომატურად. მის მსგავსად, არსებობს - -, რაც ნიშნავს 1 -ის ავტომატურად შემცირებას.

მაგრამ თუ ვიმედოვნებთ, რომ რაოდენობის ავტომატური ზრდა სხვა რიცხვია, როგორიც არის 2, ჩვენ უნდა ვცადოთ სხვა გამოთქმა.

წრე += 2

ეს უდრის

წრე = წრე + 2

ანალოგიურად, არსებობს - =, /=, *=.

ნაბიჯი 10: მოძრაობის მიმართულება

რა მიმართულებით მოძრაობს გრაფიკა დამოკიდებულია იმაზე, თუ როგორ შეცვლით თქვენს კოორდინატს. თუ ის შეიცვალა y = y + 1 -ით, წრე ქვევით გადავა. თუ ორივე და y იზრდება 1 -ით, წრე გადავა ქვემოთ ქვედა მარჯვენა კუთხეში. თუ ჩვენ დავწერთ, რომ ის იყოს მინუს სიმბოლო, ის გადავა საპირისპირო მიმართულებით.

[cceN_cpp theme = "გამთენიისას"] int x, y; // შეუძლია ერთდროულად გამოაცხადოს მრავალი ცვლადი, გამოსაყენებლად გამოიყენოს მძიმე. void setup () {ზომა (300, 300); x = 0; y = 0; } void draw () {ფონი (234, 113, 107); noStroke (); ელიფსი (x, y, 50, 50); x ++; y ++; }

[/cceN_cpp]

მოძრაობის მაჩვენებელი

გახსოვთ ნაგულისხმევი 60 კადრი წამში ფუნქციის გათამაშებაში? ამ მაჩვენებლის მიხედვით, ზემოთ წრე გადაადგილდება 60 პიქსელი წამში მარჯვნივ.

თუ ჩვენ გვსურს გრაფიკული მოძრაობის სიჩქარის შეცვლა, არსებობს ორი მეთოდი: ერთი არის x მნიშვნელობის გაზრდა ყოველ ჯერზე მას შემდეგ, რაც ის შეიცვლება.

x = x + 10

მან გააუმჯობესა სიჩქარე 10 -ჯერ ორიგინალთან შედარებით!

სხვა მეთოდია ტილოს განახლების სიხშირის შეცვლა. კადრების სიხშირე()

ამ ფუნქციას შეუძლია შეცვალოს ტილოს მაუწყებლობის სიხშირე. ჩაწერეთ frameRate (10) ფუნქციის კონფიგურაციაში, ის შეცვლის თავდაპირველ 60 კადრს წამში 10 კადრად წამში. სიჩქარე შენელებულია 6 -ჯერ ვიდრე ადრე.

ნაბიჯი 11: შეუმჩნეველი ფონი

ყველა წინა მაგალითი წერს ფონს ფუნქციის დახაზვაში. ოდესმე გიფიქრიათ ჩაწეროთ ის ფუნქციის დაყენებაში? ექნება მას რაიმე განსხვავება? ახლა განვაახლოთ ჰორიზონტალური მოძრაობის მაგალითი.

[cceN_cpp theme = "გამთენიისას"] int x, y; void setup () {ზომა (300, 300); ფონი (234, 113, 107); x = 0; y = სიმაღლე/2; } void draw () {noStroke (); ელიფსი (x, y, 50, 50); x += 1; } [/cceN_cpp]

Რა მოხდა? შესაძლოა მან ვერ გაიაზროს პრობლემის წარმოქმნის მიზეზი სწორად. წაშალეთ ფუნქცია noStroke, კვლავ დაამატეთ ინსულტი და ნახეთ წრის მოძრაობის გზა.

ოჰ, ეს არის იმის გამო, რომ ადრე შექმნილი წრე არ წაიშალა! იმის გამო, რომ ფუნქციის დაყენება მოქმედებს მხოლოდ ერთხელ, თუ ჩვენ დავწერთ ფონს მის ზემოთ, ის შეავსებს ფონს მხოლოდ ერთხელ და ამ უკანასკნელს აღარ ექნება ეფექტი. ფუნქციის ფონი ჰგავს საღებავის ვედრო ინსტრუმენტს. გამოყენების შემდეგ, იგი დაფარავს ტილოზე არსებულ ყველა შინაარსს, მხოლოდ ფონის ფერის დაყენების ნაცვლად. ჩვენ ვწერთ მას ფუნქციის დახაზვამდე, რათა ყოფილი ჩარჩო დაფარული იყოს ყოველ ჯერზე, როდესაც ჩვენ შევქმნით ახალ ნიმუშს. აქედან გამომდინარე, წრე შეიძლება იმუშაოს ისე, როგორც ველოდით. თითოეული ფუნქციის გამოყენების დამახსოვრების გარდა, ჩვენ უნდა ვიფიქროთ კოდის პოზიციაზე. ბევრი დრო, აღმავალი თუ ქვევით ხაზი კოდეასთვის და დაწერეთ იგი ბრეკეტში ან მის გარეთ, ის შექმნის სრულიად განსხვავებულ ეფექტს. კოდის მიმართულება ორგანზომილებიანია. თუ ხარვეზი გამოჩნდება, ჩვენ უნდა დაკალიბრდეთ ამ ორ განზომილებაში.

• ხატვის ეს განმეორებითი მეთოდი სათანადოდ გამოყენების შემთხვევაში შეიძლება შექმნას განსაკუთრებული ეფექტი. თქვენ შეგიძლიათ დააკოპიროთ შემდეგი კოდი და სცადოთ.

[cceN_cpp theme = "dawn"] void setup () {size (400, 400); } void draw () {ელიფსი (სიგანე/2-mouseX, სიმაღლე/2-mouseX, mouseY, mouseY); ელიფსი (სიგანე/2-mouseX, სიმაღლე/2+mouseX, mouseY, mouseY); ელიფსი (სიგანე/2+mouseX, სიმაღლე/2-mouseX, mouseY, mouseY); ელიფსი (სიგანე/2+mouseX, სიმაღლე/2+mouseX, mouseY, mouseY); } [/cceN_cpp]

აქ ჩვენ გამოვიყენეთ ჯადოსნური ცვლადი mouseX და mouseY. მოგვიანებით ჩვენ დეტალურად ვისაუბრებთ მასზე.

ნაბიჯი 12: წრის შერყევა

რა მოხდება, თუ მსურს, რომ წრის მოძრაობის მიმართულება არარეგულარული გახდეს? გონივრულად შემთხვევითი ფუნქციით, თქვენც გააცნობიერებთ ამ ეფექტს. შემთხვევითი არის ხშირად გამოყენებული ფუნქცია. ის შეიძლება გამოყენებულ იქნას შემთხვევითი ფუნქციის შესაქმნელად. იგი ჰგავს უსინდისო სულს. ცვლადებთან დაკავშირების შემდეგ, თქვენ ვერ წარმოიდგენთ რა მოხდება შემდეგში.

გამოძახების ფორმატი:

შემთხვევითი (მაღალი)

მაღალი წარმოადგენს შემთხვევით ზედა ზღვარს, ხოლო ნაგულისხმევი ქვედა ზღვარი არის 0. მაგალითად, შემთხვევითი (10). ის აწარმოებს რიცხვს 0 -დან 10 -მდე შემთხვევით (0 შედის, მაგრამ 10 არ შედის).

შემთხვევითი (დაბალი, მაღალი)

თუ ჩვენ დავაყენებთ ორ პარამეტრს, მაშინ ის უბრუნდება მათ შორის შემთხვევით მნიშვნელობას. მაგალითად, შემთხვევითი (5, 10). ის აწარმოებს რიცხვს 5 -დან 10 -მდე შემთხვევით (5 შედის, მაგრამ 10 არ შედის).

მაგალითი:

[cceN_cpp theme = "გამთენიისას"] float x;

x = შემთხვევითი (50, 100);

ბეჭდვა (x); [/cceN_cpp]

ყოველ ჯერზე, როდესაც ჩვენ ვუშვებთ პროგრამას, კონსოლი გამოუშვებს სხვადასხვა მნიშვნელობას.

• შენიშვნა: ფუნქციები შემთხვევით შექმნილია მცურავი წერტილის ტიპს (ათობითი რიცხვის ტიპი). თუ ჩვენ გვსურს მნიშვნელობის მინიჭება მთელ ცვლადზე, ჩვენ უნდა შევცვალოთ იგი ფუნქციის int () მეშვეობით. გარდაქმნა არ ემორჩილება რაუნდს, არამედ პირდაპირ წაშალეთ ათობითი ნაწილი. ამრიგად, int (შემთხვევითი (5)) გამომავალი აქვს მხოლოდ 5 შესაძლებლობა: 0, 1, 2, 3, 4.

მას შემდეგ რაც გავეცნობით შემთხვევითი ფუნქციის გამოყენებას, ჩვენ შეგვიძლია პირდაპირ შევიდეთ ქვემოთ მოცემულ საქმეში.

[cceN_cpp theme = "გამთენიისას"] int x, y; void setup () {ზომა (300, 300); x = სიგანე/2; y = სიმაღლე/2; } void draw () {ფონი (234, 113, 107); noStroke (); x += int (შემთხვევითი (-5, 5)); y += int (შემთხვევითი (-5, 5)); ელიფსი (x, y, 50, 50); }

[/cceN_cpp]

ყოფილი დამატებული კოორდინატების მნიშვნელობები ფიქსირდება. მხოლოდ შემთხვევითი მნიშვნელობის გაზრდის შემთხვევაში, წრე გადავა განუსაზღვრელი მიმართულებით. უფრო დიდი შემთხვევითი დიაპაზონით, ის უფრო ხშირად ირხევა. ვინაიდან ჩარჩოებს შორის მნიშვნელობა იცვლება, მოძრაობა აღარ იქნება გლუვი. მიუხედავად იმისა, რომ ყოფილი ჩარჩო არის (150, 150), ეს უკანასკნელი გადავა პოზიციიდან (170, 170) ერთი შეხედვით.

ნაბიჯი 13: მიგრაციის წრე

მიგრაციის წრე

ის შექმნის გლუვ მოძრაობას? ფუნქციის ხმაური დაგვეხმარება. მას აქვს უკეთესი რიტმი ვიდრე სტანდარტული შემთხვევითი. და შემთხვევით წარმოქმნილი შემთხვევითი რიცხვები განუწყვეტლივ.

გამოძახების ფორმატი:

ხმაური (t

ფუნქციის ხმაურს არ შეუძლია განსაზღვროს მისი გამომავალი დიაპაზონი. პროგრამის განმარტებით მას შეუძლია წარმოქმნას მხოლოდ მცურავი წერტილების რიცხვები 0 -დან 1 -მდე და ფიქსირებულ შეყვანას შეიძლება ჰქონდეს მხოლოდ ფიქსირებული გამომავალი.

[cceN_cpp თემა = "გამთენიისას"] float x = ხმაური (5); float y = ხმაური (5); ბეჭდვა (x, y); [/cceN_cpp]

იმის გამო, რომ ზემოთ შეყვანის პარამეტრები არის 5, ასე რომ გამომავალი შედეგები იგივეა. მაშინ როგორ შევცვალოთ შედეგი? პასუხი არის დინამიურად შეყვანის პარამეტრების შეცვლა. სინამდვილეში ჩვენ შეგვიძლია ხმაური განვიხილოთ, როგორც უსაზღვრო ხმოვანი ჩანაწერი, შეყვანის პარამეტრები იგივეა "ახლანდელი დრო". თუ პარამეტრის შეყვანა უწყვეტია, გამომავალიც უწყვეტი იქნება.

[cceN_cpp theme = "გამთენიისას"] float x, y; void setup () {ზომა (700, 100); x = 0; ფონი (0); } void draw () {x += 1; y = ხმაური (frameCount/100.0)*100; noStroke (); ელიფსი (x, y, 2, 2); }

[/cceN_cpp]

ამ შემთხვევაში, ჩვენ ვხატავთ Y– ის შეცვლის გზას, რათა უკეთ გავიგოთ ფუნქციის ხმაური.

• მათ შორის, ცვლადი frameCount მიიღებს წინამდებარე ჩარჩოს. განსხვავდება წინა სიგანისა და სიმაღლისგან, ის სტაბილურია ყოველგვარი ცვლილების გარეშე. გარდა ამისა, ის იწყებს ზრდას 0 -დან.

• frameCount არის მთელი ცვლადი. გაყოფილი სხვა მთელი ცვლადის მიხედვით, პროგრამა ნაგულისხმევად დაამუშავებს შედეგს მთლად.შედეგის სიზუსტის გასაუმჯობესებლად, ჩვენ უნდა შევცვალოთ 100 100.0 -მდე. მცურავი წერტილის რიცხვით გაყოფილი, ჩვენ ასევე მივიღებთ მცურავი წერტილის რიცხვს.

• იმისათვის, რომ შევცვალოთ Y ღერძი 0 -დან 100 -მდე, ჩვენ უნდა გავამრავლოთ ხმაურის შედეგი 100 -ით. ამრიგად, ჩვენ შეგვიძლია ვაკონტროლოთ შემთხვევითი მნიშვნელობის დიაპაზონი.

ზოგიერთ თქვენგანს, ვინც კარგად აზროვნებს, შეიძლება ჰკითხოს "რატომ უნდა გავყოთ frameCountby 100? არ არის სწორი პირდაპირ frameCount- ის დაწერა?" Რა თქმა უნდა შეგიძლიათ! მაგრამ აქ, ფუნქციის ხმაურის მახასიათებლების უკეთ ჩვენების მიზნით, ჩვენ ვანელებთ "მაუწყებლობის სიჩქარეს". ქვემოთ მოყვანილი მაგალითი გვიჩვენებს გამომავალი მნიშვნელობის ცვლილებებს განსხვავებული ცვლილების სიჩქარით.

[cceN_cpp თემა = "გამთენიისას"] ცურავს x, y1, y2, y3, y4, y5; void setup () {ზომა (700, 500); x = 0; ფონი (0); } void draw () {x += 1; y1 = ხმაური (frameCount)*100; y2 = ხმაური (frameCount/10.0)*100; y3 = ხმაური (frameCount/100.0)*100; y4 = ხმაური (frameCount/1000.0)*100; y5 = ხმაური (frameCount/10000.0)*100; noStroke (); ელიფსი (x, y1, 2, 2); ელიფსი (x, y2+100, 2, 2); ელიფსი (x, y3+200, 2, 2); ელიფსი (x, y4+300, 2, 2); ელიფსი (x, y5+400, 2, 2); ინსულტი (80); ხაზი (0, 100, სიგანე, 100); ხაზი (0, 200, სიგანე, 200); ხაზი (0, 300, სიგანე, 300); ხაზი (0, 400, სიგანე, 400); }

[/cceN_cpp]

თქვენ შეგიძლიათ განიხილოთ პარამეტრების შეცვლა ფუნქციის ხმაურში, როგორც პროგრესის ზოლი. პარამეტრის შეცვლა არის პროგრესის ზოლის გადაადგილების მსგავსი. ასე რომ, როდესაც ამ "ხმოვანი ჩანაწერის" მოცულობა უფრო დიდია, გამომავალი მნიშვნელობის წინა და უკანა უწყვეტი მახასიათებლები სუსტი იქნება. (ჩვენ შეგვიძლია წარმოვიდგინოთ რა მოხდება, თუკი მუსიკის ნაწილს ან ვიდეოს გავცემთ 2 -ჯერ სიჩქარით, 5 ჯერ სიჩქარე, 20 -ჯერ სიჩქარე). როდესაც მოცულობა უფრო დიდია, ვიდრე გარკვეული მნიშვნელობა, მაშინ მას არ აქვს დიდი განსხვავება ღირებულების წარმოქმნაში შემთხვევითი ფუნქციონირებისას.

თუ თქვენ შეგიძლიათ გაიგოთ ყველა ზემოთ მოყვანილი მაგალითი, მაშინ იგრძნობთ, რომ არაფერია უფრო ადვილი მიგრირებული წრის დახატვა. თქვენ ასევე გესმით შინაგანი პრინციპები.

[cceN_cpp theme = "გამთენიისას"] float x, y; void setup () {ზომა (300, 300); x = 0; } void draw () {ფონი (234, 113, 107); x = ხმაური (frameCount/100.0 + 100)*300; y = ხმაური (frameCount/100.0)*300; noStroke (); ელიფსი (x, y, 50, 50); }

[/cceN_cpp]

ახლა, მოძრაობა უფრო საინტერესოა, როგორც მბრუნავი გირო.

• მიზეზი, რის გამოც ცვლადი x ფუნქციის ხმაურში უნდა იყოს პლუს 100 არის ის, რომ იმისათვის, რომ მოხდეს მათი დაშორება მანძილზე. თუ ფუნქციის ხმაურში xy პარამეტრები ერთნაირია ან საკმაოდ ახლო, მაშინ x, y კოორდინატის ცვლილება იგივე იქნება. ეს არის იმისთვის, რომ მოძრაობა ბევრად უფრო შემთხვევითი გახდეს.

ნაბიჯი 14: თაგვის მიერ გადატანილი წრე

შემდეგი, ჩვენ საბოლოოდ მივედით ორ ცვლადამდე, რომელიც მე ყველაზე მეტად მომწონს: mouseX და mouseY. ორი კონცეფციის ერთი შეხედვით, ჩემი თვალები ანათებს სინათლეს. რადგან ეს არის გრაფიკასთან ურთიერთობის ყველაზე პირდაპირი გზა. ჩვენ შეგვიძლია შევქმნათ ბევრი საინტერესო პროგრამა.

საქმე საკმაოდ მარტივია:

[cceN_cpp theme = "გამთენიისას"] int x, y; void setup () {ზომა (300, 300); x = 0; y = 0; } void draw () {ფონი (234, 113, 107); noStroke (); x = mouseX; y = მაუსი Y; ელიფსი (x, y, 50, 50); }

[/cceN_cpp]

mouseX– ს შეუძლია მიიღოს მაუსის x კოორდინატი, ხოლო mouseY– ს შეუძლია მიიღოს y კოორდინატი.

• შევეცადოთ შევცვალოთ დადებითი და უარყოფითი სიმბოლო, ან გავცვალოთ mouseX და mouseY.

ნაბიჯი 15: დასასრული

ამ ნაცნობი ბრძანებებიდან, თქვენ შეიძლება შეძლოთ გრაფიკული მოძრაობის წარმართვა. ბოლო თავის შინაარსით, გამოიყენეთ ფანტაზია სწორად, შეგიძლიათ შექმნათ ბევრი საინტერესო ანიმაციური ეფექტი.

ჩვენს შემდეგ თავში ჩვენ შეგვიძლია ვნახოთ უფრო უხვი მაგალითები. ამავე დროს, ჩვენ გამოვიყენებთ მათემატიკურ ფუნქციებს და გავაერთიანებთ მას გრაფიკულ მოძრაობას.

ეს სტატია მოდის დიზაინერი ვენზიდან.

ნაბიჯი 16: შედარებითი საკითხავი:

დიზაინერისთვის საინტერესო პროგრამირების სახელმძღვანელო-დამუშავების საწყისი შეხება

დიზაინერისთვის საინტერესო პროგრამირების სახელმძღვანელო-შექმენით თქვენი პირველი დამუშავების პროგრამა

ეს სტატია არის:

თუ დახმარება გჭირდებათ, შეგიძლიათ დაუკავშირდეთ: [email protected].

გირჩევთ: