WEBVTT 00:00:00.000 --> 00:00:03.972 Вы уже научились создавать переменные и использовать их. 00:00:03.972 --> 00:00:10.790 Сейчас мы изучим две особые переменные: mouseX и mouseY. 00:00:10.790 --> 00:00:16.658 В данном случае вам не придется создавать эти переменные самостоятельно, в общем-то, вам и не нужно, так как они уже есть. 00:00:16.658 --> 00:00:28.171 Видите ли, программа устанавливает значения этих переменных без вашего ведома, закрепляя значение mouseX за y-положением вашего курсора, а значение mouseY - за y-положением вашего курсора. 00:00:28.171 --> 00:00:33.278 Это позволяет с большой легкостью делать отличные интерактивные программки, основанные на положении пользовательского курсора. 00:00:33.278 --> 00:00:36.508 Давайте взглянем на круг, который я здесь нарисовала. 00:00:36.508 --> 00:00:41.192 Так, я всегда рисую его в точке 200,200. 00:00:41.192 --> 00:00:49.718 Если я использую mouseX и mouseY, эти особые переменные, тогда я могу нарисовать его буквально в точке mouseX и mouseY. 00:00:49.718 --> 00:00:57.743 И сейчас, если я повожу курсором по холсту, вы можете увидеть, что кружок постоянно появляется в месте, где находится мой курсор - так, что он повсюду следует за моим курсором. 00:00:57.743 --> 00:01:01.760 Здорово! 00:01:01.760 --> 00:01:13.839 Если вы планируете использовать mouseX и mouseY, убедитесь, что вы используете их внутри функции draw. Посмотрите, что произойдет, если мы уберем эти две строчки кода за пределы функции draw. 00:01:13.839 --> 00:01:15.501 Видите? 00:01:15.501 --> 00:01:26.955 Сейчас этот код запускается единожды, так что круг нарисован всего один раз, и нарисован он там, где мой курсор находился при самом старте программы. 00:01:26.955 --> 00:01:36.303 Вот именно поэтому код должен быть прописан внутри функции draw, потому что функция draw - это такая функция, которая вызывается постоянно и непрерывно, пока наша программа работает. 00:01:36.303 --> 00:01:43.735 Так что, когда эта функция вызывается, она обращает внимание на текущее значение mouseX и mouseY и затем рисует круг именно в этой точке. 00:01:43.735 --> 00:01:49.481 Если вы задумаетесь об этом, это в действительности очень похоже на анимацию - она меняется с течением времени, просто немного по-другому. 00:01:49.481 --> 00:01:52.957 Замечательно, теперь мы можем делать множество забавных вещей. 00:01:52.957 --> 00:02:03.871 А что случится, если вместо рисования круга в позиции mouseX, mouseY, я нарисую его в той же позиции mouseX, но поменяю значение mouseY, скажем, на 300? 00:02:03.871 --> 00:02:10.589 Теперь вы видите, что круг сопровождает курсор только по оси координат x, не замечая, что я делаю на оси координат y. 00:02:10.589 --> 00:02:21.937 Хорошо, а если я нарисую его на в позиции mouseX, mouseY, вернув все на место, но избавлюсь от заднего плана, просто вынесу его в комментарии? 00:02:21.937 --> 00:02:27.933 Вы только посмотрите! Я получила эту клевую кисточку. Здорово! 00:02:27.933 --> 00:02:39.509 Или, или, я могу просто поменять местами эти переменные. Давайте вернем фон. Я поменяю переменные mouseX и mouseY местами, и увидим, что получится. 00:02:39.509 --> 00:02:45.907 Теперь стало совсем уж странно. Курсор делает все, что я ему велю, строго наоборот. 00:02:45.907 --> 00:02:53.400 Но это и здорово, вы могли бы придумать целую игру, где нужно нарисовать что-нибудь или сделать что-то, используя инверсное управление курсором. 00:02:53.400 --> 00:02:59.808 Вот и все про mouseX и mouseY - довольно весело. Наслаждайтесь!