Программирование для Android и работа с датчиками в среде Delphi 11
- -
- 100%
- +
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
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
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