import 'package:flutter/material.dart';

class UserProfile4 extends StatefulWidget {
  const UserProfile4({Key? key}) : super(key: key);

  @override
  State<UserProfile4> createState() => _UserProfile4State();
}

class _UserProfile4State extends State<UserProfile4> {
  @override
  Widget build(BuildContext context) {
    Size screenSize=MediaQuery.of(context).size;
    Color myColor= Colors.purple.shade800;
    return Scaffold(

      body: SafeArea(
        child: SingleChildScrollView(
          child: Stack(
            children: [
              Container(
                height: screenSize.height*.3,
                width: screenSize.width,
                decoration: const BoxDecoration(
                    image: DecorationImage(
                        image: AssetImage('assets/background.jpg',),fit: BoxFit.cover
                    )
                ),
              ),
              Container(
                height: screenSize.height,
                margin: EdgeInsets.only(top: screenSize.height*.27),
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.only(topLeft: Radius.circular(25),topRight: Radius.circular(25))
                ),
              ),
              Container(
                height: screenSize.height,
                margin: EdgeInsets.only(top: screenSize.height*.2),
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.only(topLeft: Radius.circular(25),topRight: Radius.circular(25))
                ),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Container(
                      height: screenSize.height*.18,
                      width: screenSize.height*.18,
                      decoration: BoxDecoration(image:  DecorationImage(
                        image: AssetImage('assets/user.jpg'),),
                          borderRadius: BorderRadius.circular(100),
                          border: Border.all(width: 4,color: Colors.white)

                      ),
                    ),
                    Text('John Doe',style: TextStyle(fontSize: 30,color: myColor),),
                    Text('xyz@xyz.com',style: TextStyle(fontSize: 18,color: myColor),),
                    SizedBox(height: 10,),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: [
                        Column(
                          children: [
                            Text('234',style: TextStyle(fontSize: 20,color: myColor),),
                            Text('Posts',style: TextStyle(fontSize: 20,color: myColor),)
                          ],
                        ),
                        Column(
                          children: [
                            Text('938',style: TextStyle(fontSize: 20,color: myColor),),
                            Text('Followers',style: TextStyle(fontSize: 20,color: myColor),)
                          ],
                        ),
                        Column(
                          children: [
                            Text('1023',style: TextStyle(fontSize: 20,color: myColor),),
                            Text('Following',style: TextStyle(fontSize: 20,color: myColor),)
                          ],
                        ),

                      ],
                    ),
                    Divider(thickness: 1,),
                    ListTile(
                      leading: Icon(Icons.business_center,color: Colors.black,),
                      title: Text('Tesla, Inc.',style: TextStyle(fontSize: 18,color: myColor),),
                    ),
                    ListTile(
                      leading: Icon(Icons.phone,color: Colors.black,),
                      title: Text('+11111111111',style: TextStyle(fontSize: 18,color: myColor),),
                    ),
                    ListTile(
                      leading: Icon(Icons.location_on,color: Colors.black,),
                      title: Text('13101 Tesla Road, Austin, Texas , U.S.',style: TextStyle(fontSize: 18,color: myColor),),
                    ),
                  ],
                ),
              ),

            ],
          ),
        ),
      ),
    );
  }
}