How to align circleAvatar over a background image

Question

Asked by Praveen K on November 24, 2021 (source).

Here is my code.. Here I want CircleAvatar over that background image.

     body: SingleChildScrollView(
      child: Stack(
      children: [
        Column(
          children: [
            CircleAvatar(
              backgroundImage: AssetImage('images/images.jpg'),
            ),
            Image(
              image: AssetImage('images/flutter.jpg'),
            ),
            label('First Name'),
            label('Second name'),
            label('Email-id'),
            label('Passowrd'),
            label('Confirm passowrd'),
               ],
               ),
             ],
            ),
          ),
        backgroundColor: Colors.white,
      );
   }
 }

And one more thing how to give gradient to appBar. Thanks in advance.!

Answer

Question answered by Hüseyin G (source).

Try

Container(
    decoration: BoxDecoration(
        image: DecorationImage(
            image: AssetImage('images/flutter.jpg'),
            fit: BoxFit.cover,
            ),
        ),
        child: Padding(
             padding: const EdgeInsets.all(8.0),
             child: CircleAvatar(
                backgroundImage: AssetImage('images/images.jpg'),
                ),
            ),
),

instead of

CircleAvatar(
    backgroundImage: AssetImage('images/images.jpg'),
),
Image(
    image: AssetImage('images/flutter.jpg'),
    ),

And for gredient app bar you can use https://pub.dev/packages/new_gradient_app_bar

Video Answers on YouTube

DART FLUTTER
SHARE: