chore: fix safearea of flexible header

This commit is contained in:
Kingkor Roy Tirtho 2023-11-17 13:44:00 +06:00
parent 1b087c6eb3
commit fc4a39e9f3

View File

@ -2,6 +2,7 @@ import 'dart:ui';
import 'package:cached_network_image/cached_network_image.dart'; import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_desktop_tools/flutter_desktop_tools.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:spotube/collections/assets.gen.dart'; import 'package:spotube/collections/assets.gen.dart';
import 'package:spotube/components/shared/image/universal_image.dart'; import 'package:spotube/components/shared/image/universal_image.dart';
@ -52,8 +53,8 @@ class TrackViewFlexHeader extends HookConsumerWidget {
], ],
floating: false, floating: false,
pinned: true, pinned: true,
expandedHeight: 400, expandedHeight: 450,
automaticallyImplyLeading: false, automaticallyImplyLeading: DesktopTools.platform.isMobile,
backgroundColor: palette.color, backgroundColor: palette.color,
title: isExpanded ? null : Text(props.title, style: headingStyle), title: isExpanded ? null : Text(props.title, style: headingStyle),
flexibleSpace: FlexibleSpaceBar( flexibleSpace: FlexibleSpaceBar(
@ -79,56 +80,58 @@ class TrackViewFlexHeader extends HookConsumerWidget {
tileMode: TileMode.clamp, tileMode: TileMode.clamp,
), ),
), ),
child: Padding( child: SafeArea(
padding: const EdgeInsets.all(8.0), child: Padding(
child: Column( padding: const EdgeInsets.all(8.0),
mainAxisSize: MainAxisSize.min, child: Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [ crossAxisAlignment: CrossAxisAlignment.center,
Flex( children: [
direction: mediaQuery.mdAndDown Flex(
? Axis.vertical direction: mediaQuery.mdAndDown
: Axis.horizontal, ? Axis.vertical
mainAxisSize: MainAxisSize.min, : Axis.horizontal,
children: [ mainAxisSize: MainAxisSize.min,
ClipRRect( children: [
borderRadius: BorderRadius.circular(10), ClipRRect(
child: UniversalImage( borderRadius: BorderRadius.circular(10),
path: props.image, child: UniversalImage(
width: 200, path: props.image,
height: 200, width: 200,
placeholder: Assets.albumPlaceholder.path, height: 200,
placeholder: Assets.albumPlaceholder.path,
),
), ),
), const Gap(20),
const Gap(20), Column(
Column( mainAxisSize: MainAxisSize.min,
mainAxisSize: MainAxisSize.min, crossAxisAlignment: mediaQuery.mdAndDown
crossAxisAlignment: mediaQuery.mdAndDown ? CrossAxisAlignment.center
? CrossAxisAlignment.center : CrossAxisAlignment.start,
: CrossAxisAlignment.start, children: [
children: [ Text(props.title, style: headingStyle),
Text(props.title, style: headingStyle), const SizedBox(height: 10),
const SizedBox(height: 10), if (description != null &&
if (description != null && description.isNotEmpty)
description.isNotEmpty) Text(
Text( description,
description, style: defaultTextStyle.style.copyWith(
style: defaultTextStyle.style.copyWith( color: palette.bodyTextColor,
color: palette.bodyTextColor, ),
maxLines: 2,
overflow: TextOverflow.ellipsis,
), ),
maxLines: 2, const Gap(10),
overflow: TextOverflow.ellipsis, const TrackViewHeaderActions(),
), const Gap(10),
const Gap(10), TrackViewHeaderButtons(color: palette),
const TrackViewHeaderActions(), ],
const Gap(10), ),
TrackViewHeaderButtons(color: palette), ],
], ),
), ],
], ),
),
],
), ),
), ),
), ),