Найти тему

Пишу pin up Sudoku на processing. Часть 2.

Оглавление

Это вторая часть моей статьи про среду разработки processing, и про то как я пытаюсь написать свою игру sudoku. Начало можно прочитать здесь.

Картинка которая притягивает взгляд.
Картинка которая притягивает взгляд.

Мы уже попробовали запустить наше приложение и даже написали первую сточку кода которая поприветствовала планету. Успех был феерический!!!

Результат колоссально проделанной работы!
Результат колоссально проделанной работы!

Теперь настало время воплотить мой план по созданию игры которая станет хитом века, ну если не века то в топ игр 2021 войдет однозначно!!!

Этап, номер раз.

Прежде всего нам нужно изменить размер нашего окошка в котором будет отображаться наша игра. Как и в большинстве языков программирования, для написания кода используются команды и функции. Нам в данный момент понадобится функция setup в которой мы выполним команду size . Для объявления функции нам понадобится определить ее статус, то есть что она будет возвращать. А так как она не чего возвращать не будет, перед функцией setup мы напишем void. В теле этой функции мы вставим команду size в скобках которой укажем размер нашего окна 640 на 480.

Должно получится как то так.
Должно получится как то так.

Запускаем наш проект и любуемся каркасом нашей будущей программы.

Будущий хит 2021
Будущий хит 2021

Сохраним проект под именем нашей будущей игры. Выбираем вкладку "Файл", "Сохранить как". И указываем название.

Сохраняем наш проект
Сохраняем наш проект

Результатом этих манипуляций будет, во первых при запуске processing мы сможем определить что нам запустить для дальнейшей работы над нашем проектом. И второе название исполняемого окна изменится на название нашей программы.

Мы сменили название нашей игры
Мы сменили название нашей игры

Теперь мы изменим фон нашего приложения используя команду background(). В качестве параметры этой команды мы можем вставить код RGB значение данных типа color. Либо вписать три значения обозначающие цвета по отдельности. Или указать переменную типа image(). Более подробней можно почитать в описании команд. Перечень всех команд используемых в processing можно ознакомится здесь.

Теперь добавляем функцию draw() которая будет обрисовывать наше окно каждый кадр. Внутрь этой функции помещаем нашу команду по отображению задника, с такими параметрами background(120);. В итоге у нас должно получится как то так.

Код с добавленной функцией.
Код с добавленной функцией.
Результат проделано работы
Результат проделано работы

Этап, номер два.

С подготовкой окна для нашей игры на данном этапе считаю пока достаточно. Теперь приступим к написанию кода для вывода поля на котором и будет происходить весь процесс игры. Поле в sudoku это квадраты с числами распределенные на 9 секторов.

Поле sudoku
Поле sudoku

И мы, создадим функцию которая будет выводить поле для нашей игры. Оно будет состоять из квадратов размером 32 на 32 пикселя.

Конечно можно было пойти простым путем и нарисовать такое поле в графическом редакторе и затем при помощи команды loadImage() загрузить в проект. А используя команду image() выводить ее в нужное место окна. Но это не наш метод. Как говорится мы простых путей не ищем. По этому, поле мы будем создавать программно. Делая это мы и изучим более подробно саму среду программирования processing.

Значит решили. Для вывода отдельного поля под каждую цифру мы будем использовать команду rect() с такими параметрами, rect(10, 10, 32, 32). Первые две цифры обозначают координаты в которые будет выводится наш квадратик. Следующие две цифры это размер квадрата по длине и по высоте. Еще нам понадобится команда которая будет вывода цифры внутри нашего квадрата. Это команда text(). Параметры этой команды следующие, с начало указывается переменная которая будет отображаться этой командой. Затем следуют две переменные которые будут указывать позицию вывода, по X и Y. И для того чтоб изменять цвет мы будем использовать команду fill(). В качестве параметров этой команды мы будем использовать переменные для обозначения цвета в виде RGB. Либо переменную типа color(). И для нашего проекта естественно понадобятся переменные. Пока это переменных для определения цвета, colorFonBox, colorTextNumer. Их мы объявим в начале наброска. И выглядеть это будет так:

Как видно из результата выполнения нашего кода то циферка в поле маловата. Изменить размер мы сможем используя команду textSize(). Параметром этой команды служит переменная типа int задающая размер шрифта для выводимого командой text(). И чтоб не загромождать функцию drow(), мы создадим свою функцию и назовем ее box. А принимать она у нас будет несколько параметров. Координаты по X и Y, а в дальнейшем мы добавим еще парочку, но это потом. Теперь должно получится как то так:

Указывая в функции box() любые координаты наш квадратик можно нарисовать в том месте окна где мы захотим. И по поводу команды textSize(), задавать размер шрифта наверно лучше в функции setup(). Но в нашей игре будут использоваться текст разным размером, и когда при запуске, текст будет отображаться не корректно, лазь по коду и ищи где я накосячил.

Следующий этап.

Настало время приступить к формированию нашего поля 9 на 9 клеток. Для этого создадим еще одну нашу функцию, и обзовем ее field(). Параметрами естественно будут координаты куда мы будем рисовать наше поле. В этой функции будем использовать два цикла for() и пару внутренних переменных, newX, newY для расположение квадратов на поле.

Получилось очень даже достойно. Так что на сегодня пока достаточно. У нас получились две собственные функции которые формируют поле для игры sudoku. Если вам было лень переписывать самостоятельно код, то свой проект я поместил в архив, и его можно скачать по ссылке. А на этом я буду заканчивать и завтра я засяду писать следующую статью про мой проект. Надеюсь моя статья вам понравилась и вы ее оцените. До свидания и до следующей статьи.