【发布时间】：2019-01-13 18:34:04
【问题描述】：
我正在尝试制作一个类似于以下设计的小部件。我似乎无法弄清楚如何让我的物品成长。在android中我会使用match_parent。但这是我无法弄清楚它需要如何实现的东西？
这是我得到的：
我的自定义小部件
import 'package:flutter/material.dart';
class HomeTiles extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
color: Colors.white,
child: Column(mainAxisSize: MainAxisSize.max, children: [
Container(
child: Row(children: [
Expanded(
child: HomeItem(
title: Localization.of(context).homeExercises,
icon: Icons.fitness_center,
color: ThemeColors.blueColor)),
Padding(padding: EdgeInsets.only(left: ThemeDimens.padding)),
Expanded(
child: HomeItem(
title: Localization.of(context).homeDiet,
icon: Icons.restaurant_menu,
color: ThemeColors.greenColor))
])),
Padding(padding: EdgeInsets.only(top: ThemeDimens.padding)),
Container(
child: Row(
children: [
Expanded(
child: HomeItem(
title: Localization.of(context).homeTimer,
icon: Icons.timer,
color: ThemeColors.redColor)),
Padding(padding: EdgeInsets.only(left: ThemeDimens.padding)),
Expanded(
child: HomeItem(
title: Localization.of(context).homeMyClub,
icon: Icons.home,
color: ThemeColors.orangeColor)),
],
))
]));
}
}
这是 HomeTiles 小部件的父级：
import 'package:balance/page/history_page.dart';
import 'package:balance/page/users_page.dart';
import 'package:balance/widget/general/background.dart';
import 'package:balance/widget/general/bottom_navigation.dart';
import 'package:balance/widget/home/home_tiles.dart';
import 'package:flutter/material.dart';
class HomeScreen extends StatefulWidget {
@override
HomeScreenState createState() {
return new HomeScreenState();
}
}
class HomeScreenState extends State<HomeScreen> {
int _page = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Background(child: _getCorrectPage()),
bottomNavigationBar: BottomNavigation(onPageSelected: onPageSelected));
}
void onPageSelected(int index) {
setState(() {
_page = index;
});
}
Widget _getCorrectPage() {
switch (_page) {
case 0:
return HomeTiles();
case 1:
return HistoryPage();
case 2:
return UsersPage();
}
return Container();
}
}
给定的代码就是我现在所拥有的。我拍了第一张照片。使用此代码（我对高度值进行了硬编码）所以我知道我的其他小部件 HomeItem 可以完美运行：
import 'package:flutter/material.dart';
class HomeTiles extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
height: 798,
child: Column(mainAxisSize: MainAxisSize.max, children: [
Container(
height: (798 / 2) - 8,
child: Row(children: [
Expanded(
child: HomeItem(
title: Localization.of(context).homeExercises,
icon: Icons.fitness_center,
color: ThemeColors.blueColor)),
Padding(padding: EdgeInsets.only(left: ThemeDimens.padding)),
Expanded(
child: HomeItem(
title: Localization.of(context).homeDiet,
icon: Icons.restaurant_menu,
color: ThemeColors.greenColor))
])),
Padding(padding: EdgeInsets.only(top: ThemeDimens.padding)),
Container(
height: (798 / 2) - 8,
child: Row(
children: [
Expanded(
child: HomeItem(
title: Localization.of(context).homeTimer,
icon: Icons.timer,
color: ThemeColors.redColor)),
Padding(padding: EdgeInsets.only(left: ThemeDimens.padding)),
Expanded(
child: HomeItem(
title: Localization.of(context).homeMyClub,
icon: Icons.home,
color: ThemeColors.orangeColor)),
],
))
]));
}
}
我整天都在网上搜索。我没有得到我真正想要的结果。你会怎么做？有解决办法吗？
【问题讨论】：