我正在 Flutter 上做一个报纸网站,但是每当我尝试实现 CarouselSlider 时,根据 carousel_slider 包,它无法访问列表,有没有人知道我如何实现这个 carousel与此代码具有相同的实现?
列表通知:
class ArticlesPosts {
String title;
String titleHome;
String subtitle;
String pic;
String author;
String notice;
String data;
ArticlesPosts({
this.title,
this.titleHome,
this.subtitle,
this.author,
this.pic,
this.notice,
this.data,
});
}
var allPosts = [
ArticlesPosts(
title:
'XXXXXXX',
titleHome: 'XXXXXXXXXXXXX',
subtitle: 'sssssssssssssssssssssssssssssssssssssssssssssss',
author: 'nome',
pic: 'assets/1.jpg',
notice:
'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
data: 'Published in 14/04/2021',
),
];
首页新闻页面:
import 'package:flutter/material.dart';
import 'package:flutter_application_1/views/home/posts.dart';
import 'articlesDetails.dart';
class MainScreen extends StatelessWidget {
final posts = allPosts;
@override
Widget build(BuildContext context) {
return ListView(
children: [
Column(children: [
SizedBox(height: 20),
Padding(
padding: EdgeInsets.only(left: 15.0),
child: Text(
"RobSIC News",
style: TextStyle(
fontWeight: FontWeight.w800, height: 3.0, fontSize: 26),
),
),
SizedBox(height: 30),
Container(
height: MediaQuery.of(context).size.height - 200,
child: GridView.count(
crossAxisCount: 1,
crossAxisSpacing: 0.5,
mainAxisSpacing: 0.5,
childAspectRatio: 4,
primary: false,
children: [
...posts.map((e) {
return buildPostsGrid(e, context);
}).toList()
]),
),
])
],
);
}
buildPostsGrid(ArticlesPosts posts, BuildContext context) {
return Card(
elevation: 9,
child: FlatButton(
onPressed: () {
Navigator.of(context).push(MaterialPageRoute(
builder: (context) => ArticlesDetail(selectedPosts: posts)));
},
child: Padding(
padding: EdgeInsets.all(5.0),
child: Stack(children: [
Container(height: 400, width: 900.0, color: Colors.transparent),
Positioned(
left: 30.0,
top: 30.0,
child: Container(
height: 30.0,
width: 40.0,
decoration: BoxDecoration(boxShadow: [
BoxShadow(
blurRadius: 7.0,
color: Colors.grey.withOpacity(0.75),
offset: Offset(5, 25),
spreadRadius: 12.0)
]))),
Positioned(
left: 12.0,
top: 15.0,
child: Hero(
tag: posts.pic,
child: Container(
height: 190.0,
width: 1000,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(7.0),
image: DecorationImage(
image: AssetImage(posts.pic),
fit: BoxFit.cover))))),
Positioned(
left: 15.0,
top: 145,
child: Column(children: [
Text(posts.titleHome,
style: TextStyle(
fontWeight: FontWeight.w600,
color: Colors.white70,
height: 1.6,
fontSize: 24)),
])),
Positioned(
left: 15.0,
top: 179,
child: Column(children: [
Text(posts.subtitle,
style: TextStyle(
fontWeight: FontWeight.w400,
color: Colors.white,
height: 1.2,
fontSize: 20)),
])),
Positioned(
left: 740.0,
top: 210,
child: Column(children: [
Text(posts.data,
style: TextStyle(
fontWeight: FontWeight.w400,
height: 1.2,
fontSize: 14)),
])),
Positioned(
left: 15.0,
top: 210,
child: Column(children: [
Text(posts.author,
style: TextStyle(
fontWeight: FontWeight.w400,
height: 1.2,
fontSize: 14)),
])),
]),
)),
);
}
}
新闻页面详情
import 'package:flutter/material.dart';
import 'package:flutter_application_1/views/home/posts.dart';
class ArticlesDetail extends StatefulWidget {
final ArticlesPosts selectedPosts;
const ArticlesDetail({Key key, this.selectedPosts}) : super(key: key);
@override
_ArticlesDetailState createState() => _ArticlesDetailState();
}
class _ArticlesDetailState extends State<ArticlesDetail> {
final posts = allPosts;
@override
Widget build(
BuildContext context,
) {
return Stack(
children: [
Container(
padding: EdgeInsets.only(
top: 25,
bottom: 16,
left: 16,
right: 16,
),
margin: EdgeInsets.only(top: 16),
decoration: BoxDecoration(
color: Colors.white,
shape: BoxShape.rectangle,
borderRadius: BorderRadius.circular(17),
boxShadow: [
BoxShadow(
color: Colors.black26,
blurRadius: 10,
offset: Offset(0, 10),
)
]),
child: Stack(children: [
ListView(
children: [
SizedBox(height: 10),
Positioned(
child: Container(
height: 90,
width: 300,
child: Text(widget.selectedPosts.title,
style: TextStyle(
fontSize: 26, fontWeight: FontWeight.w600)),
),
),
SizedBox(height: 10),
Positioned(
child: Container(
height: 50,
width: 300,
child: Text(widget.selectedPosts.subtitle,
style: TextStyle(
fontSize: 18, fontWeight: FontWeight.w300)),
),
),
SizedBox(height: 20),
Positioned(
child: Container(
height: 50,
width: 300,
child: Text(
'_______________________________________________________________________________________________________________________',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w100,
color: Colors.black12)),
),
),
SizedBox(height: 20),
Positioned(
child: Container(
height: 400,
width: 200,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage(widget.selectedPosts.pic))))),
SizedBox(height: 50),
Positioned(
child: Container(
height: 150,
width: 300,
child: Text(widget.selectedPosts.notice,
style: TextStyle(
fontSize: 18, fontWeight: FontWeight.w400)),
),
),
Align(
alignment: Alignment.bottomRight,
child: FlatButton(
onPressed: () {
Navigator.pop(context);
},
child: Text('Confirm')))
],
)
]),
)
],
);
}
}