Программирование для Android и работа с датчиками в среде Delphi 11

procedure TForm1.FormPaint (Sender: TObject; Canvas: TCanvas; const ARect: TRectF);

var

p1,p2:TPointF;

begin

p1.X:=Image1.Position. X;

p1.Y:=Image1.Position. Y;

p2.X:=Image1.Position. X+100;

p2.Y:=Image1.Position. Y+150;

if Canvas.BeginScene =true then

try

Canvas.Stroke.Kind:=TBrushKind.Solid;

Canvas. DrawLine (p1,p2,10);

finally

Canvas. EndScene;

end; end;

var

p1,p2:TPoint;

begin // Рисует линию

p1.X:= 40;

p1.Y:= 40;

p2.X:= 100;

p2.Y:= 100;

Image1.Canvas.BeginScene;

Image1.Canvas. DrawLine (p1,p2,1.0);

Image1.Canvas. EndScene;

end;

//Рисует квадрат

Var

R: Trect;

begin

R. Left:= 30;

R.Top:= 30;

R. Right:= 100;

R.Bottom:= 100; // Y1

Image1.Canvas.BeginScene; //создание графической сцены

Canvas.Fill.Kind:= TBrushKind. bkSolid; // Тип линии

Canvas.Fill.Color:= TAlphaColors. Blue; // Цвет закраски области

Image1.Canvas.DrawRect(r,5,5,[TCorner.TopLeft,

TCorner.BottomLeft],0.8);

Image1.Canvas. EndScene; //завершение сцены и вывод изображения на экран

end;

DrawRect(r,5,5,[TCorner.TopLeft, TCorner.BottomLeft],0.8) – включает указания на область вывода прямоугольника (r), радиусы закругления углов (5,5) с указанием какие именно углы следует закруглить [TCorner.TopLeft, TCorner.BottomLeft] и указать степень прозрачности фигуры (0.8).

Для прорисовки на поверхности холста графического образа следует создать Bitmap: метод DrawBitmap (const ABitmap: TBitmap; const SrcRect, DstRect: TRectF; const AOpacity: Single; const HighSpeed: Boolean = False):

var

ABitmap: TBitmap;

aWidth, aHeight: integer;

SrcRect, DstRect: TRectF;

begin

with Form1.Canvas do

begin

ABitmap:= TBitmap.Create;

aWidth:= ABitmap. Width;

aHeight:= ABitmap. Height;

SrcRect:= RectF (0,0,aWidth, aHeight);

DstRect:= SrcRect;

if BeginScene then

begin

DrawBitmap (ABitmap, SrcRect, DstRect,1,true);

EndScene;

end;

end; end;

Изображение ABitmap полностью или его части представлено SrcRect, место вывода и размеры – в параметре DstRect.

Параметр HighSpeed позволяет предпочтение скорости (true) или качеству (false) вывода.

Фрагмент исходного рисунка, можно ограничить в SrcRect. Управляя размерами области DstRect, можем увеличить или уменьшить рисунок.

Метод Paint: PaintTo (const ACanvas: TCanvas; const ARect: TRectF; const AParent: TFmxObject = nil); пример: рисуем увеличенную в 2 раза кнопку:

Form1.Canvas.BeginScene;

Button1.PaintTo(Form1.Canvas, RectF (0,0,Button1.Width* 2,Button1. Height*2));

Form1.Canvas. EndScene;

Надо отметить, что если в событии OnPaint Формы все рисуется прекрасно, то при попытке сделать это же при нажатии кнопки можно получить что угодно, а обычно ничего, или кратковременный вывод рисунка на экран, который тут же исчезает. Чтобы получить устойчивую фигуру нужно сделать довольно много, в отличие от обычного Delphi 7. На примере компонента Path, позволяющего рисовать полилинии:

Вначале определяется глобальная переменная Path:

var

Form1: TForm1;

Path: TPathData;

Затем при открытии формы создается траектория Path:

procedure TForm1.FormCreate (Sender: TObject);

begin

Path:= TPathData.Create; //Создаем траекторию

end;

Определяется событие OnPaint для Image (или для Form1):

procedure TForm1.Image1Paint (Sender: TObject; Canvas: TCanvas; const ARect: TRectF);

begin

with Canvas do

if (Path.Count> 0) and (BeginScene) then

