Дизайнерге арналған бағдарламалау бойынша қызықты нұсқаулық-суретті іске қосыңыз (бірінші бөлім): 16 қадам

2025 Автор: John Day | [email protected]. Соңғы өзгертілген: 2025-01-23 14:51

Жүгір! Жүгір! Жүгір!

Бағдарламалау соншалықты қиын емес. Ең бастысы - сіздің ырғағыңызды тауып, оны бір -бірлеп жасау.

Бұл тарауды оқымас бұрын, сіз сурет салудың негізгі әдісімен таныссыз деп үміттенемін, немесе сіз басыңды айналдыратын боласыз және екі үлкен бас функциясымен шатасасыз: орнату және сызу.

Біз қозғалыс графикасын жасағымыз келетіндіктен, анимацияның қалай жасалатынын білуіміз керек.

Жоғарыда көрсетілген сурет өте тартымды болып көрінеді және анимацияның жүзеге асу принципін көрнекі түрде ашады.

Анимация - бұл сиқыр. Бұл визуалды алдау туралы сиқыр. Алайда, бұл ақпарат жарылды, видео тасқынының заманы, біз бұған бұрыннан үйренгенбіз. Анимацияны көрудің таңғажайып нәрсе екеніне таң қалатындар аз.

Дәл осындай принципті анимацияны бағдарламада қолдануға болады. Біз әр кадрға әр түрлі графиканы қалай салу керектігін қарастыруымыз керек, және біз басымызда аяқталған анимацияны қосқанда бағдарлама автоматты түрде беттерді айналдырады. Келесі тарауда біз негізгі графикалық қозғалысты қалай жүзеге асыру керектігі туралы айтатын боламыз. Бұған дейін біз айнымалылар туралы кейбір негізгі білімдерді білуіміз керек.

1 -қадам: айнымалы

Айнымалылар - бұл деректердің контейнері. Оны бағдарлама ішінде бірнеше рет қолдануға болады.

Мысалға:

[cceN_cpp theme = «таң»] өлшемі (500, 500); эллипс (100, 250, 50, 50); эллипс (200, 250, 50, 50); эллипс (300, 250, 50, 50); эллипс (400, 250, 50, 50);

[/cceN_cpp]

Кодтың бұл бөлімінде айнымалылар қолданылмаған. Ол экранда төрт шеңбер сызады. Біз олардың ені мен биіктігі бірдей екенін таба аламыз. Енді дәл солай, деректерді қайталап енгізуді азайту үшін біз оны көрсететін белгіні анықтай аламыз. Бұл белгі өзгермелі.

Міне айнымалы қосқаннан кейін код:

[cceN_cpp theme = «таң»] өлшемі (500, 500); int a = 50; эллипс (100, 250, а, а); эллипс (200, 250, а, а); эллипс (300, 250, а, а); эллипс (400, 250, а, а);

[/cceN_cpp]

Біз мүлдем бірдей нәтиже аламыз!

Біз a айнымалысын анықтағандықтан, біз параметрлерді ыңғайлы түрде өзгерте аламыз. Егер a = 50 -ді a = 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 кілт сөзімен ондық мәліметтерді жариялай аламыз (өзгермелі нүктелік деректер деп те аталады).

өзгермелі b = 0,5

Біз мәлімдемеде қандай деректер түрін қолданғанымызды есте ұстауымыз керек. Егер біз int кілт сөзін қолданған болсақ, соңғы тапсырма i ＝ 0.5 немесе оған ұқсас нәрсені жаза алмайды, немесе бағдарлама қатеге айналады. Бірақ егер біз қарама -қарсы жазсақ, онда бәрі жақсы. Мысалы, float i = 5 - дұрыс грамматика, бірақ бағдарлама оны ондық сан ретінде таниды.

Кейбір айнымалылар жүйемен анықталған. Біз оларды өз бетімізше жариялаудың қажеті жоқ. Бұрын айтылған «ені, биіктігі» сияқты, ол автоматты түрде компьютер экранының ені мен биіктігін алады. Қолданудың жоғары жиілігі, оны қолданушы бізге ыңғайлы ету үшін дизайнер оны әдепкі айнымалы ретінде анықтайды.

5 -қадам: оператор

Мыналар өңдеу операторлары болып табылады:

+ плюс

- минус

* көбейту

divide

％ Қалған модуль

Сіз %-дан басқа барлық операторларды білуіңіз керек. Бұл таңқаларлық болып көрінеді, себебі оның нәтижесі қалды. 9%3 - 0. 9%5 - 4.

