[mob][photos] merge placeholder_for_link2

This commit is contained in:
Aman Raj Singh Mourya
2024-06-03 12:15:43 +05:30
parent 3c5ba5b94e
commit ebf83b7bba
2 changed files with 327 additions and 214 deletions

View File

@@ -1,7 +1,9 @@
import 'dart:math' as math;
import "dart:ui";
import "package:figma_squircle/figma_squircle.dart";
import "package:flutter/material.dart";
import "package:photos/core/constants.dart";
import "package:photos/models/file/file.dart";
import "package:photos/ui/viewer/file/thumbnail_widget.dart";
@@ -22,181 +24,276 @@ class LinkPlaceholder extends StatelessWidget {
);
if (length == 1) {
placeholderWidget = AspectRatio(
aspectRatio: 1,
child: _BackDrop(
backDropImage: files[0],
children: [
Padding(
padding: const EdgeInsets.all(18.0),
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20.0),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.5),
spreadRadius: 1,
blurRadius: 1,
offset: const Offset(1, 1),
),
BoxShadow(
color: Colors.black.withOpacity(0.5),
spreadRadius: 1,
blurRadius: 1,
offset: const Offset(-1, -1),
),
],
placeholderWidget = _BackDrop(
backDropImage: files[0],
children: [
LayoutBuilder(
builder: (context, constraints) {
final imageHeight = constraints.maxHeight * 0.9;
return Center(
child: _CustomImage(
width: imageHeight,
height: imageHeight,
file: files[0],
zIndex: 0,
),
child: ClipSmoothRect(
radius: SmoothBorderRadius(
cornerRadius: 15,
cornerSmoothing: 1,
),
child: ThumbnailWidget(
files[0],
shouldShowArchiveStatus: false,
shouldShowSyncStatus: false,
),
),
),
),
],
),
);
},
),
],
);
} else if (length == 2) {
placeholderWidget = AspectRatio(
aspectRatio: 1,
child: _BackDrop(
backDropImage: files[0],
children: [
Positioned(
right: 20,
bottom: 50,
child: _CustomImage(
height: 190,
width: 190,
collages: files[1],
zIndex: 0.2,
),
),
Positioned(
top: 50,
left: 20,
child: _CustomImage(
height: 190,
width: 190,
collages: files[0],
zIndex: -0.2,
),
),
],
),
);
} else if (length == 3) {
placeholderWidget = AspectRatio(
aspectRatio: 1,
child: _BackDrop(
backDropImage: files[0],
children: [
Positioned(
top: 55,
left: 10,
child: _CustomImage(
height: 160,
width: 160,
collages: files[1],
zIndex: -0.3,
),
),
Positioned(
right: 10,
bottom: 50,
child: _CustomImage(
height: 160,
width: 160,
collages: files[2],
zIndex: 0.3,
),
),
Positioned(
top: 100,
left: 100,
child: _CustomImage(
height: 175,
width: 175,
collages: files[0],
zIndex: 0.0,
),
),
],
),
);
} else if (length > 3) {
placeholderWidget = Padding(
padding: const EdgeInsets.all(8.0),
child: AspectRatio(
aspectRatio: 1,
child: _BackDrop(
backDropImage: files[0],
children: [
Positioned(
top: 20,
left: 20,
child: _CustomImage(
height: 160,
width: 160,
collages: files[1],
zIndex: 0,
),
),
Positioned(
bottom: 15,
left: 40,
child: _CustomImage(
height: 160,
width: 160,
collages: files[2],
zIndex: 0,
),
),
Positioned(
top: 75,
right: 30,
child: _CustomImage(
height: 175,
width: 175,
collages: files[0],
zIndex: 0.0,
),
),
Positioned(
bottom: 30,
right: 40,
child: ClipSmoothRect(
radius: SmoothBorderRadius(
cornerRadius: 7.5,
cornerSmoothing: 1,
),
child: Container(
color: Colors.white,
height: 50,
width: 50,
child: Center(
child: Text(
"+" "$length",
style: const TextStyle(
fontWeight: FontWeight.w600,
fontSize: 24,
color: Colors.black,
),
),
placeholderWidget = _BackDrop(
backDropImage: files[0],
children: [
LayoutBuilder(
builder: ((context, constraints) {
final imageHeight = constraints.maxHeight * 0.52;
return Stack(
children: [
Positioned(
top: 145,
left: 180,
child: _CustomImage(
height: imageHeight,
width: imageHeight,
file: files[1],
zIndex: 10 * math.pi / 180,
),
),
),
),
],
Positioned(
top: 45,
left: 3.2,
child: _CustomImage(
height: imageHeight,
width: imageHeight,
file: files[0],
zIndex: -(10 * math.pi / 180),
imageShadow: const [
BoxShadow(
offset: Offset(0, 0),
blurRadius: 0.84,
color: Color.fromRGBO(0, 0, 0, 0.11),
),
BoxShadow(
offset: Offset(0.84, 0.84),
blurRadius: 1.68,
color: Color.fromRGBO(0, 0, 0, 0.09),
),
BoxShadow(
offset: Offset(2.53, 2.53),
blurRadius: 2.53,
color: Color.fromRGBO(0, 0, 0, 0.05),
),
BoxShadow(
offset: Offset(5.05, 4.21),
blurRadius: 2.53,
color: Color.fromRGBO(0, 0, 0, 0.02),
),
BoxShadow(
offset: Offset(7.58, 6.74),
blurRadius: 2.53,
color: Color.fromRGBO(0, 0, 0, 0.0),
),
],
),
),
],
);
}),
),
),
],
);
} else if (length == 3) {
placeholderWidget = _BackDrop(
backDropImage: files[0],
children: [
LayoutBuilder(
builder: (context, constraint) {
final imageHeightSmall = constraint.maxHeight * 0.43;
final imageHeightLarge = constraint.maxHeight * 0.50;
return Stack(
children: [
Positioned(
top: 55,
child: _CustomImage(
height: imageHeightSmall,
width: imageHeightSmall,
file: files[1],
zIndex: -(20 * math.pi / 180),
),
),
Positioned(
bottom: 50,
right: -10,
child: _CustomImage(
height: imageHeightSmall,
width: imageHeightSmall,
file: files[2],
zIndex: 20 * math.pi / 180,
),
),
Center(
child: _CustomImage(
height: imageHeightLarge,
width: imageHeightLarge,
file: files[0],
zIndex: 0.0,
imageShadow: const [
BoxShadow(
offset: Offset(0, 1.02),
blurRadius: 2.04,
color: Color.fromRGBO(0, 0, 0, 0.23),
),
BoxShadow(
offset: Offset(0, 3.06),
blurRadius: 3.06,
color: Color.fromRGBO(0, 0, 0, 0.2),
),
BoxShadow(
offset: Offset(0, 6.12),
blurRadius: 4.08,
color: Color.fromRGBO(0, 0, 0, 0.12),
),
BoxShadow(
offset: Offset(0, 11.22),
blurRadius: 5.1,
color: Color.fromRGBO(0, 0, 0, 0.04),
),
BoxShadow(
offset: Offset(0, 18.36),
blurRadius: 5.1,
color: Color.fromRGBO(0, 0, 0, 0.0),
),
],
),
),
],
);
},
),
],
);
} else if (length > 3) {
placeholderWidget = _BackDrop(
backDropImage: files[0],
children: [
LayoutBuilder(
builder: (context, constraint) {
final imageHeightSmall = constraint.maxHeight * 0.43;
final imageHeightLarge = constraint.maxHeight * 0.50;
final boxHeight = constraint.maxHeight * 0.15;
return Stack(
children: [
Positioned(
top: 30,
left: 25,
child: _CustomImage(
height: imageHeightSmall,
width: imageHeightSmall,
file: files[1],
zIndex: 0.0,
),
),
Positioned(
top: 202,
left: 50,
child: _CustomImage(
height: imageHeightSmall,
width: imageHeightSmall,
file: files[2],
zIndex: 0.0,
),
),
Positioned(
top: 75,
right: 25,
child: _CustomImage(
height: imageHeightLarge,
width: imageHeightLarge,
file: files[0],
zIndex: 0.0,
imageShadow: const [
BoxShadow(
offset: Offset(0, 1.02),
blurRadius: 2.04,
color: Color.fromRGBO(0, 0, 0, 0.23),
),
BoxShadow(
offset: Offset(0, 3.06),
blurRadius: 3.06,
color: Color.fromRGBO(0, 0, 0, 0.2),
),
BoxShadow(
offset: Offset(0, 6.12),
blurRadius: 4.08,
color: Color.fromRGBO(0, 0, 0, 0.12),
),
BoxShadow(
offset: Offset(0, 11.22),
blurRadius: 5.1,
color: Color.fromRGBO(0, 0, 0, 0.04),
),
BoxShadow(
offset: Offset(0, 18.36),
blurRadius: 5.1,
color: Color.fromRGBO(0, 0, 0, 0.0),
),
],
),
),
Positioned(
top: 290,
left: 270,
child: Stack(
children: [
Center(
child: Container(
height: boxHeight + 3,
width: boxHeight + 3,
decoration: ShapeDecoration(
color: const Color.fromRGBO(129, 129, 129, 0.1),
shape: SmoothRectangleBorder(
borderRadius: SmoothBorderRadius(
cornerRadius: 15.0,
cornerSmoothing: 1.0,
),
),
),
),
),
Center(
child: ClipSmoothRect(
radius: SmoothBorderRadius(
cornerRadius: 12,
cornerSmoothing: 1.0,
),
child: Container(
height: boxHeight,
width: boxHeight,
color: const Color.fromRGBO(255, 255, 255, 1),
child: Center(
child: Text(
"+" "${length - 3}",
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 24,
color: Color.fromRGBO(0, 0, 0, 1),
fontFamily: 'Inter',
),
),
),
),
),
),
],
),
),
],
);
},
),
],
);
}
@@ -206,7 +303,6 @@ class LinkPlaceholder extends StatelessWidget {
class _BackDrop extends StatelessWidget {
const _BackDrop({
super.key,
required this.backDropImage,
required this.children,
});
@@ -216,21 +312,25 @@ class _BackDrop extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Stack(
children: [
ThumbnailWidget(
backDropImage,
shouldShowArchiveStatus: false,
shouldShowSyncStatus: false,
),
BackdropFilter(
filter: ImageFilter.blur(sigmaX: 12, sigmaY: 12),
child: Container(
color: Colors.transparent,
return AspectRatio(
aspectRatio: 1,
child: Stack(
children: [
ThumbnailWidget(
backDropImage,
shouldShowArchiveStatus: false,
shouldShowSyncStatus: false,
thumbnailSize: thumbnailLargeSize,
),
),
...children,
],
BackdropFilter(
filter: ImageFilter.blur(sigmaX: 12, sigmaY: 12),
child: Container(
color: Colors.transparent,
),
),
...children,
],
),
);
}
}
@@ -239,12 +339,12 @@ class _CustomImage extends StatelessWidget {
const _CustomImage({
required this.width,
required this.height,
super.key,
required this.collages,
required this.file,
required this.zIndex,
this.imageShadow,
});
final EnteFile collages;
final List<BoxShadow>? imageShadow;
final EnteFile file;
final double zIndex;
final double height;
final double width;
@@ -255,35 +355,48 @@ class _CustomImage extends StatelessWidget {
transform: Matrix4.rotationZ(zIndex),
height: height,
width: width,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20.0),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.5),
spreadRadius: 1,
blurRadius: 1,
offset: const Offset(1, 1),
child: Stack(
children: [
Center(
child: Container(
height: height,
width: width,
decoration: ShapeDecoration(
color: const Color.fromRGBO(129, 129, 129, 0.1),
shadows: imageShadow,
shape: SmoothRectangleBorder(
borderRadius: SmoothBorderRadius(
cornerRadius: 21.0,
cornerSmoothing: 1.0,
),
),
),
),
),
BoxShadow(
color: Colors.black.withOpacity(0.5),
spreadRadius: 1,
blurRadius: 1,
offset: const Offset(-1, -1),
Center(
child: SizedBox(
height: height - 5,
width: width - 5,
child: ClipSmoothRect(
radius: SmoothBorderRadius(
cornerRadius: 16.0,
cornerSmoothing: 1,
),
clipBehavior: Clip.antiAliasWithSaveLayer,
child: Container(
decoration: BoxDecoration(boxShadow: imageShadow),
child: ThumbnailWidget(
file,
shouldShowArchiveStatus: false,
shouldShowSyncStatus: false,
thumbnailSize: thumbnailLargeSize,
),
),
),
),
),
],
),
child: ClipSmoothRect(
radius: SmoothBorderRadius(
cornerRadius: 20.0,
cornerSmoothing: 1,
),
clipBehavior: Clip.antiAliasWithSaveLayer,
child: ThumbnailWidget(
collages,
shouldShowArchiveStatus: false,
shouldShowSyncStatus: false,
),
),
);
}
}

View File

@@ -223,5 +223,5 @@ Future<void> shareImageAndUrl(
String imagePath,
String url,
) async {
await Share.shareFiles([imagePath], text: url);
await Share.shareXFiles([XFile(imagePath)], text: url);
}