try

Clear (TAlphaColorRec. White);

Stroke.Kind:= TBrushKind.Solid;

Stroke.Thickness:= 1;

DrawPath (Path,1); //Рисовать Path при обращении

finally

EndScene;

end;

Собственно рисуем линию на Image по щелчку на кнопке:

procedure TForm1.Button1Click (Sender: TObject);

var

p,p1:TPointF;

begin

p.X:= Image1.Position. X;

p.Y:= Image1.Position. Y;

Path.Clear; // Очистить Path

Path.MoveTo (p1); // Начальная точка рисования

p1.X:= Image1.Position. X+100;

p1.Y:= Image1.Position. Y+150;

Path.LineTo (p1); // Линия от начальной точки

Path.ClosePath; // Оконачание создания Path

// Вывод созданной Path в Image

Image1.OnPaint(Sender,Image1.Canvas,Image1.ClipRect);

end;

Для добавления элементов используют Path1.Data.Add…

(или: Image1.AddObject (TEllipse)):

for i:= 0 to Memo1.Lines.Count – 1 do

begin

X:=X+5; // X с шагом = 5 точек

R.Top:=Path1.Height – StrToInt(Memo1.Lines [i]) // Y

R.Bottom:=R.Top +3; // Диаметр кружка: 1+3=4

R. Left:= X;

R. Right:=R. Left +3;

Path1.Data.AddEllipse (R); //Рисуем кружок

end;

Как видите, рисование в Android не доставляет того же удовольствия, как в Delphi 7. Поэтому гораздо проще использовать фигуры из группы Shape, которые не требует ничего этого и свойства которых можно определять в Object Inspector.

11.4. РИСОВАНИЕ СРЕДСТВАМИ DELPHI ANDROID

Основной класс для для графики в Delphi Android – TCanvas (т.н. «холст») модуля FMX.Graphics. В отличие от обычного Delphi рисование средствами Delphi Android, в результате попыток создания мультиплатформенности, оказывается резко усложнено и вначале может вообще ничего не получиться с выводом рисунка на экран, а в особенности с динамическим выводом данных, хотя для последнего существует специальный компонент для вывода графиков TChart.

Основу рисования составляет Canvas: TCanvas, который внедрен во многие компоненты и обеспечивает рисование на них. Вывод графики лучше осуществлять в рамках события OnPaint, присутствующего у многих компонентов.

Для оценки цвета можно использовать канал RBG (Red, Blue, Green), максимальное значение 255, у яркости максимальное 240. При переводе в градации серого используется:

Яркость = 0.6*Зеленый +0.3*Красный +0.1*Синий. Коэффициенты отражают неравномерность чувствительности глаза к разным участкам спектра.

В Uses следует добавить: System. UITypes.

Создать цвет, например, для компонента прямоугольник, можно смешав 3 цвета (A: Byte = $FF – прозрачность до 255):

var

col: TAlphaColorRec;

begin

col. R:= 255;

col. G:= 255;

col. B:= 255;

col. A:= 255;

Rectangle1.Fill.Color:= TAlphaColor (col);

Rectangle1.Fill.Kind:= TBrushKind.Solid;

end;

Для назначения цвета можно использовать вывод его в 16-ричном формате: $FFF000000 соответствует непрозрачному красному цвету; но удобнее и чаще всего используют TAlphaColor, который использует и 16-речные значения и стандартные цвета:

var color: TAlphaColors;

color:= TAlphaColors.Red;//Подсказка выводится после точки

Предусмотрены также ряд специализированных компонентов на вкладке Color: TColorPanel, TComboBoxColorPanel, TColotListBox, TColorComboBox, TColorPicker и др.

Рис. 32. Различные компоненты отображения цвета вкладки Color.

Рисование фигур включает прежде всего описание их свойств внутри BeginScene….EndScene. Так, единственный метод вывода линии ранее:

DrawLine (P1, P2, 1);

теперь превращается в целую историю:

в событии OnPaint основной Form1 подготавливаем сцену:

constant R: TREctF;

var

P1, P2: TPointF;

x1, y1,x2, y2: Integer;

color: TAlphaColor;

Begin

x1:= 10;

y1:= 20;

x2:= 100;

y2:= 200;

P1.X:= x1;

P1.Y:= y1;

