Flutter PageView动态高度

Question

我创建了一个固定值的PageView，但这是一个问题。我怎么把它转换成动态高度呢?SizedBox是Column的子原子。我尝试了Expanded和Flexible小部件，但它们不起作用。

class BranchViewBottomSection extends ConsumerWidget {
const BranchViewBottomSection({
Key? key,
required this.data,
required this.branchId,
required this.companyId,
}) : super(key: key);
final Map<String, dynamic> data;
final String branchId;
final String companyId;
@override
Widget build(BuildContext context, WidgetRef ref) {
return Column(
children: [
SizedBox(
height: 50,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
ListView.builder(
shrinkWrap: true,
scrollDirection: Axis.horizontal,
itemCount: data['available_sections'].length,
itemBuilder: (BuildContext context, int index) {
if (data['available_sections'][index]["branchTabValue"] ==
ref.read(tabIndexProvider)) {
return BranchSectionBox(
data: data, index: index, isActive: true);
} else {
return BranchSectionBox(
data: data, index: index, isActive: false);
}
},
),
],
),
),
GestureDetector(
onTap: () {
Navigator.of(context).push(
PageRouteBuilder(
pageBuilder: (context, animation, secondaryAnimation) =>
MenuView(
branchId: branchId,
companyId: companyId,
branchData: data,
),
transitionsBuilder:
(context, animation, secondaryAnimation, child) {
const begin = Offset(1.0, 0.0);
const end = Offset.zero;
const curve = Curves.ease;
final tween = Tween(begin: begin, end: end);
final curvedAnimation = CurvedAnimation(
parent: animation,
curve: curve,
);
return SlideTransition(
position: tween.animate(curvedAnimation),
child: child,
);
},
),
);
},
child: Container(
height: 50,
width: MediaQuery.of(context).size.width,
color: Colors.pink,
child: const Center(
child: Text(
"Sipariş vermek için dokunun.",
style: TextStyle(color: Colors.white),
),
),
),
),
Expanded(
child: PageView(
onPageChanged: (v) {
ref.watch(tabIndexProvider.notifier).state =
data['available_sections'][v]['branchTabValue'];
},
children: <Widget>[
BranchViewHomePage(),
BranchViewDetailsPage(),
const BranchViewCommentsPage(),
BranchViewContactPage(),
],
),
)
],
);
}
}

这是父节点。

// ignore_for_file: non_constant_identifier_names, file_names
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:neshapp/comps/common/MainCircularProgressIndicator.dart';
import 'package:neshapp/services/FirestoreService.dart';
import 'package:neshapp/utils/constants.dart';
import '../../providers/BranchViewProviders.dart';
import '../../providers/MenuProviders.dart';
import 'BranchSectionBoxes.dart';
class BranchView extends ConsumerWidget {
final String branchId;
final String companyId;
final String tableNo;
const BranchView(
{Key? key,
required this.branchId,
required this.companyId,
required this.tableNo})
: super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
/*
Uygulamanın her yerinde kullanabilmek için eğer bir şubeye
girilirse şubenin ve markanın id'lerini providerlara veriyorum.
*/
ref.watch(branchIdProvider.notifier).setId(branchId);
ref.watch(companyIdProvider.notifier).setId(companyId);
ref.watch(tableNoProvider.notifier).setTable(tableNo);
return SafeArea(
child: Scaffold(
body: FutureBuilder<DocumentSnapshot>(
future: FirestoreService.getBranchData(companyId, branchId),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
final data = snapshot.data?.data() as Map<String, dynamic>;
return CustomScrollView(
scrollBehavior: const ScrollBehavior(),
slivers: <Widget>[
SliverAppBar(
elevation: 0,
title: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text("${data['branch_name']} Şubesi"),
FutureBuilder<DocumentSnapshot>(
future: FirestoreService.getCompanyData(companyId),
builder: (context, snapshot) {
if (snapshot.connectionState ==
ConnectionState.done) {
final CData =
snapshot.data?.data() as Map<String, dynamic>;
return Container(
height: 40,
width: 40,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: constsColor.black.withOpacity(0.5),
),
child: Image.network(CData['company_logo']),
);
} else {
return const MainCircularProgressIndicator();
}
},
),
],
),
pinned: true,
expandedHeight: 200,
backgroundColor: constsColor.neshMoru,
flexibleSpace: FlexibleSpaceBar(
background: AspectRatio(
aspectRatio: 16 / 9,
child: Stack(
children: [
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: NetworkImage(data['branch_image']),
fit: BoxFit.cover,
),
),
),
Positioned(
bottom: 10,
right: 10,
child: Text(
tableNo,
style: TextStyle(
color: constsColor.white,
fontSize: 18,
),
),
),
],
),
),
),
),
SliverToBoxAdapter(
child: BranchViewBottomSection(
data: data,
branchId: branchId,
companyId: companyId,
),
),
],
);
} else {
return const Center(
child: MainCircularProgressIndicator(),
);
}
},
),
),
);
}
}

Answer 1

扩展和灵活，我相信都依赖于组件。

如何使用状态呢?