ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • CircleAvatar 위젯 사용하기
    카테고리 없음 2023. 1. 27. 15:30

    CircleAvatar 위젯을 사용하여 아래의 이미지와 동일한 결과물을 만들고, 이를 만들기 위한 전체 코드를 작성하세요.

    ( 색상, 그림자 자유, 사용한 icon 이름 : ac_unit_rounded, )

     

     

     

    import 'package:flutter/material.dart';

    void main() {
      runApp(const MyApp());
    }
    class MyApp extends StatelessWidget {
      const MyApp({super.key});

      @override
      Widget build(BuildContext context) {
        return const MaterialApp(
          home: Scaffold(
            body: Center(             //가운데 정렬
              child: CircleAvatar(        //CircleAvatar 위젯사용(이미지를 원형으로 만들고 싶을 때)
                radius:60,                   //원 사이즈
                backgroundColor: Color.fromARGB(255, 9, 120, 211),                 //배경 원 색상
                child: Icon(Icons.ac_unit_rounded,                                               //아이콘
                color: Color.fromARGB(255, 255, 255, 255),                                //아이콘 색상
                size: 60,                                                                                        //아이콘 사이즈
                shadows: [                                              //아이콘 그림자넣기 List형태
                  Shadow(
                    blurRadius: 10.0,
                    color: Colors.black,
                    offset: Offset(1.1, 1.1)                          //그림자 위치
                  ),
                ],

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

    다르지만 비슷...ㅎ

     

Designed by Tistory.