P2.X:= x2;

P2.Y:= y2;

with Canvas do

if (Edit1.Text = «1») and (BeginScene) then

try

Stroke.Kind:=TBrushKind.Solid;

Stroke.Color:=TAlphaColors. Blue;

Stroke.Thickness:=2;

Canvas. DrawLine (P1, P2, 1);

finally

endScene;

end;

Для вывода рисунка здесь нужно нажать Button и присвоить Edit1.Text значение «1». При не ограничении вывода рисунок появится прямо при открытии Приложения.

Методы Canvas:

Filll – используемая кисть, имеет множество возможностей;

Stroke – кисть-перо для рисования линий;

Font – для шрифта (Name, Size, Color).

Пример для вывода шрифта:

FillText (RectF (20,30, 200,300), «Текст вывода», true, 1, [], TTextAlign. Center);

Заливка фигур осуществляется методом Fill… для прямоугольника (Rect), эллипса (Ellpise), дуги (Arc), полигональной линии (Polygon) и тректории (Path); полные свойства выводятся автоматически при написании в программе.

При этом Path: TPathData уже не конфликтует с путем для файлов Path: TPath, как это имеет место для Path: TPath группы Shape, однако, рисовать Path: TPathData гораздо менее удобно, чем работать с уже готовыми фигурами Path: TPath.

Для Path: TPathData работают известные методы – перемещение в точку:

MoveTo (const P: TPointF);

и проведение линии от предыдущей точки:

LineTo (const P: TPointF);

Для доступа из любого места программы нужно создать глобальную переменную:

var

Form1: TForm1;

Path: TPathData;

При открытии на OnCreate в Form1 создаем траекторию:

Path:=TpathData.Create;

Подготавливаем сцену для визуализаци в OnPaint и Form1:

with Canvas do

if (Path.Count> 0) and (BeginScene) then

try

Stroke.Kind:=TBrushKind.Solid;

Stroke.Color:=TAlphaColors. Blue;

Stroke.Thickness:=2;

DrawPath (Path,1);

finally

endScene;

end;

Для рисования полилинии на экране, например при движении пальцем, используем метод OnTouch в Form1:

OnTouch в Form1:

case Action of

TTouchAction.Down: begin

Path.MoveTo (Touches [0].Location);

end;

TTouchAction.Move: begin

Path.LineTo (Touches [High (Touches)].Location);

FormPaint(Sender,Form1.Canvas,Form1.ClientRect);

end;

Очистить холст можно методами:

Canvas.Clear (const AColor: TAlphaColor = 0)

или только область:

Canvas.Clear (const ARectF; const AColor: TAlphaColor = 0).

Для прорисовки на поверхности холста графической фигуры существует метод DrawBitmap (константы: ABitmap: TBitmap; SrcRect и Dstrect: TRectF: AOpasity: Single; HighSpeed: Boolean = false): выводится все изображение или его часть (SrcRect в область DstRect). Загружать образ фигуры можно из файла:

var ABitmap:= TBitmap.CreateFromFile («Путь и Имя файла»);

для вывода рисунка:

if BeginScene then

begin

DrawBitmap (ABitmap,1,true);

EndScene;

end;

Сохранить настройки холста можно функцией:

SaveState: TCanvasSaveState;

Восстановить:

RestoreState (SaveState: TCanvasSaveState).

Сохранить и загрузить рисунок в Bitmap можно из Object Inspector или программно:

ABitmap. LoadFromFile ();

ABitmap.SaveToFile ();

ABitmap.SaveToStrem ().

Как отмечалось, во многих случаях удобнее отображать данные (которые удобно направлять в Memo) компонентом Path: TPathData, не конфликтующим с Path: TPath путем для файлов. Для этого вначале создаем глобальную переменную:

var Form1: TForm1; Path: TPathData;

При открытии на OnCreate в Form1 создаем траекторию:

Path:=TpathData.Create;

Подготавливаем сцену для визуализаци в OnPaint и Form1:

with Canvas do

if (Edit1.Text = «1») and (BeginScene) then

try

Stroke.Kind:=TBrushKind.Solid;

Stroke.Color:=TAlphaColors. Blue;

Stroke.Thickness:=2;

DrawPath (Path,1);

finally

endScene;

end;

