Blob Blame Raw
<html>
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css" />
<title>Рисование - Helianthus</title>
</head>
<body>
<div class="navigation">
  <p><a href="index.html">Helianthus</a></p>
  <p><a href="common.html">Запуск и общие функции</a></p>
  <p><a href="input.html">Клавиатура и мышь</a></p>
  <p><a href="drawing.html">Рисование</a></p>
  <p><a href="sprites.html">Спрайты</a></p>
  <p><a href="groups.html">Группы спрайтов</a></p>
  <p><a href="camera.html">Камера</a></p>
  <p><a href="sound.html">Звук</a></p>
  <hr />
  <p><a href="functions.html">Все функции</a></p>
</div>
<div class="content">

<h1>Рисование</h1>

<p>Перечисленные ниже функцию позволяют рисовать на экране различные фигуры и текст.</p>

<p>Для указания цвета используется его текстовое наименование.<br />
Вот список наименований:<br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"transparent",</i><br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"black",</i><br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"white",</i><br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"gray",</i><br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"red",</i><br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"green",</i><br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"blue",</i><br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"yellow",</i><br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"magenta",</i><br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"cyan",</i><br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"yellow",</i><br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"magenta",</i><br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"cyan",</i><br />
<i>&nbsp;&nbsp;&nbsp;&nbsp;"brown".</i></p>

<p>Также поддерживаются цвета в кодировка #RRGGBBAA:<br />
&nbsp;&nbsp;&nbsp;&nbsp;#000000 — чёрный;<br />
&nbsp;&nbsp;&nbsp;&nbsp;#ff0000 — красный;<br />
&nbsp;&nbsp;&nbsp;&nbsp;#0000ff — синий;<br />
&nbsp;&nbsp;&nbsp;&nbsp;#00ff00aa — зелёный полупрозрачный.</p>

<p>Вы можете сгенерировать текстовое наименования для любого цвета по его числовым составляющим при помощи функций <a href="drawing.html#rgb">rgb</a> и <a href="drawing.html#rgba">rgba</a>.</p>

<p>Для рисования линий и многоугольников используются функции <a href="drawing.html#moveTo">moveTo</a>, <a href="drawing.html#lineTo">lineTo</a>, <a href="drawing.html#closePath">closePath</a>, <a href="drawing.html#strokePath">strokePath</a>. При этом функции <a href="drawing.html#stroke">stroke</a> и <a href="drawing.html#fill">fill</a> задают цвет линий и заливки. Функция <a href="drawing.html#strokeWeight">strokeWeight</a> задаёт толщину линий. Вот пример рисования красного треугольника с чёрным контуром:</p>

<pre>
fill("red");
stroke("black");
strokeWeight(10);
moveTo(100, 300);
lineTo(300, 300);
lineTo(50, 200);
closePath();
</pre>


<p>Также существуют отдельные функции для рисования прямоугольников, линий, эллипсов и дуг окружности, смотрите описания функций ниже.</p>

<p>Для вывода текста используются функции <a href="drawing.html#text">text</a>, <a href="drawing.html#textAlign">textAlign</a>, <a href="drawing.html#textFont">textFont</a><i>Family</i> и <a href="drawing.html#textSize">textSize</a>. Смотрите их описание ниже. Вы можете загружать собственные шрифты из файлов (TrueType или OpenType) при помощи функций <a href="drawing.html#createFont">createFont</a> и <a href="drawing.html#textFont">textFont</a>.</p>

<h2>Функции:</h2>

<h3 id="background">void background(const char *color);</h3>

<p>Установить цвет фона. Начиная со следующего все кадры будут рисоваться на выбранном фоне.</p>

<h4>Параметры:</h4>

<p><i>color</i> — текстовое наименование цвета.</p>

<h3 id="fill">void fill(const char *color);</h3>

<p>Установить цвет заливки. После вызова этой функции все фигуры будут заполняться выбранным цветом. См. также <a href="drawing.html#noFill">noFill</a>.</p>

<h4>Параметры:</h4>

<p><i>color</i> — текстовое наименование цвета.</p>

<h3 id="noFill">void noFill();</h3>

<p>Отключить заливку фигур. После вызова этой функции все фигуры будут рисоваться без заполнения. См. также <a href="drawing.html#fill">fill</a>.</p>

<h3 id="stroke">void stroke(const char *color);</h3>

<p>Установить цвет контура. После вызова этой функции все фигуры будут рисоваться с контуром выбранного цвета. Также эта функция задаёт цвет рисования текста См. также <a href="drawing.html#noStroke">noStroke</a>.</p>

<h4>Параметры:</h4>

