Skip to content

Commit

Permalink
foot movement on map
Browse files Browse the repository at this point in the history
  • Loading branch information
@CoderNamedHendrick
CoderNamedHendrick committed Sep 26, 2024
1 parent c30e85c commit 9b70fa0
Show file tree
Hide file tree
Showing 5 changed files with 267 additions and 72 deletions.
195 changes: 186 additions & 9 deletions packages/conferenceapp/lib/src/features/more/presentation/map/grid.dart
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,8 @@
import 'dart:core';
import 'dart:math';
import 'dart:ui';

import 'package:cave/cave.dart';
import 'package:equatable/equatable.dart';
import 'package:flutter/material.dart' hide Action;

Expand Down Expand Up @@ -39,6 +42,7 @@ class GridPainter extends CustomPainter {
this.showGrid = false,
this.showPath = false,
this.showBlocks = false,
this.onWalkerPosition,
});

final Grid<int> grid;
Expand All @@ -49,6 +53,7 @@ class GridPainter extends CustomPainter {
final bool showGrid;
final bool showPath;
final bool showBlocks;
final void Function(Offset walkerPostion, double angle)? onWalkerPosition;

@override
void paint(Canvas canvas, Size size) {
Expand Down Expand Up @@ -116,22 +121,170 @@ class GridPainter extends CustomPainter {

for (final pathMetric in pathMetrics) {
try {
final extractPath =
pathMetric.extractPath(0, pathMetric.length * progress);
final extractPath = pathMetric.extractPath(
0, pathMetric.length * progress,
startWithMoveTo: false);

final metric = extractPath.computeMetrics().first;
final tangent = metric.getTangentForOffset(metric.length)!;
final tangent = _computeTangentForPath(extractPath);
final offset = tangent.position;

canvas.drawOval(
Rect.fromCircle(center: offset, radius: cellSize * 1.5),
Paint()
..style = PaintingStyle.fill
..color = Colors.orange);
canvas.save();
canvas.translate(offset.dx, offset.dy);

double rotationAngle = tangent.angle.abs() - pi / 2;

final isOnXAxis = rotationAngle == pi / 2 || rotationAngle == -pi / 2;

if (isOnXAxis) {
rotationAngle = rotationAngle - pi;
} else {
// if the tangent angle is -90, then the rotation angle should be 180
if (_getDegFromRad(tangent.angle) == -90) {
rotationAngle = pi;
}
}

onWalkerPosition?.call(offset, rotationAngle);
canvas.rotate(rotationAngle);

_walker(canvas, Size(cellSize * 1.5, cellSize * 1.5));
if (!isOnXAxis) {
canvas.translate(0, cellSize / 2);
}

Matrix4 matrix4 = Matrix4.identity();
matrix4.scale(-1.0, 1.0);
canvas.transform(matrix4.storage);
_walker(canvas, Size(cellSize * 1.5, cellSize * 1.5));

canvas.restore();
// canvas.drawOval(
// Rect.fromCircle(center: offset, radius: cellSize * 1.5),
// Paint()
// ..style = PaintingStyle.fill
// ..color = Colors.orange);
} catch (_) {}
}
}

void _walker(Canvas canvas, Size size) {
Path path_0 = Path();
path_0.moveTo(size.width * 0.3759985, size.height * 0.4896138);
path_0.cubicTo(
size.width * 0.4655944,
size.height * 0.5371670,
size.width * 0.5076371,
size.height * 0.6434983,
size.width * 0.4776357,
size.height * 0.7412578);
path_0.cubicTo(
size.width * 0.4721253,
size.height * 0.7588096,
size.width * 0.4672271,
size.height * 0.7769737,
size.width * 0.4633494,
size.height * 0.7951377);
path_0.cubicTo(
size.width * 0.4474303,
size.height * 0.8767741,
size.width * 0.4688598,
size.height * 0.9792276,
size.width * 0.5586598,
size.height * 0.9973917);
path_0.cubicTo(
size.width * 0.6039679,
size.height * 1.006984,
size.width * 0.6490720,
size.height * 0.9894322,
size.width * 0.6809102,
size.height * 0.9561654);
path_0.cubicTo(
size.width * 0.7758124,
size.height * 0.8530995,
size.width * 0.7468315,
size.height * 0.5426774,
size.width * 0.7460151,
size.height * 0.4649188);
path_0.cubicTo(
size.width * 0.7460151,
size.height * 0.4308357,
size.width * 0.7451988,
size.height * 0.3959361,
size.width * 0.7317288,
size.height * 0.3640980);
path_0.cubicTo(
size.width * 0.7015233,
size.height * 0.2926662,
size.width * 0.6166216,
size.height * 0.2640935,
size.width * 0.5413121,
size.height * 0.2442967);
path_0.cubicTo(
size.width * 0.4176330,
size.height * 0.1991926,
size.width * 0.3396704,
size.height * 0.2561339,
size.width * 0.3135467,
size.height * 0.2981767);
path_0.cubicTo(
size.width * 0.2874231,
size.height * 0.3402194,
size.width * 0.2684427,
size.height * 0.4336929,
size.width * 0.3759985,
size.height * 0.4896138);
path_0.close();

Paint paint0Fill = Paint()..style = PaintingStyle.fill;
paint0Fill.color = DevfestColors.primariesBlue70.withOpacity(1.0);
canvas.drawPath(path_0, paint0Fill);

Paint paint1Fill = Paint()..style = PaintingStyle.fill;
paint1Fill.color = DevfestColors.primariesBlue70.withOpacity(1.0);
canvas.drawOval(
Rect.fromCenter(
center: Offset(size.width * 0.2894640, size.height * 0.09041222),
width: size.width * 0.1285772,
height: size.height * 0.1808244),
paint1Fill);

Paint paint2Fill = Paint()..style = PaintingStyle.fill;
paint2Fill.color = DevfestColors.primariesBlue70.withOpacity(1.0);
canvas.drawOval(
Rect.fromCenter(
center: Offset(size.width * 0.4380421, size.height * 0.1055149),
width: size.width * 0.07632996,
height: size.height * 0.1077599),
paint2Fill);

Paint paint3Fill = Paint()..style = PaintingStyle.fill;
paint3Fill.color = DevfestColors.primariesBlue70.withOpacity(1.0);
canvas.drawOval(
Rect.fromCenter(
center: Offset(size.width * 0.5570271, size.height * 0.1387817),
width: size.width * 0.06816633,
height: size.height * 0.09510631),
paint3Fill);

Paint paint4Fill = Paint()..style = PaintingStyle.fill;
paint4Fill.color = DevfestColors.primariesBlue70.withOpacity(1.0);
canvas.drawOval(
Rect.fromCenter(
center: Offset(size.width * 0.6656034, size.height * 0.1667422),
width: size.width * 0.06041088,
height: size.height * 0.08408541),
paint4Fill);

Paint paint5Fill = Paint()..style = PaintingStyle.fill;
paint5Fill.color = DevfestColors.primariesBlue70.withOpacity(1.0);
canvas.drawOval(
Rect.fromCenter(
center: Offset(size.width * 0.7473805, size.height * 0.2229039),
width: size.width * 0.07469723,
height: size.height * 0.05387997),
paint5Fill);
}

void _paintGrid(Canvas canvas, Size size) {
for (int i = 0; i < grid.rows; i++) {
for (int j = 0; j < grid.columns; j++) {
Expand Down Expand Up @@ -190,6 +343,11 @@ class GridPainter extends CustomPainter {
}
}

Tangent _computeTangentForPath(Path path) {
final metric = path.computeMetrics().first;
return metric.getTangentForOffset(metric.length)!;
}

@override
bool shouldRepaint(covariant CustomPainter oldDelegate) {
if (oldDelegate is! GridPainter) return false;
Expand Down Expand Up @@ -345,3 +503,22 @@ class Grid<T extends Object> extends Equatable {
@override
List<Object?> get props => [grid];
}

//Copy this CustomPainter code to the Bottom of the File
class RPSCustomPainter extends CustomPainter {
@override
void paint(Canvas canvas, Size size) {}

@override
bool shouldRepaint(covariant CustomPainter oldDelegate) {
return true;
}
}

double _getDegFromRad(double radians) {
return radians * (180 / pi);
}

double getRadFromDeg(double angle) {
return angle * (pi / 180);
}
32 changes: 22 additions & 10 deletions packages/conferenceapp/lib/src/features/more/presentation/widgets/foot.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,29 @@ import 'package:cave/cave.dart';
import 'package:flutter/material.dart';

class MapFoot extends StatelessWidget {
const MapFoot({super.key});
const MapFoot({super.key, required this.isRightFoot, this.color});

const MapFoot.left({super.key, this.color}) : isRightFoot = false;

const MapFoot.right({super.key, this.color}) : isRightFoot = true;

final bool isRightFoot;
final Color? color;

@override
Widget build(BuildContext context) {
return SvgPicture.string(
Widget child = SvgPicture.string(
_footSvg,
height: 20.h,
colorFilter: color != null //
? ColorFilter.mode(color!, BlendMode.srcIn)
: null,
);

if (isRightFoot) return child;
return Transform.flip(
flipX: true,
child: child,
);
}
}
Expand All @@ -16,20 +33,15 @@ const _footSvg = '''
<?xml version="1.0" encoding="iso-8859-1"?>
<svg fill="#000000" height="800px" width="800px" version="1.1" id="Capa_1"
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 489.978 489.978" xml:space="preserve">
<g>
<g>
<g>
<path d="M184.231,239.9c43.9,23.3,64.5,75.4,49.8,123.3c-2.7,8.6-5.1,17.5-7,26.4c-7.8,40,2.7,90.2,46.7,99.1
<path d="M184.231,239.9c43.9,23.3,64.5,75.4,49.8,123.3c-2.7,8.6-5.1,17.5-7,26.4c-7.8,40,2.7,90.2,46.7,99.1
c22.2,4.7,44.3-3.9,59.9-20.2c46.5-50.5,32.3-202.6,31.9-240.7c0-16.7-0.4-33.8-7-49.4c-14.8-35-56.4-49-93.3-58.7
c-60.6-22.1-98.8,5.8-111.6,26.4S131.531,212.5,184.231,239.9z" />
<ellipse cx="141.831" cy="44.3" rx="31.5" ry="44.3" />
<ellipse cx="214.631" cy="51.7" rx="18.7" ry="26.4" />
<ellipse cx="272.931" cy="68" rx="16.7" ry="23.3" />
<ellipse cx="326.131" cy="81.7" rx="14.8" ry="20.6" />
<ellipse transform="matrix(-0.2014 0.9795 -0.9795 -0.2014 546.9331 -227.4809)"
cx="366.2" cy="109.218" rx="18.3" ry="13.2" />
</g>
</g>
</g>
cx="366.2" cy="109.218" rx="18.3" ry="13.2"
/>
</svg>
''';
Loading

0 comments on commit 9b70fa0

Please sign in to comment.