flutter 修复整个屏幕的背景屏幕

6yjfywim  于 2023-10-22  发布在  Flutter
关注(0)|答案(1)|浏览(137)

我已经在这里设置了背景图像,但它并没有渲染整个屏幕。它只是在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,
            ),
          ),
        ],
      ),
    );
  }
holgip5t

holgip5t1#

class BaseLayout extends StatelessWidget{
      @override
      Widget build(BuildContext context){
        return Scaffold(
          body: Container(
            decoration: BoxDecoration(
              image: DecorationImage(
                image: AssetImage(your image path),
                fit: BoxFit.cover,
              ),
            ),
            child: null /* add child content here */,
          ),
        );
      }
    }

相关问题