2일차 과제 - rlatkddbs99/Flutter GitHub Wiki

  1. Generic이란 제네릭(Generic)이란 데이터 형식에 의존하지 않으면서, 다른 데이터 타입들로 사용할 수 있는 방법이다. 클래스 내부에서 데이터 타입을 지정하는것이 아니라, 실제 클래스를 사용하는 Actor에 의해서 지정할 수 있는 것이다. 제네릭을 사용하면 실수로 지정한 타입이 들어오는 경우 컴파일 시점에서 미리 예방할 수가 있게 된다. 또한 클래스 외부에서 데이터 타입을 지정하기 때무에, 타입을 고려해서 데이터를 이리저리 변환할 필요가 없다. 코드의 재사용성이 높아지고 전체 코드 관리가 용이. 제네릭에서는 <> 안에서 데이터 타입을 자유롭게 설정할 수 있다. 제네릭이 동작하는 방식은 먼저 타입의 경계를 지정하게 되면 컴파일 시점에서 해당 타입으로 데이터 타입 캐스팅이 진행되고, 매개변수의 타입을 삭제하게 된다. 클래스의 데이터 타입을 지정하는 간단한 역할을 하지만 코드를 재사용하게 만들어준다는 큰 장점을 가지고 있다. 하지만 코드가 다층화되기 시작하면 어떤 타입으로 계층을 구성했는지 이해하기 어려운 코드로 변질 될 수 있다는 단점이 있다.

2.Flutter 렌더링 과정 입력을 처리 애니메이션을 구동 위젯트리 빌드 RenderObject 위치와 크기 레이아웃 그리기 Element를 시각적으로 그리기 그려지는 순서대로 결합하기 GPU에 명령을 날려서 Rasterize

1, 2 번에 변화가 있을 때 빌드 빌드는 Element 트리를 업데이트 하고 이는 RenderOjbect 트리 업데이틀 의미

RenderObject는 레이아웃과 그리기를 담당. 레이아웃 단계에서 RenderObject트리를 거쳐 제약조건을 아래로 전달한다. 하위 RenderObject는 부모 객체를 크기를 전달한다.

레이아웃이 끝나면 그리기 시작. 그리기 끝나면 그려진 그림을 결합한다. 레이어트리에서 각 레이어의 모든 그림작업을 가진다. 레이어는 별개로 그려지기 때문에 곧 그룹화 된다.

마지막으로 엔진은 업데이트된 레이어트리를 받아 픽셀로 표현(Rasterize) 하게 된다.

3-1 1 import 'package:flutter/material.dart';

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

@override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( body: Center( child: Text("사랑을 다해 사랑을 하였노라고\n정작 해야 할 말이 남아 있었음을 알았을 때\n당신은 이미 남의 사람이 되어있었다\n\n불러여 할 뜨거운 노래를 가슴으로 죽이고\n당신은 멀리 이루어지고 있었다\n\n하마 곱스런 눈 웃음이 사라지기 전\n두고두고 아름다움으로 잊어 달라지만 \n남자에게서 여자란 기쁨 아니면 슬픔\n\n다섯 손가락 끝을 잘라 핏물 오선을 그려\n혼자라도 외롭지 않을 밤에 울어보리라\n\n울어서 멍든 눈흘김으로\n미워서 미워지도록 사랑하리라\n\n한 잔은 떠나버린 너를 위하여\n또 한 잔은 너와의 영원한 사랑을 위하여\n그리고 또 한 잔은 이미 초라해진 나를 위하여\n마지막 한 잔은 미리 알고 정하신 하나님을 위하여"), ), ), ); } }

3-2 2 import 'package:flutter/material.dart';

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

@override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( body: Center( child: Text("사랑을 다해 사랑을 하였노라고\n정작 해야 할 말이 남아 있었음을 알았을 때\n당신은 이미 남의 사람이 되어있었다\n\n불러여 할 뜨거운 노래를 가슴으로 죽이고\n당신은 멀리 이루어지고 있었다\n\n하마 곱스런 눈 웃음이 사라지기 전\n두고두고 아름다움으로 잊어 달라지만 \n남자에게서 여자란 기쁨 아니면 슬픔\n\n다섯 손가락 끝을 잘라 핏물 오선을 그려\n혼자라도 외롭지 않을 밤에 울어보리라\n\n울어서 멍든 눈흘김으로\n미워서 미워지도록 사랑하리라\n\n한 잔은 떠나버린 너를 위하여\n또 한 잔은 너와의 영원한 사랑을 위하여\n그리고 또 한 잔은 이미 초라해진 나를 위하여\n마지막 한 잔은 미리 알고 정하신 하나님을 위하여",style: TextStyle(fontSize: 25,color: Colors.blueGrey),), ), ), ); } }

3-3 3 import 'package:flutter/material.dart';

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

@override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( body: Center( child: Container( child: RichText( text: TextSpan( children:[ TextSpan(text:"사랑을 다해 사랑을 하였노라고\n정작 해야 할 말이 남아 있었음을 알았을 때\n당신은 이미 남의 사람이 되어있었다\n\n",style: TextStyle(color: Colors.green)), TextSpan(text:"불러여 할 뜨거운 노래를 가슴으로 죽이고\n당신은 멀리 이루어지고 있었다\n\n",style: TextStyle(color: Colors.blue)), TextSpan(text: "하마 곱스런 눈 웃음이 사라지기 전\n두고두고 아름다움으로 잊어 달라지만 \n남자에게서 여자란 기쁨 아니면 슬픔\n\n",style: TextStyle(color: Colors.brown)), TextSpan(text: "다섯 손가락 끝을 잘라 핏물 오선을 그려\n혼자라도 외롭지 않을 밤에 울어보리라\n\n",style: TextStyle(color: Colors.deepPurple)), TextSpan(text: "울어서 멍든 눈흘김으로\n미워서 미워지도록 사랑하리라\n\n",style: TextStyle(color: Colors.lime)), TextSpan(text: "한 잔은 떠나버린 너를 위하여\n또 한 잔은 너와의 영원한 사랑을 위하여\n그리고 또 한 잔은 이미 초라해진 나를 위하여\n마지막 한 잔은 미리 알고 정하신 하나님을 위하여",style: TextStyle(color: Colors.red)), ] )) ) ), ), ); } }

  1. 4 import 'package:flutter/material.dart';

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

@override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Container( width: 200,height: 200, child: CircleAvatar( backgroundColor: Colors.black, child: Icon(Icons.ac_unit_rounded,size: 150,), ), ) ], ), ), ), ); } }