Make map's marker look better

This commit is contained in:
ashilkn 2023-06-10 21:54:16 +05:30
parent c559baafb4
commit ed09b33063
3 changed files with 42 additions and 37 deletions

View file

@ -1,4 +1,3 @@
import "package:flutter/material.dart";
import "package:photos/ui/map/image_marker.dart";
import "package:photos/ui/map/marker_image.dart";
@ -10,15 +9,11 @@ class MapGalleryTile extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
margin: const EdgeInsets.all(10),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(4),
color: Colors.black,
),
margin: const EdgeInsets.all(8),
child: MarkerImage(
key: key,
file: imageMarker.imageFile,
seperator: 65,
seperator: 69,
),
);
}

View file

@ -1,4 +1,5 @@
import "package:flutter/material.dart";
import "package:photos/theme/ente_theme.dart";
class MapGalleryTileBadge extends StatelessWidget {
final int size;
@ -23,21 +24,19 @@ class MapGalleryTileBadge extends StatelessWidget {
top: 0,
right: 0,
child: Container(
padding: const EdgeInsets.all(5),
padding: const EdgeInsets.all(4),
decoration: const BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(5),
Radius.circular(2),
),
shape: BoxShape.rectangle,
// color: Color.fromRGBO(30, 215, 96, 1),
color: Colors.green,
// color: Colors.redAccent,
),
child: Text(
formatNumber(size),
style: const TextStyle(
color: Colors.white,
fontSize: 8,
fontWeight: FontWeight.bold,
),
style: getEnteTextTheme(context).tinyBold,
),
),
);

View file

@ -1,5 +1,7 @@
import "package:flutter/material.dart";
import "package:photos/models/file.dart";
import "package:photos/theme/effects.dart";
import "package:photos/theme/ente_theme.dart";
import "package:photos/ui/viewer/file/thumbnail_widget.dart";
class MarkerImage extends StatelessWidget {
@ -10,41 +12,50 @@ class MarkerImage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Stack(
children: <Widget>[
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(4),
border: Border.all(
color: Colors.green,
width: 1.75,
final bgColor = getEnteColorScheme(context).backgroundElevated2;
return Container(
decoration: BoxDecoration(boxShadow: shadowMenuLight),
child: Stack(
children: <Widget>[
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(2),
border: Border.all(
color: bgColor,
width: 2,
),
),
child: ClipRRect(
borderRadius: const BorderRadius.all(Radius.circular(2)),
child: ThumbnailWidget(file),
),
),
child: ThumbnailWidget(file),
),
Align(
alignment: Alignment.bottomCenter,
child: Container(
margin: EdgeInsets.only(top: seperator),
child: CustomPaint(
painter: MarkerPointer(),
Align(
alignment: Alignment.bottomCenter,
child: Container(
margin: EdgeInsets.only(top: seperator),
child: CustomPaint(
painter: MarkerPointer(bgColor),
),
),
),
)
],
)
],
),
);
}
}
class MarkerPointer extends CustomPainter {
Color bgColor;
MarkerPointer(this.bgColor);
@override
void paint(Canvas canvas, Size size) {
final paint = Paint()..color = Colors.green;
final paint = Paint()..color = bgColor;
final path = Path();
path.moveTo(5, -12);
path.lineTo(0, 0);
path.lineTo(-5, -12);
path.moveTo(9, -12);
path.lineTo(0, -4);
path.lineTo(-9, -12);
canvas.drawPath(path, paint);
}