<p><i>color</i> — текстовое наименование цвета.</p>

<h3 id="noStroke">void noStroke();</h3>

<p>Отключить рисование контура. После вызова этой функции все фигуры будут рисоваться без прорисовки контура. См. также <a href="drawing.html#stroke">stroke</a>.</p>

<p><b>Важно: </b>Так как текст рисуется цветом контура, эта функция полностью отключает вывод текста.</p>

<h3 id="strokeWeight">void strokeWeight(double weight);</h3>

<p>Установить толщину линий и контуров. После вызова этой функции все линии и контуры будут рисоваться с заданной толщиной.</p>

<h4>Параметры:</h4>

<p><i>weight</i> — толщина линии.</p>

<h3 id="rgb">const char* rgb(double r, double g, double b);</h3>

<p>Функция возвращает текстовое наименование цвета для заданных числовых значений яркости красной, зелёной и синей составляющих.</p>

<p>Параметры:</p>

<p><i>r</i> — яркость красной составляющей цвета, дробное число от 0 до 1;<br />
<i>g</i> — яркость зелёной составляющей цвета, дробное число от 0 до 1;<br />
<i>b</i> — яркость синей составляющей цвета, дробное число от 0 до 1.</p>

<h3 id="rgba">const char* rgba(double r, double g, double b, double a);</h3>

<p>Функция возвращает текстовое наименование цвета для заданных числовых значений яркости красной, зелёной и синей составляющих, а также прозрачности.</p>

<h4>Параметры:</h4>

<p><i>r</i> — яркость красной составляющей цвета, дробное число от 0 до 1;<br />
<i>g</i> — яркость зелёной составляющей цвета, дробное число от 0 до 1;<br />
<i>b</i> — яркость синей составляющей цвета, дробное число от 0 до 1;<br />
<i>a</i> — прозрачность, дробное число от 0 до 1, при этом 0 — цвет полностью прозрачный, 1 — цвет непрозрачный.</p>

<h3 id="moveTo">void moveTo(double x, double y);</h3>

<p>Начать рисование новой фигуры, и задать начальное положение пера. Перед запуском этой функции убедитесь что вы завершили рисование предыдущей фигуры функцией <a href="drawing.html#closePath">closePath</a> или <a href="drawing.html#strokePath">strokePath</a>.</p>

<h4>Параметры:</h4>

<p><i>x</i>, <i>y</i> — координаты в которые будет помещено перо.</p>

<h3 id="lineTo">void lineTo(double x, double y);</h3>

<p>Наметить линию от текущих координат пера до заданной точки, а также перевести перо в указанною точку. Настоящая линия будет нарисована позже при помощи функции <a href="drawing.html#closePath">closePath</a> или <a href="drawing.html#strokePath">strokePath</a>. См. также функцию <a href="drawing.html#moveTo">moveTo</a>.</p>

<p><b>Важно:</b> если положение пера не было задано, то линия не намечается, вместо этого просто задаётся начальное положение пера.</p>

<h3 id="resetPath">void resetPath();</h3>

<p>Убрать все намеченные функцией <a href="drawing.html#lineTo">lineTo</a> или <a href="drawing.html#arcPath">arcPath</a> линии и отменить их рисование. Положение пера также забывается.</p>

<h3 id="closePath">void closePath();</h3>

<p>Завершить контур соединив начальную и конечную точки линией и нарисовать заполненную фигуру с контуром. Цвета заполнения и контура задаются функциями <a href="drawing.html#fill">fill</a> и <a href="drawing.html#stroke">stroke</a>. См. также функции <a href="drawing.html#moveTo">moveTo</a> и <a href="drawing.html#lineTo">lineTo</a>. После вывода фигуры на экран положение пера и все намеченные линии забываются.</p>

<h3 id="strokePath">void strokePath();</h3>

<p>Нарисовать ранее намеченные линии. В отличии от функции <a href="drawing.html#closePath">closePath</a>, данная функция не соединяет начальную и конечную точки, а просто рисует только те линии которые были намечены. Цвет контура задаётся функцией <a href="drawing.html#stroke">stroke</a>, а вот заполнение цветом не производится. После вывода намеченных линий на экран, их расположение и позиция пера забываются.</p>

<h3 id="rect">void rect(double x, double y, double width, double height);</h3>

<p>Нарисовать прямоугольник. Цвета заполнения и контура задаются заранее функциями <a href="drawing.html#fill">fill</a> и <a href="drawing.html#stroke">stroke</a>.</p>

<h4>Параметры:</h4>