Начало рисования ограничиваем Edit1.Text = «1», который контролируем Button.

Для рисования используем свойство OnPaint для Button:

procedure TForm1.Button3Paint (Sender: TObject; Canvas: TCanvas;

const ARect: TRectF);

var

P: TPointF;

i: Integer;

begin

P.X:= 0;

P.Y:= StrToInt(Memo1.Lines [0]);

Path.MoveTo (P);

for i:= 0 to Memo1.Lines.Count – 2 do

begin

P.X:= i*4;

P.Y:= PlotGrid1.Height – StrToInt(Memo1.Lines [i]);

Path.LineTo (P);

end;

end;

Результат можно видеть на рисунке: накапливаемые данные тут же отражаются на графике (перерисовывается график для данных в Memo пока Edit1.Text = «1»).

Рис. 33. Рисование графика компонентом Path: TPathData.

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

11.5. Компонент построения графиков Chart

В Delphi Android имеются специальный компонент для построения графиков – Chart. В компоненте Chart многие десятки свойств и функций, но работать достаточно с несколькими. Нажимаем щелчком мыши по компоненту Chart и переходим во вкладку Series, выбираем кнопку Add: открывается список всех доступных графиков, выбираем, например, первый тип графика (линейный) – Line.

Здесь же видны другие первостепенные свойства Chart:

– Общие; – Оси, – Заглавия, – Легенды и пр.

Внутри группы открываются их подробные настройки, которые можно делать также из Object Inspector и программно.

Основная функция графика – добавление данных:

AddXY (AXValue, AYValue: Double; ALabel: String; AColor: TColor);

