【发布时间】:2022-08-07 18:51:36
【问题描述】:
我正在创建一个简单的 CRUD 应用程序,在编写 UI 代码时,我一直遇到这个问题,我的应用程序没有占据 android 模拟器的全屏,脚手架的左右两侧都有白条(您可以在应用栏旁边看到它)。当我在正文中添加任何其他小部件时,它也存在。这是我面临的问题:
这是为了重新创建此问题的脚手架:
class StatisticView extends StatelessWidget {
const StatisticView({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
bool statisticAvailable = false;
const Color BACKGROUND_COLOR = Color(0xffFAFAFA);
const Color COLOR_GREEN = Color(0xff007336);
const Color COLOR_BROWN = Color(0xff4B4539);
const Color COLOR_BLACK = Color(0xff333333);
return SafeArea(
child: Scaffold(
extendBody: true,
backgroundColor: BACKGROUND_COLOR,
appBar: AppBar(
toolbarHeight: 110,
title: Padding(
padding: EdgeInsets.only(top: 55),
child: Text(
\"Hours Leaderboard\",
style: GoogleFonts.poppins(
fontWeight: FontWeight.w600,
fontSize: 28,
color: const Color(0xffFFFFFF)),
),
),
backgroundColor: COLOR_GREEN,
),
body: statisticAvailable == false ? Center(child: Text(\"This feature is currently unavailable.\")) : SingleChildScrollView(
child: Container(
child: Column(
children: [
SizedBox(
height: 20,
),
Stack(
children: [
Padding(
padding: EdgeInsets.only(top: 50, left: 175),
child: Center(
child: Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(\"3\",
style: GoogleFonts.poppins(
fontSize: 17, fontWeight: FontWeight.w800)),
SizedBox(
height: 8,
),
Container(
decoration: BoxDecoration(
borderRadius:
BorderRadius.all(Radius.circular(100)),
boxShadow: [
BoxShadow(
color: COLOR_BROWN.withOpacity(0.5),
spreadRadius: 8,
blurRadius: 7,
),
],
),
child: CircleAvatar(
backgroundImage: NetworkImage(
\"https://www.inquisitr.com/wp-content/uploads/2019/12/florence-pugh.jpg\"),
radius: 55,
),
),
Padding(
padding: EdgeInsets.only(top: 15),
child: Text(\"Florence\",
style: GoogleFonts.poppins(
fontWeight: FontWeight.w600,
fontSize: 15,
color: COLOR_BLACK,
)),
),
Text(\"20\",
style: GoogleFonts.poppins(
fontWeight: FontWeight.w600,
fontSize: 15,
color: COLOR_GREEN,
)),
],
),
),
),
),
Padding(
padding: EdgeInsets.only(top: 50, right: 175),
child: Center(
child: Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(\"2\",
style: GoogleFonts.poppins(
fontSize: 17, fontWeight: FontWeight.w800)),
SizedBox(
height: 8,
),
Container(
decoration: BoxDecoration(
borderRadius:
BorderRadius.all(Radius.circular(100)),
boxShadow: [
BoxShadow(
color: COLOR_BROWN.withOpacity(0.5),
spreadRadius: 8,
blurRadius: 7,
),
],
),
child: CircleAvatar(
backgroundImage: NetworkImage(
\"https://imagesvc.meredithcorp.io/v3/mm/image?url=https%3A%2F%2Fstatic.onecms.io%2Fwp-content%2Fuploads%2Fsites%2F6%2F2019%2F07%2Fsimon-liu-2000.jpg\"),
radius: 55,
),
),
Padding(
padding: EdgeInsets.only(top: 15),
child: Text(\"Simu\",
style: GoogleFonts.poppins(
fontWeight: FontWeight.w600,
fontSize: 15,
color: COLOR_BLACK,
)),
),
Text(\"48\",
style: GoogleFonts.poppins(
fontWeight: FontWeight.w600,
fontSize: 15,
color: COLOR_GREEN,
)),
],
),
),
),
),
Center(
child: Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Image.asset(
\"assets/images/crown.png\",
height: 35,
width: 35,
),
SizedBox(
height: 8,
),
Material(
borderRadius:
BorderRadius.all(Radius.circular(100)),
elevation: 2,
child: Container(
decoration: BoxDecoration(
borderRadius:
BorderRadius.all(Radius.circular(100)),
boxShadow: [
BoxShadow(
color: COLOR_GREEN.withOpacity(0.5),
spreadRadius: 8,
blurRadius: 7,
),
],
),
child: CircleAvatar(
backgroundImage: NetworkImage(
\"https://imagesvc.meredithcorp.io/v3/mm/image?q=85&c=sc&rect=255%2C0%2C1875%2C1080&poi=face&w=1920&h=1280&url=https%3A%2F%2Fstatic.onecms.io%2Fwp-content%2Fuploads%2Fsites%2F20%2F2021%2F09%2F13%2FJack-Harlow-chicken-shop-date.jpg\"),
radius: 60,
),
),
),
Padding(
padding: EdgeInsets.only(top: 15),
child: Text(\"Jack\",
style: GoogleFonts.poppins(
fontWeight: FontWeight.w600,
fontSize: 15,
color: COLOR_BLACK,
)),
),
Text(\"52\",
style: GoogleFonts.poppins(
fontWeight: FontWeight.w600,
fontSize: 15,
color: COLOR_GREEN,
)),
],
),
),
),
],
),
Padding(
padding: EdgeInsets.only(left: 22, top: 10),
child: Align(
alignment: Alignment.centerLeft,
child: Text(
\"Runner-Ups\",
style: GoogleFonts.poppins(
fontWeight: FontWeight.w600,
fontSize: 18,
color: COLOR_BLACK,
),
),
),
),
Column(
children: [
PlayerStatistc(
placement: \"4\",
name: \"Raj Bhawlaser\",
hours: \"15\",
imageUrl:
\"https://images.unsplash.com/photo-1500648767791-00dcc994a43e?ixid=MnwxMjA3fDB8MHxzZWFyY2h8Mnx8cmFuZG9tJTIwcGVvcGxlfGVufDB8fDB8fA%3D%3D&ixlib=rb-1.2.1&w=1000&q=80\",
),
PlayerStatistc(
placement: \"5\",
name: \"Bob Dylan\",
hours: \"13\",
imageUrl:
\"https://cdn4.pitchfork.com/longform/1005/BobDylan.jpg\",
),
PlayerStatistc(
placement: \"6\",
name: \"Barack Obama\",
hours: \"11\",
imageUrl:
\"https://ca-times.brightspotcdn.com/dims4/default/bec99d7/2147483647/strip/true/crop/2000x2706+0+0/resize/840x1137!/quality/90/?url=https%3A%2F%2Fcalifornia-times-brightspot.s3.amazonaws.com%2Fff%2F2c%2Fdedf568e4af087cab5f0a5c76f32%2Fla-ca-bk-a-promised-land-barack-obama-183.JPG\",
),
],
),
],
),
),
),
),
);
}
}
标签: android ios flutter flutter-layout