我试图有一个动态列表的“完成”的明星为ElevatedButton
。这个按钮在顶部有一些文字,一个图像,然后在底部有一个“星星旗”(我附上了截图)。当我在宽度上有5
星时,没有溢出,但只要我添加更多(expl:10
),则其变为溢出。
你能帮助我了解如何才能使星星横幅不溢出10
计数?
谢谢你,理查德
Screenshot of Simulator on iPhone
我的代码被调用:
import 'package:app/justin/page_justin.dart';
import 'package:app/widgets/quiz/star_banner.dart';
import 'package:flutter/material.dart';
class QuizSelector extends StatelessWidget {
final String name;
final String imageFilenameAndPath;
final int starsCount;
final int starsCompleted;
const QuizSelector({
super.key,
required this.name,
required this.imageFilenameAndPath,
required this.starsCount,
required this.starsCompleted,
});
@override
Widget build(BuildContext context) {
return ElevatedButton(
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => const JustinHomePage()),
);
},
child: Column(
children: [
Text(name),
Expanded(child: Image.asset(imageFilenameAndPath)),
StarBanner(totalCount: starsCount, completedCount: starsCompleted),
],
),
);
}
}
import 'package:app/utils/r2l_colors.dart';
import 'package:flutter/material.dart';
class StarBanner extends StatelessWidget {
final int totalCount;
final int completedCount;
const StarBanner({required this.totalCount, required this.completedCount});
@override
Widget build(BuildContext context) {
return Row(
children: List.generate(
totalCount,
(index) => Icon(
index < completedCount ? Icons.star : Icons.star_border,
color: R2lColors.yellow,
),
),
);
}
}
2条答案
按热度按时间rhfm7lfc1#
我最终通过在我的
StarBanner
类中使用以下代码解决了这个问题。就像这样:我希望这对任何面临同样问题的人都能派上用场。
谢了,理查德
7eumitmz2#
我知道的可能的方法是使用
SingleChildScrollView
来修复溢出: