0ct0pu5/ente
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[mob] use layoutBuilder in face thumbnail

Browse source
This commit is contained in:
ashilkn 2024-04-23 11:15:46 +05:30
parent 731610ed94
commit 4c25997bb6
2 changed files with 64 additions and 58 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
mobile/lib/ui/viewer/file_details/face_widget.dart
View file

@ -264,9 +264,13 @@ class _FaceWidgetState extends State<FaceWidget> {
},
child: Column(
children: [
CroppedFaceImageView(
enteFile: widget.file,
face: widget.face,
SizedBox(
width: 60,
height: 60,
child: CroppedFaceImageView(
enteFile: widget.file,
face: widget.face,
),
),
const SizedBox(height: 8),
if (widget.person != null)

112
mobile/lib/ui/viewer/people/cropped_face_image_view.dart
View file

@ -33,70 +33,72 @@ class CroppedFaceImageView extends StatelessWidget {
@override
Widget build(BuildContext context) {
const double viewWidth = 60;
const double viewHeight = 60;
return SizedBox(
width: viewWidth,
height: viewHeight,
child: FutureBuilder(
future: getImage(),
builder: (context, snapshot) {
if (snapshot.hasData) {
final double imageAspectRatio = enteFile.width / enteFile.height;
final Image image = snapshot.data!;
return FutureBuilder(
future: getImage(),
builder: (context, snapshot) {
if (snapshot.hasData) {
return LayoutBuilder(
builder: ((context, constraints) {
final double imageAspectRatio = enteFile.width / enteFile.height;
final Image image = snapshot.data!;
final faceBox = face.detection.box;
final double viewWidth = constraints.maxWidth;
final double viewHeight = constraints.maxHeight;
final double relativeFaceCenterX = faceBox.xMin + faceBox.width / 2;
final double relativeFaceCenterY =
faceBox.yMin + faceBox.height / 2;
final faceBox = face.detection.box;
const double desiredFaceHeightRelativeToWidget = 8 / 10;
final double scale =
(1 / faceBox.height) * desiredFaceHeightRelativeToWidget;
final double relativeFaceCenterX =
faceBox.xMin + faceBox.width / 2;
final double relativeFaceCenterY =
faceBox.yMin + faceBox.height / 2;
const double widgetCenterX = viewWidth / 2;
const double widgetCenterY = viewHeight / 2;
const double desiredFaceHeightRelativeToWidget = 8 / 10;
final double scale =
(1 / faceBox.height) * desiredFaceHeightRelativeToWidget;
const double widgetAspectRatio = viewWidth / viewHeight;
final double imageToWidgetRatio =
imageAspectRatio / widgetAspectRatio;
final double widgetCenterX = viewWidth / 2;
final double widgetCenterY = viewHeight / 2;
double offsetX =
(widgetCenterX - relativeFaceCenterX * viewWidth) * scale;
double offsetY =
(widgetCenterY - relativeFaceCenterY * viewHeight) * scale;
final double widgetAspectRatio = viewWidth / viewHeight;
final double imageToWidgetRatio =
imageAspectRatio / widgetAspectRatio;
if (imageAspectRatio < widgetAspectRatio) {
// Landscape Image: Adjust offsetX more conservatively
offsetX = offsetX * imageToWidgetRatio;
} else {
// Portrait Image: Adjust offsetY more conservatively
offsetY = offsetY / imageToWidgetRatio;
}
return ClipRRect(
borderRadius: const BorderRadius.all(Radius.elliptical(16, 12)),
child: Transform.translate(
offset: Offset(
offsetX,
offsetY,
double offsetX =
(widgetCenterX - relativeFaceCenterX * viewWidth) * scale;
double offsetY =
(widgetCenterY - relativeFaceCenterY * viewHeight) * scale;
if (imageAspectRatio < widgetAspectRatio) {
// Landscape Image: Adjust offsetX more conservatively
offsetX = offsetX * imageToWidgetRatio;
} else {
// Portrait Image: Adjust offsetY more conservatively
offsetY = offsetY / imageToWidgetRatio;
}
return ClipRRect(
borderRadius: const BorderRadius.all(Radius.elliptical(16, 12)),
child: Transform.translate(
offset: Offset(
offsetX,
offsetY,
),
child: Transform.scale(
scale: scale,
child: image,
),
),
child: Transform.scale(
scale: scale,
child: image,
),
),
);
} else {
if (snapshot.hasError) {
log('Error getting cover face for person: ${snapshot.error}');
}
return ThumbnailWidget(
enteFile,
);
);
}),
);
} else {
if (snapshot.hasError) {
log('Error getting cover face for person: ${snapshot.error}');
}
},
),
return ThumbnailWidget(
enteFile,
);
}
},
);
}