<p><i>x</i>, <i>y</i> — координаты левого верхнего угла прямоугольника;<br />
<i>width</i> — ширина прямоугольника;<br />
<i>height</i> — высота прямоугольника.</p>

<h3 id="ellipse">void ellipse(double x, double y, double width, double height);</h3>

<p>Нарисовать эллипс. Эллипс рисуется таким чтобы от вписался в ограничивающий прямоугольник (см. функцию <a href="drawing.html#rect">rect</a>). Следовательно для того чтобы нарисовать окружность нужно передать одинаковую ширину и высоту ограничивающего прямоугольника. Цвета заполнения и контура задаются заранее функциями <a href="drawing.html#fill">fill</a> и <a href="drawing.html#stroke">stroke</a>.</p>

<h4>Параметры:</h4>

<p><i>x</i>, <i>y</i> — координаты левого верхнего угла ограничивающего прямоугольника;<br />
<i>width</i> — ширина ограничивающего прямоугольника;<br />
<i>height</i> — высота ограничивающего прямоугольника.</p>

<h3 id="arc">void arc(double x, double y, double w, double h, double start, double stop);</h3>

<p>Нарисовать дугу эллипса заданного ограничивающим прямоугольником. Дуга задаётся значением начального и конечного угла. Цвет линии задаётся функцией <a href="drawing.html#stroke">stroke</a>.</p>

<p>Параметры:</p>

<p><i>x</i>, <i>y</i> — координаты левого верхнего угла ограничивающего прямоугольника;<br />
<i>width</i> — ширина ограничивающего прямоугольника;<br />
<i>height</i> — высота ограничивающего прямоугольника;<br />
<i>start</i> — начальный угол в градусах;<br />
<i>end</i> — конечный угол в градусах.</p>

<h3 id="arcPath">void arcPath(double x, double y, double w, double h, double start, double stop);</h3>

<p>Наметить дугу эллипса заданного ограничивающим прямоугольником так как если бы она рисовалась функциями <a href="drawing.html#moveTo">moveTo</a> и <a href="drawing.html#lineTo">lineTo</a>. Дуга задаётся значением начального и конечного угла. Окончательное рисование будет выполнено после вызова функции <a href="drawing.html#closePath">closePath</a> или <a href="drawing.html#strokePath">strokePath</a>.</p>

<h4>Параметры:</h4>

<p><i>x</i>, <i>y</i> — координаты левого верхнего угла ограничивающего прямоугольника;<br />
<i>width</i> — ширина ограничивающего прямоугольника;<br />
<i>height</i> — высота ограничивающего прямоугольника;<br />
<i>start</i> — начальный угол в градусах;<br />
<i>end</i> — конечный угол в градусах.</p>

<h3 id="line">void line(double x1, double y1, double x2, double y2);</h3>

<p>Провести прямую линию от первой указанной точки до второй. Цвет линии задаётся функцией <a href="drawing.html#stroke">stroke</a>.</p>

<p>Параметры:</p>

<p><i>x</i><i>1</i>, <i>y</i><i>1</i> — координаты первой точки;<br />
<i>x</i><i>2</i>, <i>y</i><i>2</i> — координаты второй точки.</p>

<h3 id="point">void point(double x, double y);</h3>

<p>Нарисовать точку в указанных координатах. Цвет задаётся функцией <a href="drawing.html#stroke">stroke</a>. Диаметр точки задаётся функцией <a href="drawing.html#strokeWeight">strokeWeight</a>.</p>

<h4>Параметры:</h4>

<p><i>x</i>, <i>y</i> — координаты точки.</p>

<h3 id="regularPolygon">void regularPolygon(double x, double y, int sides, double size);</h3>

<p>Нарисовать правильный многоугольник заданного размера с центром в указанной точке. Цвета заполнения и контура задаются функциями <a href="drawing.html#fill">fill</a> и <a href="drawing.html#stroke">stroke</a>.</p>

<p>Параметры:</p>

<p><i>x</i>, <i>y</i> — координаты центра многоугольника;<br />
<i>sides</i> — количество сторон;<br />
<i>size</i> — размер многоугольника — диаметр описанной окружности.</p>

<h3 id="text">void text(const char *text, double x, double y);</h3>

<p>Вывести текст в заданной точке. Расположение текста относительно указанной точки задаётся функцией <a href="drawing.html#textAlign">textAlign</a>. Шрифи и размер задаются функциями <a href="drawing.html#textFont">textFont</a> и <a href="drawing.html#textSize">textSize</a>. Цвет текста задаётся функцией <a href="drawing.html#stroke">stroke</a>.</p>

<h4>Параметры:</h4>

