size the memory cover wiget according to the width of screen

This commit is contained in:
ashilkn 2024-01-17 11:15:19 +05:30
parent 138274b0f1
commit 9f73de352b
2 changed files with 23 additions and 9 deletions

View file

@ -16,9 +16,10 @@ class MemoriesWidget extends StatefulWidget {
}
class _MemoriesWidgetState extends State<MemoriesWidget> {
final double _widthOfItem = 85;
late ScrollController _controller;
late StreamSubscription<MemoriesSettingChanged> _subscription;
double _maxHeight = 0;
double _maxWidth = 0;
@override
void initState() {
@ -31,6 +32,14 @@ class _MemoriesWidgetState extends State<MemoriesWidget> {
_controller = ScrollController();
}
@override
void didChangeDependencies() {
super.didChangeDependencies();
final screenWidth = MediaQuery.sizeOf(context).width;
_maxWidth = screenWidth / 4;
_maxHeight = _maxWidth / MemoryCoverWidget.aspectRatio;
}
@override
void dispose() {
_subscription.cancel();
@ -68,18 +77,20 @@ class _MemoriesWidgetState extends State<MemoriesWidget> {
final collatedMemories = _collateMemories(memories);
return SizedBox(
height: MemoryCoverWidget.height,
height: _maxHeight,
child: ListView.builder(
physics: const BouncingScrollPhysics(),
scrollDirection: Axis.horizontal,
controller: _controller,
itemCount: collatedMemories.length,
itemBuilder: (context, itemIndex) {
final offsetOfItem = _widthOfItem * itemIndex;
final offsetOfItem = _maxWidth * itemIndex;
return MemoryCoverWidget(
memories: collatedMemories[itemIndex],
controller: _controller,
offsetOfItem: offsetOfItem,
maxHeight: _maxHeight,
maxWidth: _maxWidth,
)
.animate(delay: Duration(milliseconds: 75 * itemIndex))
.fadeIn(

View file

@ -10,14 +10,17 @@ class MemoryCoverWidget extends StatefulWidget {
final List<Memory> memories;
final ScrollController controller;
final double offsetOfItem;
final double maxHeight;
final double maxWidth;
static const centerStrokeWidth = 1.0;
static const width = 85.0;
static const height = 125.0;
static const aspectRatio = 0.68;
const MemoryCoverWidget({
required this.memories,
required this.controller,
required this.offsetOfItem,
required this.maxHeight,
required this.maxWidth,
super.key,
});
@ -68,8 +71,8 @@ class _MemoryCoverWidgetState extends State<MemoryCoverWidget> {
child: Row(
children: [
Container(
height: MemoryCoverWidget.height * scale,
width: MemoryCoverWidget.width * scale,
height: widget.maxHeight * scale,
width: widget.maxWidth * scale,
decoration: BoxDecoration(
boxShadow: [
BoxShadow(
@ -168,7 +171,7 @@ class _MemoryCoverWidgetState extends State<MemoryCoverWidget> {
),
),
height: 1 * scale,
width: 68 * scale,
width: (widget.maxWidth - 16) * scale,
),
),
],
@ -180,7 +183,7 @@ class _MemoryCoverWidgetState extends State<MemoryCoverWidget> {
child: Transform.scale(
scale: scale,
child: SizedBox(
width: MemoryCoverWidget.width,
width: widget.maxWidth,
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 8.0,