Flutter 我可以将此图像资源和容器按钮放入蓝色容器中吗
我想让Flitter移动应用程序看起来像这样 但我从我的代码我得到了这个外观 这是我的密码Flutter 我可以将此图像资源和容器按钮放入蓝色容器中吗,flutter,flutter-layout,flutter-container,Flutter,Flutter Layout,Flutter Container,我想让Flitter移动应用程序看起来像这样 但我从我的代码我得到了这个外观 这是我的密码 import 'package:flutter/material.dart'; class HomePage extends StatefulWidget { @override _HomePageState createState() => _HomePageState(); } class _HomePageState extends State<HomePage>
import 'package:flutter/material.dart';
class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
elevation: 0.0,
backgroundColor: Colors.blue,
title: Text('title'),
),
body: Column(
children: <Widget>[
Container(
color: Colors.blue,
height: 150,
width: 500,
),
Image.asset(
'src/image.png',
width: 400,
),
Container(
//flatbutton group
),
],
),
);
}
}
导入“包装:颤振/材料.省道”;
类主页扩展了StatefulWidget{
@凌驾
_HomePageState createState()=>\u HomePageState();
}
类_HomePageState扩展状态{
@凌驾
小部件构建(构建上下文){
返回脚手架(
appBar:appBar(
标高:0.0,
背景颜色:Colors.blue,
标题:文本(“标题”),
),
正文:专栏(
儿童:[
容器(
颜色:颜色,蓝色,
身高:150,
宽度:500,
),
影像资产(
“src/image.png”,
宽度:400,
),
容器(
//扁平按钮组
),
],
),
);
}
}
我曾尝试使用堆栈,但它不起作用,或者在实现时我是错误的。
有人想帮我解决这个问题吗 使用堆栈而不是列 以下是更新后的完整代码:
class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
elevation: 0.0,
backgroundColor: Colors.blue,
title: Text('SIAP UNDIP'),
),
body: Stack(
alignment: Alignment.topCenter,
children: <Widget>[
Container(
color: Colors.blue,
height: 150,
width: 500,
),
Column(
children: <Widget>[
Container(
height: 90,
margin: EdgeInsets.all(10),
decoration: BoxDecoration(
shape: BoxShape.rectangle,
borderRadius: BorderRadius.all(Radius.circular(8.0)),
color: Colors.green,
image: DecorationImage(
image: AssetImage(
'src/image.png', // Enter the image here
),
),
),
),
Container(
height: 200,
margin: EdgeInsets.all(10),
decoration: BoxDecoration(
shape: BoxShape.rectangle,
borderRadius: BorderRadius.all(Radius.circular(8.0)),
boxShadow: [
BoxShadow(
color: Colors.grey[300],
spreadRadius: 1,
blurRadius: 4,
offset: Offset(0, 2),
),
],
color: Colors.white,
),
// child: , //Enter all the flat Buttons here
),
],
),
],
),
);
}
}
类主页扩展StatefulWidget{
@凌驾
_HomePageState createState()=>\u HomePageState();
}
类_HomePageState扩展状态{
@凌驾
小部件构建(构建上下文){
返回脚手架(
appBar:appBar(
标高:0.0,
背景颜色:Colors.blue,
标题:文本(“亚太统计所联合国发展计划”),
),
主体:堆栈(
对齐:alignment.topCenter,
儿童:[
容器(
颜色:颜色,蓝色,
身高:150,
宽度:500,
),
纵队(
儿童:[
容器(
身高:90,
保证金:所有(10),
装饰:盒子装饰(
形状:BoxShape.rectangle,
borderRadius:borderRadius.all(半径.圆形(8.0)),
颜色:颜色。绿色,
图像:装饰图像(
图片:资产评估(
'src/image.png',//在此处输入图像
),
),
),
),
容器(
身高:200,
保证金:所有(10),
装饰:盒子装饰(
形状:BoxShape.rectangle,
borderRadius:borderRadius.all(半径.圆形(8.0)),
boxShadow:[
箱形阴影(
颜色:颜色。灰色[300],
扩展半径:1,
半径:4,
偏移量:偏移量(0,2),
),
],
颜色:颜色,白色,
),
//子项:,//在此处输入所有平面按钮
),
],
),
],
),
);
}
}