size the memory cover wiget according to the width of screen
This commit is contained in:
parent
138274b0f1
commit
9f73de352b
2 changed files with 23 additions and 9 deletions
|
@ -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(
|
||||
|
|
|
@ -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,
|
||||
|
|
Loading…
Add table
Reference in a new issue