250x250
반응형
Notice
Recent Posts
Recent Comments
Link
«   2024/05   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Archives
Today
Total
관리 메뉴

개발자 수니

[Flutter/Widget] Icon 본문

Flutter

[Flutter/Widget] Icon

개발자 수니 2022. 2. 24. 19:40
728x90
반응형

앤써북의 ⌜모두가 할 수 있는 플러터 UI 입문⌟을 참고하여 작성하였습니다.

📌  이번 글은

책의 샘플 앱을 만들면서 공부한 위젯 정리입니다.

 

Icon

  • Icon을 표시해주는 위젯
  • MaterialIcon(Icons), CupertinoIcon 사용 가능
  • 이외 Icon 라이브러리: https://pub.dev 
  • color 속성: MaterialColor(Colors), CupertinoColors, CustomColors(Color) 사용 가능
  • size 속성: 크기

 

👩🏻‍💻 사용 예제

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Icon'),
          centerTitle: true,
        ),
        body: const Center(
          child: Icon(    	// *** Icon 위젯 ***
            Icons.home,		// Material Icon 사용
            color: Colors.red,	// Icon 색상 설정: Material Colors 사용
            size: 100,			// Icon 크기 설정
          ),
        ),
      ),
    );
  }
}

 

🙋🏻‍♀️ 참고

최주호, 정호준, 정동진 공저, ⌜모두가 할 수 있는 플러터 UI 입문⌟, 앤써북(2021), p119

728x90
반응형
Comments