我刚刚开始学习flutter,并在练习中使用了flutter_swiper软件包。当我将元素传递到滑动器时,我发现高度设置不适用于容器。
我尝试了容器的高度和约束属性,但它们仍然无法正常工作。
import 'package:flutter/material.dart';
import 'package:flutter_swiper/flutter_swiper.dart';
// banner
class Banner extends StatefulWidget {
@override
_BannerState createState() => _BannerState();
}
class _BannerState extends State<Banner> {
@override
Widget build(BuildContext context) {
return Container(
width: MediaQuery.of(context).size.width,
height: 240.0,
child: Swiper(
itemBuilder: _swiperBuilder,
itemCount: 5,
scrollDirection: Axis.horizontal,
loop: true,
duration: 500,
autoplay: true,
onTap: (index) {
debugPrint("u click index: $index");
},
autoplayDelay: 5000,
),
);
}
}
Widget _swiperBuilder(BuildContext context, int index) {
return Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(7.5),
image: DecorationImage(
image: NetworkImage("https://hjx-driver.oss-cn-hangzhou.aliyuncs.com/d15a4962-1286-92ca-b1a1-531df66f8078.png"),
fit: BoxFit.fill,
),
),
child: Container(
// height: 64.0,
constraints: BoxConstraints(
minHeight: 44.0,
maxHeight: 64.0,
),
margin: const EdgeInsets.fromLTRB(12.0, 0, 12.0, 12.0),
padding: const EdgeInsets.all(12.0),
decoration: BoxDecoration(
color: Color.fromARGB(190, 0, 0, 0),
borderRadius: BorderRadius.all(Radius.circular(7.5)),
),
child: Align(
alignment: FractionalOffset.bottomCenter,
child: Text(
"Test the the the hahaha, biubiu, hmmmmmmmm",
maxLines: 2,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontSize: 20.0,
color: Colors.white,
fontWeight: FontWeight.w500,
),
),
),
),
);
}
上面的代码不完整,请结合以下代码使用banner()
class Home extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
margin: const EdgeInsets.fromLTRB(12.0, 12.0, 12.0, 0),
child: Column(
children: <Widget>[
Banner(),
],
),
),
);
}
}