<p><a href="drawing.html#text">text</a> — текст для вывода;<br />
<i>x</i>, <i>y</i> — координаты начальной точки.</p>

<h3 id="textAlign">void textAlign(HAlign hor, VAlign vert);</h3>

<p>Установить расположение текста относительно начальной точки (см. функцию <a href="drawing.html#text">text</a>)</p>

<h4>Параметры:</h4>

<p><i>hor</i> — горизонтальное расположение начальной точки текста, может принимать значения:<br />
&nbsp;&nbsp;&nbsp;&nbsp;<i>HALIGN_LEFT</i> — начальная точка находится по левому краю текста;<br />
&nbsp;&nbsp;&nbsp;&nbsp;<i>HALIGN_CENTER</i> — начальная точка находится в середине текста;<br />
&nbsp;&nbsp;&nbsp;&nbsp;<i>HALIGN_RIGHT</i> — начальная точка находится по правому краю текста.<br />
<i>vert</i> — вертикальное расположение начальной точки текста, может принимать значения:<br />
&nbsp;&nbsp;&nbsp;&nbsp;<i>VALIGN_TOP</i> — начальная точка находится по верхнему краю текста;<br />
&nbsp;&nbsp;&nbsp;&nbsp;<i>VALIGN_CENTER</i> — начальная точка находится в середине текста;<br />
&nbsp;&nbsp;&nbsp;&nbsp;<i>VALIGN_BOTTOM</i> — начальная точка находится по нижнему краю текста.</p>

<h3 id="textSize">void textSize(double size);</h3>

<p>Установить размер текста (см. функцию <a href="drawing.html#text">text</a>).</p>

<h4>Параметры:</h4>

<p><i>size</i> — размер текста в пикселях.</p>

<h3 id="textFontFamily">void textFontFamily(const char *family);</h3>

<p>Задать один из установленных в системе шрифтов для вывода текста (см. функцию <a href="drawing.html#text">text</a>). Можете посмотреть списки установленных шрифтов в любом установленном на вашем компьютере текстовом редакторе. Вернуть стандартный шрифт можно командой <a href="drawing.html#textFontDefault">textFontDefault</a>. Для загрузки шрифтов из фала смотрите функции <a href="drawing.html#createFont">createFont</a> и <a href="drawing.html#textFont">textFont</a>.</p>

<h4>Параметры:</h4>

<p><i>f</i><i>amily</i> — текстовое наименование шрифта.</p>

<h3 id="textFontDefault">void textFontDefault();</h3>

<p>Вернуть стандартный шрифт для вывода текста. Отменяет действие функций <a href="drawing.html#textFont">textFont</a> и <a href="drawing.html#textFontFamily">textFontFamily</a>.</p>

<h3 id="createFont">Font createFont(const char *path);</h3>

<p>Загрузить шрифт из файла. Функция возвращает значение типа <i>Font</i>, которое является адресом в памяти — указателем на описание шрифта внутри библиотеки Helianthus.</p>

<p>Данная функция только загружает шрифт в память, для того чтобы писать текст этим шрифтом на экране вам нужно вызвать ещё и функцию <a href="drawing.html#textFont">textFont</a>. Вы может иметь множество загруженных шрифтов в программе и переключать их функцией <a href="drawing.html#textFont">textFont</a>.</p>

<p>См. также <a href="drawing.html#fontDestroy">fontDestroy</a>.</p>

<h4>Параметры:</h4>

<p><i>path</i> — путь к файлу шрифта.</p>

<h3 id="fontDestroy">void fontDestroy(Font font);</h3>

<p>Выгрузить шрифт из памяти.</p>

<p><b>Важно:</b> Скорее всего у вас в программе останется переменная в которой хранился указатель на шрифт. Этот указатель станет недействителен — будет указывать на неопределённую область памяти — не на шрифт. Вы можете занести в эту переменную другой шрифт, но использовать старое значение переменной больше нельзя это приведёт у ошибкам и непредсказуемому поведению программы.</p>

<h3 id="textFont">void textFont(Font font);</h3>

<p>Выбрать ранее загруженный из файла шрифт для вывода текста (см. функции <a href="drawing.html#createFont">createFont</a> и <a href="drawing.html#text">text</a>). Вернуть стандартный шрифт можно командой <a href="drawing.html#textFontDefault">textFontDefault</a>. Для загрузки системных шрифтов смотрите функцию <a href="drawing.html#textFontFamily">textFontFamily</a>.</p>

<h4>Параметры:</h4>

<p><i>font</i> — шрифт загруженный функцией <a href="drawing.html#createFont">createFont</a>.</p>

</div>
</body>
</html>