How to insert 2 decorative images into a container? [Flutter[

Question

I can't load two static images into a container via DecorationImage

I tried to load through an additional column, but in my opinion this is very bad for the developer. Perhaps there is a better result

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';

class Profile extends StatelessWidget {
  const Profile({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: Center(
        child: Container(
          width: 341,
          height: 91,
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(8),
            shape: BoxShape.rectangle,
            color: Color.fromRGBO(5, 96, 250, 1),
            image: DecorationImage(
              alignment: Alignment.bottomLeft,
              image: AssetImage('assets/images/elips2.png'),
            ),
          ),
          child: Column(
            children: [
              Flexible(
                flex: 1,
                child: Align(
                    alignment: Alignment.topRight,
                    child: Image.asset('assets/images/elips1.png')),
              ),
              // Align(
              //     alignment: Alignment.bottomLeft,
              //     child: Image.asset('assets/images/elips2.png')),
            ],
          ),
        ),
      ),
    );
  }
}

Answer 1

Why you don't use a Stack widget to overlay the images on top of each other. Like this way:

import 'package:flutter/material.dart';

class Profile extends StatelessWidget {
  const Profile({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: Center(
        child: Container(
          width: 341,
          height: 91,
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(8),
            color: Color.fromRGBO(5, 96, 250, 1),
          ),
          child: Stack(
            children: [
              Positioned(
                top: 0,
                right: 0,
                child: Image.asset('assets/images/elips1.png'),
              ),
              Positioned(
                bottom: 0,
                left: 0,
                child: Image.asset('assets/images/elips2.png'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}