Chart1.Series[1].AddXY (x,y,» ',TAlphaColors.Red); //Например

Найти значение Y по X (от 0 до Х макс. видимого графика):

Y:= Chart1.Series [0].YValue [X]; или: Y:= Series1.YValue [X].

Следует учитывать, что: Series1 равна Chart1.Series [0].

Chart1.SaveToBitmapFile(FileName.jpg); //Сохранить график в файл

Series1.Delete (X); //Удалить точку X графика.

Series1.MaxYValue и *.MinYValue; // Y Max и Min видимого графика

Ymax и Ymin в пределах окна графика можно и вычислять:

Ymin:= 1000000; Ymax:= 0;

for X:= 1 to Chart1.BottomAxis.Maximum do

begin

if Ymax then Ymax:= Round (Chart1.Series [0].YValue [X]);

if Ymin> Round(Chart1.Series [0].YValue [X]) then Ymin:= Round (Chart1.Series [0].YValue [X]);

end;

Chart1.LeftAxis.Maximum:= Ymax; (отключить автомасштаб!)

Chart1.LeftAxis. Minimum:= Ymin;

Вычислять положение точки Х для точки экрана:

Label1.Text :-= FloatToStr(Series1.MaxYValue);//Значение Ymax

Label1.Position. X:= Series1.CalcXPos (Round (Series1.MaxYValue)); //Положение метки на экране в точке Х соответствующей Значению Ymax.

Рис. 34. Установка параметров графика Chart.

11.6. КОМПОНЕНТЫ 3D ГРАФИКИ

В Delphi для Android 10 и 11, как и в более ранних версиях, предусмотрена также 3-х мерная графика, где представлены компоненты 3D-Shapes, с возможностью изменять цвет и структуру поверхности – группа Materials.

Для разработки 3D графики нужно использовать шаблон 3D Application или Viewport 3D. Тип проекции (свойство Projection) отображает в вариантах Camera (начало координат в центре экрана, координата Y снизу вверх), или Screen (координаты начинаются как обычно с верх- него левого угла экрана).

Вид объекта (глубина и ее направление) зависит от положе ния на экране. Координата Z приближает или отодвигает объект. Изменение угла отклоняет: для +X вперед, —Х назад; для Y соответственно вправо и влево: +Z поворачивает против часовой стрелки, —Z по часовой стрелке. Координаты объекта отсчитываются от его центра. Смысл всего этого для смартфонов проблематичен.

11.7. АНИМАЦИЯ ОБЪЕКТОВ

У многих компонентов есть свойство анимации (как и угла поворота). Это позволяет динамически придавать им различные функции – изменять положение, поворот, менять цвет. Также в группе Animation находится набор компонентов для придания анимации практически любым компонентам и многим свойствам (имеющим в Инспекторе объектов флажок – кадр фильма).

Для роста объекта можно менять его свойство Height, для изменения положения: Position. X и Position. Y, для поворота Rotation Center и Rotation Angle; соответственно, можно менять цвет – Color.

Компоненты группы Animation такие как: FloatAnimation и PathAnimation двигают объект от StartValue до StopValue по зависимости, определяемой свойством Interpolation (linear или exponent) и в течение секунд – Duration, с задержкой Delay. AutoReverse возвращает объект обратно по той же траектории, а Loop делает это циклически.

11.8. ВОЗМОЖНОСТЬ РИСОВАНИЯ НА ЭКРАНЕ

Для формы существует в Events событие OnTouch, позволяющее рисовать на экране в ответ на прикосновение и движение. Для этого:

Создаем глобальную переменную:

var

Form1: TForm1;

Path: TPathData;

При открытии на OnCreate в Form1 создаем траекторию:

Path:=TpathData.Create;

Подготавливаем сцену для визуализаци в OnPaint и Form1:

with Canvas do

if (Path.Count> 0) and (BeginScene) then

try

Stroke.Kind:=TBrushKind.Solid;

Stroke.Color:=TAlphaColors. Blue;

Stroke.Thickness:=2;

DrawPath (Path,1);

finally

endScene;

end;

Формируем событие OnTouch в Form1:

case Action of

TTouchAction.Down: begin

Path.MoveTo (Touches [0].Location);

end;

TTouchAction.Move: begin

Path.LineTo (Touches [High (Touches)].Location);

FormPaint(Sender,Form1.Canvas,Form1.ClientRect);

end;

В итоге движение пальца рисует синию линию (полилиния – Path).

Для изменения цвета и размера линии нужно ввести компоненты SpinBox и ColorListBox (обеспечивает выбор до 200 цветов), поместив их на Panel. Также нам понадобится Button для стирания рисунка:

Path.Clear; // Очистка компонента – полилиния (Path)

Path:=TpathData.Create; // Создание заново компонента Path

SpinBox1.Value:= 2; // Исходное значение величины кисти

ColorListBox1.Color:= TAlphaColors. Black; //Исходный цвет – черный

Важно: OnTouch реагирует на любое прикосновение к экрану, и чтобы рисунок не выводился на области Panel с компонентами настройки, ограничиваем выведение рисунка областью выше Panel:

if Touches [0].Location. Y then

begin

case Action of

TTouchAction.Down: begin……………..

Для перехода в область настройки достаточно коснуться этой области внизу экрана (осторожно, чтобы не закрыть все приложение основными кнопками смартфона «>» и «O»), при этом исчезает рисунок и снова появляется при переходе в область рисивания. Однако, изменение цвета изменяет и цвет всех предыдущих линий, которые все перерисовываются заново с новыми установками цвета и размера линий.

Для того, чтобы рисовать другую линию, нужно ввести новый компонент Path1 (что вполне логично). Также нужно ввести понятие «сессии» и внести на Форму компонент Button для перехода к новой сессии и NumberBox для счета и отображения номера очередной сессии. Теперь на новую сессию рисуется новая линия с новыми настройками:

TTouchAction.Move: begin

if NumberBox1.Value = 1 then Path.LineTo (Touches [High (Touches)]. Location);

if NumberBox1.Value=2 then Path1.LineTo (Touches [High (Touches)]. Location);

Но теперь исчезли все предыдущие линии, что также понятно, так как каждый раз рисунок создается заново, и для того, чтобы были видны предудущие линии нужно, чтобы выводились на рисование ОБЕ линии:

with Canvas do

if (Path.Count> 0) and (BeginScene) then

try

Stroke.Kind:=TBrushKind.Solid;

if NumberBox1.Value = 1 then

begin

Stroke.Color:= TAlphaColors. Blue;

Stroke.Thickness:= 1;

DrawPath (Path,1);

end;

if NumberBox1.Value = 2 then

begin

Stroke.Color:= TAlphaColors. Blue;

Stroke.Thickness:= 1;

DrawPath (Path,1);

Stroke.Thickness:= 5;

Stroke.Color:= TAlphaColors.Red;

DrawPath (Path1,1);

end;

finally