Тапсырмалар мен айнымалылар арасында операторларды қолдануға болады.

[cceN_cpp theme = «таң»] int a = 1; // а бүтін айнымалысын жариялаңыз, тағайындау - 1. int b = 2; // b бүтін айнымалы мәнін жариялау, тағайындау - 2. int c; // бүтін сандар айнымалысын жариялау c. c = a + b; // Плюс екі тағайындау және оның нәтижесін с. басып шығару (в); // Шығатын айнымалы c.

[/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» қосу керек. Функция атауының артында жақшалар мен жақшалар қосу керек.

[cceN_cpp theme = «таң»] жарамсыз баптау () {print (1); } void draw () {print (2); } [/cceN_cpp]

Мысал қарастырайық:

Жұмыс түймесін басқанда, консоль алдымен «1» шығарады, содан кейін сіз тоқтату түймесін басқанша немесе терезені жаппағанша «2» шығарады.

Орнату функциясындағы жақша ішіндегі код тек бір рет орындалады, ал функция ұтысының ішіндегі код үнемі айналымда болады (әдепкі енгізу 60 рет/секунд).

Осы сипатқа байланысты орнату әдетте экранның ені мен биіктігі, өң түсі және айнымалылардың барлық тағайындалуы сияқты қоршаған ортаның қасиеттерін инициализациялау үшін қолданылады. Біз үнемі өзгеретін графиканы құру үшін сурет салу функцияларын функционалдық сызбаға жиі қоямыз.

9 -қадам: Көлденең қозғалыстағы шеңбер

Draw функциясының көмегімен біз анимация құруды бастай аламыз. Өңдеу арқылы анимациялық эффект жазу әдісі «ыңғайсыз». Онда бұрыннан бар командалар жоқ. Мысалы, қисық сызықты болу үшін белгілі бір пішінді белгілеңіз.

Біз бұл бөлшектерді өз бетімізше анықтауымыз керек. Сіз бағдарламаға әр кадрға міндетті түрде қандай графика қажет екенін айтуыңыз керек.

Оған келесі кодты жазыңыз (Енді оны қолмен жасай бастайық):

[cceN_cpp theme = «таң»] int x; int y; void setup () {size (300, 300); x = 0; y = биіктік/2; } void draw () {background (234, 113, 107); noStroke (); эллипс (x, y, 50, 50); x = x+1; }

[/cceN_cpp]

Кодтың бұл бөлімінде қозғалыс шеңбері көрсетіледі. Бұрынғы жарияланған x, y айнымалысы координатаның орнын сақтау үшін қолданылады. Оның тапсырмалары функцияны орнатуда орындалады. Кілт коды функцияның сызбасында келесідей:

x = x + 1

Мұны математикалық теңдеу деп қарамаңыз, әйтпесе бұл біртүрлі болады. Бұл жерде «＝» - тағайындаудың символы. Ол оң сандарды сол жақ айнымалыға орналастыруды білдіреді. Код 50 -ге тең делік, код іске қосылғаннан кейін «＝» -нің оң жағы 50+1 -ге тең, яғни 51. Соңғы нәтиже x айнымалысына тағайындалады. Осылайша x мәні 51 болады.

Бағдарлама процедурасын орындаңыз, функцияның ұтыс ойыны бір рет жұмыс жасағанда, x мәні 1 -ге артады. Сонымен, біз сурет салған сайын, шеңбер бұрынғы кадрмен салыстырғанда пиксель бағытын көлденеңінен оңға қарай жылжытады. Сондықтан графика қозғалысқа айналады.

• Кодты оқуды жақсарту үшін жақша ішіндегі әрбір код жолының алдында белгілі бір бөлмені сақтау қажет. Және ол мүмкіндігінше реттелуі керек. TAB немесе бірнеше бос орынды басыңыз, ол кері шегінуі мүмкін.

• Бос орын мен жолдағы үзіліс белгісі бағдарламаға әсер етпейді. Сондықтан біреуін көп немесе аз жазсақ, жақсы.

Міне, оны білдірудің тағы бір қарапайым әдісі. Айнымалы шеңберді автоматты түрде 1 ұлғайту үшін оны келесі форматта жазу керек.

шеңбер ＝ шеңбер ＋1

Өте ыңғайсыз! Егер айнымалының атауы ұзын болса, онда біз көп сөздерді теруіміз керек. Біздің жалқау предшественниктер осындай ойды ойлайды.

шеңбер ＋＋

Бұл өте қарапайым емес пе? Бұл 1 -ді автоматты түрде көбейтуді білдіреді. Осыған ұқсас - - бар, бұл автоматты түрде 1 азайтуды білдіреді.

Бірақ егер біз автоматты түрде көбеюдің саны 2 сияқты басқа сан болса деп үміттенетін болсақ, басқа өрнекті қолдануға тура келеді.

шеңбер += 2

Бұл тең

шеңбер = шеңбер + 2

Сол сияқты - ＝, /=, *= бар.

10 -қадам: қозғалыс бағыты

Графиктің қай бағытта қозғалуы координатаны қалай өзгертуге байланысты. Егер ол y ＝ y ＋ 1 болып өзгертілсе, шеңбер төмен қарай жылжиды. Егер x және y екеуі де 1 -ге жоғарыласа, шеңбер төменгі оң жаққа төмен қарай жылжиды. Егер біз оны минус символы деп жазсақ, ол қарама -қарсы бағытта қозғалады.

[cceN_cpp theme = «таң»] int x, y; // Бір мезгілде бірнеше айнымалыны жариялай алады, бөлу үшін үтірді қолданыңыз. void setup () {size (300, 300); x = 0; y = 0; } void draw () {background (234, 113, 107); noStroke (); эллипс (x, y, 50, 50); x ++; y ++; }

[/cceN_cpp]

Қозғалыс жылдамдығы

Функция сызбасында секундына әдепкі 60 кадр есіңізде ме? Бұл жылдамдық бойынша жоғарыдағы шеңбер секундына 60 пиксельді оңға жылжытады.

Егер біз графикалық қозғалыстың жылдамдығын өзгерткіміз келсе, онда екі әдіс бар: біреуі өзгеретін кезден бастап әр уақытта x мәнін арттыру.

x ＝ x ＋ 10

Ол бастапқы жылдамдықпен салыстырғанда жылдамдықты 10 есе жақсартты!

Басқа әдіс - кенепті жаңарту жиілігін өзгерту. frameRate ()

Бұл функция кенептің тарату жиілігін өзгерте алады. FrameRate (10) функциясын орнатуға жазыңыз, ол бастапқы 60 кадрды секундына 10 кадрға өзгертеді. Жылдамдық бұрынғыға қарағанда 6 есе баяулады.

11 -қадам: назардан тыс қалған фон

Алдыңғы мысалдардың барлығы функционалды сызбаға фон жазады. Сіз оны функционалдылыққа жазуды ойладыңыз ба? Оның айырмашылықтары бола ма? Енді көлденең қозғалыстың мысалын жаңартайық.

[cceN_cpp theme = «таң»] int x, y; void setup () {size (300, 300); фон (234, 113, 107); x = 0; y = биіктік/2; } void draw () {noStroke (); эллипс (x, y, 50, 50); x += 1; } [/cceN_cpp]

Не болды? Мүмкін, ол мәселенің дұрыс шығарылу себебін түсіне алмайды. NoStroke функциясын жойыңыз, штрихты қайтадан қосыңыз және шеңбердің қозғалыс жолын қараңыз.

Бұрын құрылған шеңбер жойылмағандықтан! Функцияны орнату тек бір рет жұмыс істейтіндіктен, егер оның астына фон жазсақ, ол фонды тек бір рет толтырады, ал соңғысы бұдан былай әсер етпейді. Функционалды фон бояу шелегінің құралы сияқты. Қолданылғаннан кейін ол тек фондық түс орнатудың орнына кенептегі барлық мазмұнды жабады. Біз оны жаңа сызба жасаған сайын бұрынғы кадр жабылатындай етіп функцияның ұтыс алдында жазамыз. Сондықтан, шеңбер біз күткендей жүре алады. Әр функцияның қолданылуын еске түсіруден басқа, біз кодтың орны туралы ойлануымыз керек. Көп уақыт, коданың жоғары немесе төмен сызығы және оны жақшаның ішіне немесе сыртына жазу, ол мүлдем басқа әсерлер жасайды. Кодтың бағыты екі өлшемді. Егер қате пайда болса, біз осы екі өлшемде калибрлеуіміз керек.

• Бұл қайталанбайтын сурет әдісі дұрыс қолданылған жағдайда ерекше әсер тудыруы мүмкін. Сіз келесі кодты көшіріп, көріңіз.

[cceN_cpp theme = «таң»] void setup () {size (400, 400); } void draw () {ellipse (ені/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 = «таң»] өзгермелі x;

x = кездейсоқ (50, 100);

басып шығару (x); [/cceN_cpp]

Бағдарламаны іске қосқан сайын консоль әр түрлі мәндерді шығарады.

• Ескертпе: кездейсоқ функция арқылы жасалған мәндер өзгермелі нүкте түріне жатады (ондық сан түрі). Егер біз бүтін айнымалы мәнге мән бергіміз келсе, оны int () функциясы арқылы түрлендіруіміз керек. Трансформация дөңгелектенбейді, ондық бөлшекті тікелей жояды. Int (кездейсоқ (5)) шығысының тек 5 мүмкіндігі бар: 0, 1, 2, 3, 4.

Кездейсоқ функцияны қолданумен танысқаннан кейін, біз төмендегі жағдайға тікелей кіре аламыз.

[cceN_cpp theme = «таң»] int x, y; void setup () {size (300, 300); x = ені/2; y = биіктік/2; } void draw () {background (234, 113, 107); noStroke (); x += int (кездейсоқ (-5, 5)); y += int (кездейсоқ (-5, 5)); эллипс (x, y, 50, 50); }

[/cceN_cpp]

Бұрынғы қосылған координаталық мәндер бекітілген. Тек кездейсоқ мәнді арттырсақ, шеңбер белгісіз бағытта қозғалады. Үлкен кездейсоқ диапазонда ол жиі дірілдейді. Кадрлар арасындағы мәннің ауысуы көтерілгендіктен, қозғалыс бұдан былай тегіс болмайды. Бұрынғы жақтау (150, 150) болғанда, соңғы кадр (170, 170) позициясына жылжиды.

13 -қадам: Көші -қон шеңбері

Көші -қон шеңбері

Бұл тегіс қозғалысты тудырады ма? Функционалды шу бізге көмектесе алады. Ол стандартты кездейсоққа қарағанда жақсы ырғаққа ие. Ал кездейсоқ сандар үздіксіз болады.

Шақыру пішімі:

шу

Функционалды шу оның шығу диапазонын анықтай алмайды. Бағдарлама 0 -ден 1 -ге дейінгі өзгермелі нүкте сандарын ғана құра алатынын анықтайды, ал тұрақты кірістің тек тұрақты шығысы болуы мүмкін.

[cceN_cpp theme = «таң»] өзгермелі x = шу (5); float y = шу (5); басып шығару (x, y); [/cceN_cpp]

Жоғарыда көрсетілген кіріс параметрлері 5 болғандықтан, шығыс нәтижелері бірдей болады, содан кейін нәтижені қалай өзгертуге болады? Жауап - кіріс параметрлерін динамикалық түрде өзгерту. Шын мәнінде, біз шуды дауысты трек ретінде қарастыра аламыз, кіріс параметрлері дәл «қазіргі уақыт» сияқты. Егер параметр енгізу үздіксіз болса, шығыс та үздіксіз болады.

[cceN_cpp theme = «таң»] өзгермелі x, y; void setup () {size (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 theme = «таң»] өзгермелі x, y1, y2, y3, y4, y5; void setup () {size (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 = «таң»] өзгермелі x, y; void setup () {size (300, 300); x = 0; } void draw () {background (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 () {size (300, 300); x = 0; y = 0; } void draw () {background (234, 113, 107); noStroke (); x = mouseX; y = тышқанY; эллипс (x, y, 50, 50); }

[/cceN_cpp]

mouseX тінтуірдің x координатын алады, ал mouseY у координатын алады.

• Оң және теріс таңбаны өзгертуге немесе mouseX пен mouseY алмасуға тырысайық.

15 -қадам: Аяқтау

Осы таныс командалардың көмегімен сіз графикалық қозғалысты жүргізе аласыз. Соңғы тараудың мазмұнымен қиялыңызды дұрыс қолданыңыз, сіз көптеген қызықты анимациялық әсерлер жасай аласыз.

Келесі тарауда біз көптеген мысалдарды көре аламыз. Сонымен қатар, біз математикалық функцияларды қолданамыз және оны графикалық қозғалыспен біріктіреміз.

Бұл мақала дизайнер Вензиден келеді.

16 -қадам: Салыстырмалы көрсеткіштер:

Дизайнер үшін қызықты бағдарламалау нұсқаулығы-бастапқы сенсорды өңдеу

Дизайнерге арналған қызықты бағдарламалау нұсқаулығы-Бірінші өңдеу бағдарламасын жасаңыз

Бұл мақала:

Егер сізге көмек қажет болса, мына мекенжайға хабарласа аласыз: [email protected].