下面的屏幕显示了从REST API检索到的类别列表。我的MainCategoryProvider会处理它。
我有一个AppBar、一个tipText(我的自定义tipText小部件)、类别列表和一个带有操作按钮和应用程序菜单的自定义BottomBar
import 'package:choooze_app/models/main_category_model.dart';
import 'package:choooze_app/providers/main_category_provider.dart';
import 'package:choooze_app/widgets/bottom_bar.dart';
import 'package:choooze_app/widgets/tip_text.dart';
import 'package:choooze_app/widgets/title.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:choooze_app/widgets/action_button.dart';
class MainCategoryListScreen extends StatelessWidget {
final _mainCategoryProvider = Get.find<MainCategoryProvider>();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: title(context, titleText: 'maincategory_list_title'.tr),
body: Padding(
padding: const EdgeInsets.fromLTRB(16.0, 0, 16.0, 16.0),
child: SafeArea(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
tipText(context, text: 'maincategory_list_tip'.tr),
Expanded(
child: FutureBuilder<List<MainCategoryModel>>(
future: _mainCategoryProvider.getMainCategories(),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return Center(
child: CircularProgressIndicator(),
);
} else if (snapshot.hasError) {
return Center(
child: Text('Error: ${snapshot.error}'),
);
} else {
final mainCategories = snapshot.data!;
return ListView.builder(
itemCount: mainCategories.length,
itemBuilder: (context, index) {
var mainCategory = mainCategories[index];
return InkWell(
child: Container(
padding:
const EdgeInsets.fromLTRB(0, 5.0, 0, 5.0),
decoration: index < mainCategories.length - 1
? BoxDecoration(
border: Border(
bottom: BorderSide(
color: Color(0xffcccccc),
),
),
)
: BoxDecoration(),
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Text(Get.locale == Locale('en')
? mainCategory.nameEn
: mainCategory.nameFr),
Text(
!mainCategory.active
? 'maincategory_detail_inactive'.tr
: '',
style: TextStyle(
color: Color(0xFFD06706),
),
),
],
),
),
onTap: () {},
);
},
);
}
},
),
),
BottomBar(
child: actionButton(
context,
buttonText: 'maincategory_list_actions_new'.tr,
),
),
],
),
),
),
);
}
}
这给了我以下结果=> Capture of the screen它看起来不错,但我希望元素列表坚持到屏幕底部,绿色按钮的正上方。
我怎样才能做到这一点?
我试着玩列设置,但没有成功。如果使用MainAxisAlliance.end将ListView.builder Package 在Column小部件中,我会得到以下错误:
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderViewport#82eda NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
box.dart:1
Failed assertion: line 1966 pos 12: 'hasSize'
The relevant error-causing widget was
ListView
main_category_list_screen.dart:44
════════════════════════════════════════════════════════════════════════════════
1条答案
按热度按时间gc0ot86w1#
如果我理解正确,并且您希望列表从底部开始,那么可以尝试在Column中的mainAxisAlignment字段中使用MainAxisAlignment.end。