【发布时间】:2020-12-04 23:47:20
【问题描述】:
flutter 闪屏显示在首页前的屏幕上。但是主页有一些从互联网上获取的数据。初始屏幕的持续时间设置为固定秒。我很想知道有没有办法在颤动中使闪屏在屏幕上可见,直到所有数据都加载到下一个屏幕上?
我的闪屏类
import 'dart:async';
import 'package:flutter/material.dart';
import 'listview.dart';
class SplashScreen extends StatefulWidget {
@override
_SplashScreenState createState() => _SplashScreenState();
}
class _SplashScreenState extends State<SplashScreen> {
@override
void initState() {
super.initState();
Timer(
Duration(seconds: 5),
() => Navigator.of(context).pushReplacement(MaterialPageRoute(
builder: (BuildContext context) => restlistview())));
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
body: DecoratedBox(
position: DecorationPosition.background,
decoration: BoxDecoration(
color: Colors.white,
image: DecorationImage(
image: NetworkImage(
'https://i.imgur.com/KS9AbXK.png',
),
fit: BoxFit.cover)),
child: Image.network('https://i.imgur.com/o4ZRh9k.png'),
),
);
}
}
启动画面之后的类
import 'package:flutter/material.dart';
class restlistview extends StatelessWidget {
@override
Widget build(BuildContext context) {
final title = "ListView List";
List choices = const [
const Choice(
title: 'Artisan Coffee',
Address: 'Kumarpara,Sylhet',
imglink: 'https://i.imgur.com/9TUi7ts.png'),
const Choice(
title: 'Cafe Aarko',
Address: 'Barutkhana,Sylhet',
imglink: 'https://i.imgur.com/JEfDpIZ.png?1'),
const Choice(
title: 'Cafe La vista',
Address: 'Zindabazar,Sylhet',
imglink: 'https://i.imgur.com/u4Lvc4k.png'),
const Choice(
title: 'Coffee Club',
Address: 'Kumarpara,Sylhet',
imglink: 'https://i.imgur.com/gVoh8xO.png'),
const Choice(
title: 'Peepers',
Address: 'Zindabazar,Sylhet',
imglink: 'https://i.imgur.com/izRo3Tj.png'),
const Choice(
title: 'The Swad Restaurant',
Address: 'Zindabazar,Sylhet',
imglink: 'https://i.imgur.com/o4ZRh9k.png'),
];
return MaterialApp(
title: title,
home: Scaffold(
appBar: AppBar(
title: Image.network(
'https://i.imgur.com/Z9ETdwa.png',
fit: BoxFit.cover,
),
backgroundColor: Color(0xffB01C2A),
),
body: DecoratedBox(
position: DecorationPosition.background,
decoration: BoxDecoration(
color: Color(0xffFAAF40),
image: DecorationImage(image: NetworkImage(''))),
child: new ListView(
shrinkWrap: true,
padding: const EdgeInsets.only(top: 10.0),
children: List.generate(choices.length, (index) {
return Center(
child: ChoiceCard(
choice: choices[index], item: choices[index]),
);
})))));
}
}
class Choice {
final String title;
final String Address;
final String imglink;
const Choice({this.title, this.Address, this.imglink});
}
class ChoiceCard extends StatelessWidget {
const ChoiceCard(
{Key key,
this.choice,
this.onTap,
@required this.item,
this.selected: false})
: super(key: key);
final Choice choice;
final VoidCallback onTap;
final Choice item;
final bool selected;
@override
Widget build(BuildContext context) {
TextStyle textStyle = Theme.of(context).textTheme.display1;
if (selected)
textStyle = textStyle.copyWith(color: Colors.lightGreenAccent[400]);
return Card(
elevation: 0.0,
color: Color(0xffB01C2A).withOpacity(0.2),
child: Row(
children: [
new Container(
color: Colors.transparent,
height: 100,
width: 100,
padding: const EdgeInsets.only(
top: 8.0, bottom: 8.0, left: 0.0, right: 8.0),
child: Image.network(choice.imglink)),
new Container(
padding: const EdgeInsets.only(
top: 30.0, bottom: 8.0, left: 2.0, right: 8.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(choice.title,
style: TextStyle(
fontSize: 20,
color: Color(0xffB01C2A),
fontWeight: FontWeight.bold)),
Text(choice.Address,
style: TextStyle(
color: Colors.black.withOpacity(1.0),
fontWeight: FontWeight.bold)),
],
),
)
],
crossAxisAlignment: CrossAxisAlignment.start,
));
}
}
主类
import 'package:flutter/material.dart';
import 'package:sylhetrestaurant/splashscreen.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext contextP) {
return MaterialApp(debugShowCheckedModeBanner: false, home: SplashScreen());
}
}
【问题讨论】:
标签: android flutter dart splash-screen