Text 위젯의 여러가지 스타일 변화.
주어진 예제에서 색이나 숫자의 크기등을 조정해 가면서 하신다면 더 빨리 이해 하실수 있습니다.
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Text(
'Hello 월드', //내가 쓰고 싶은 텍스트를 작성해 준다
style: TextStyle( // 글자의 스타일을 바꾸고 싶을때 사용
color: Colors.black, //글자의 색을 바꿔준다
fontSize: 100, //글자의 크기를 바꿔준다
letterSpacing: 10, // 자간 설정
fontWeight: FontWeight.w900, //글자의 굵기 변경
backgroundColor: Colors.yellow), //글자 바탕색 변경
),
);
}
}
Icon 위젯의 크기와 색상 변화
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Icon(
Icons.add_a_photo_outlined, //내가 원하는 아이콘 선택
size: 100, //아이콘의 크기 변경
color: Colors.blue, //아이콘의 색상 변경
),
);
}
}
'Flutter' 카테고리의 다른 글
왕왕 초보를 위한 Flutter 실습 기초 코드(Text,Icon,Image) (0) | 2023.02.16 |
---|---|
그림 위주의 Flutter SDK 와 Android studio 설치 (0) | 2023.02.08 |
Flutter에 대한 간단하고 빠른 소개 입니다 (0) | 2023.02.08 |
댓글