Рисование на канве компонентов

Вывод текста на канву компонента

В следующей лекции будут рассмотрены специализированные компоненты библиотеки Juce для отображения и ввода текстовой информации. Но помимо этих компонентов отображать текст можно на поверхности любого компонента в виде графики, переопределяя его метод paint.

Так же, как и при рисовании графических примитивов, цвет текста задаётся методом void Graphics::setColour(const Colour& newColour).

Вывод текста на канву осуществляют два метода:

• void Graphics::drawSingleLineText(const String& text, int startX, int baselineY) const — выводит текст text, расположенный в одну строку, начиная с позиции с координатами startX, baselineY;
• void Graphics::drawMultiLineText(const String& text, int startX, int baselineY, int maximumLineWidth) const — выводит текст text, расположенный в несколько строк, начиная с позиции с координатами startX, baselineY. Параметр maximumLineWidth задаёт максимальную ширину строки в пикселях; часть текста, ширина которой превышает эту величину, переносится на следующую строку.

Надписи в обоих методах делаются в соответствии с текущими установками шрифта компонента. Для задания шрифта текста используются методы класса Graphics:

• void Graphics::setFont(const Font& newFont) — принимает в качестве параметра новый объект класса шрифта Font;
• void Graphics::setFont(float newFontHeight, int fontStyleFlags = Font::plain) — задаёт новые размер и стиль текущего шрифта; гарнитура при этом остаётся неизменной.

Пример вывода текста на канву компонента содержимого этими методами представлен в листинге 7.8.

void TCentralComponent::paint(Graphics& Canvas)
{
  // Фон виджета - белый
  Canvas.fillAll(Colours::white);
  
  // Цвет выводимого текста - чёрный
  Canvas.setColour(Colours::black);
  
  Canvas.drawSingleLineText(tr("Однострочный текст выведен 
            на позицию (10, 30)"), 10, 30);
  
  // Цвет выводимого текста - синий
  Canvas.setColour(Colours::blue);
  Canvas.setFont(Font(25.0000f, Font::bold));
  Canvas.drawMultiLineText(tr("Многострочный текст выведен 
            на позицию (10, 80). 
            \n\n\t\t\t\t\t\t\t\t\tПРИВЕТ, МИР!"), 
            10, 80, 550);
}

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

Рис. 7.8. Программа, рисующая однострочный и многострочный текст на канве компонента содержимого

Особенности Juce 2.0

По сравнению с версией 1.53 метод Graphics::drawDashedLine во второй версии Juce претерпел изменения: теперь в качестве параметров принимаются не числа — координаты начала и конца пунктирной линии, а объект класса Line, предназначенного как раз-таки для хранения информации о линиях:

void Graphics::drawDashedLine(
             const Line< float >& line, 
             const float* dashLengths, 
             int numDashLengths, 
             float lineThickness = 1.0f, int  	
             dashIndexToStartFrom = 0) const 

Один из конструкторов класса Line принимает в качестве параметров значения координат начала и конца линии: Line<ValueType>::Line(ValueType startX, ValueType startY, ValueType endX, ValueType endY).

Понятно, что пример из листинга 7.3 легко переделать для версии 2.0 Juce ( пример 7.9)

void TCentralComponent::paint(Graphics& Canvas)
{
  // Фон виджета - белый
  Canvas.fillAll(Colours::white);
  
  // Цвет рисуемых линий - чёрный
  Canvas.setColour(Colours::black);
  
  int iPointsNumber = 8;
  // Массивы для хранения координат точек, 
  // через которые будут проходить линии
  Array<float> fXs;
  Array<float> fYs;
  // Вычисляем координаты точек
  for(int i = 0; i < iPointsNumber; ++i)
  {
    float fAngle = 2 * float_Pi * i / iPointsNumber;
    int iX = 50 + cos(fAngle) * 40;
    int iY = 50 + sin(fAngle) * 40;
    // и сохраняем их в массивах
    fXs.add((float)iX);
    fYs.add((float)iY);
  }

  // Отрезок линии - 8 пикселей,
  // пробел - 4 пикселя
  float fDashLengths[] = {8, 4};
  for(int i = 0; i < iPointsNumber; ++i)
  {
    if(i != 7)
    {
      // Рисуем линию толщиной 3 пикселя
      Canvas.drawDashedLine(
            Line<float>(fXs[i], fYs[i], fXs[i + 1], fYs[i + 1]), 
            fDashLengths, 2, 3.0f);
    }
    else
    {
      // Завершаем многоугольник
      Canvas.drawDashedLine(
            Line<float>(fXs[7], fYs[7], fXs[0], fYs[0]), 
            fDashLengths, 2, 3.0f);
    }
  }
}

Краткие итоги

Для рисования чего бы то ни было на канве компонентов в Juce используется метод paint класса Graphics, который включает ряд методов для изображения графических примитивов и произвольных фигур.

Упражнение

Создайте программу с одним главным окном белого цвета с неизменяемыми размерами. С помощью методов класса Graphics нарисуйте на канве компонента содержимого российский флаг.

Дополнительные материалы

Архив с исходными текстами примеров Вы можете скачать здесь