我已经在这里设置了背景图像,但它并没有渲染整个屏幕。它只是在SVG Mage 的背景下出现的。在那里我想作为整个屏幕的背景,也SVG图像应该在屏幕的中心。
class IntroScreen extends StatelessWidget {
IntroScreen({Key? key}) : super(key: key);
final List<PageViewModel> pages = [
PageViewModel(
title: '', // Empty title
body: '', // Empty body
image: Center(
child: Stack(
alignment: Alignment.bottomCenter,
children: [
// Background image
Container(
// width: mediaQueryData.size.i,
// height: mediaQueryData.size.height,
decoration: BoxDecoration(
// color: theme.colorScheme.onPrimary.withOpacity(1),
image: DecorationImage(
image: AssetImage('assets/images/img_bgplain1.png'),
fit: BoxFit.cover,
),
),
),
// SVG image centered on top of the background
Center(
child: SvgPicture.asset(
'assets/images/img_group_deep_orange_50.svg',
height: 900, // Adjust the image size as needed
fit: BoxFit.contain,
),
),
],
),
),
),
PageViewModel(
title: '', // Empty title
body: '',
footer: SizedBox(
height: 45,
width: 300,
),
image: Center(
child: Stack(
children: [
// Background image (same as previous page)
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/img_bgplain1.png'),
fit: BoxFit.cover,
),
),
),
// SVG image centered on top of the background
Center(
child: SvgPicture.asset(
'assets/images/img_group_deep_orange_a100_01.svg',
height: 900, // Adjust the image size as needed
fit: BoxFit.contain,
),
),
],
),
),
),
PageViewModel(
title: '', // Empty title
body: '',
footer: SizedBox(
height: 45,
width: 300,
),
image: Center(
child: Stack(
children: [
// Background image (same as previous pages)
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/img_bgplain1.png'),
fit: BoxFit.cover,
),
),
),
// SVG image centered on top of the background
Center(
child: SvgPicture.asset(
'assets/images/img_group_deep_orange_100_01.svg',
height: 900, // Adjust the image size as needed
fit: BoxFit.contain,
),
),
],
),
),
),
];
@override
Widget build(BuildContext context) {
return Scaffold(
body: Stack(
children: [
// Background image for the whole screen
Container(
width: double.infinity,
height: double.infinity,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage(ImageConstant.imgBgplain1),
fit: BoxFit.cover,
),
),
),
Padding(
padding: const EdgeInsets.fromLTRB(10, 80, 10, 10),
child: IntroductionScreen(
pages: pages,
dotsDecorator: const DotsDecorator(
size: Size(10, 10),
color: Color.fromARGB(255, 234, 230, 226),
activeSize: Size.square(15),
activeColor: Color.fromARGB(255, 153, 13, 3),
),
showDoneButton: true,
done: const Text('Done', style: TextStyle(fontSize: 20)),
showSkipButton: true,
skip: const Icon(Icons.close, size: 25),
showNextButton: true,
next: const Icon(Icons.arrow_forward, size: 25),
onDone: () => onDone(context),
curve: Curves.bounceOut,
),
),
],
),
);
}
1条答案
按热度按时间holgip5t1#