Dart 2.17 이후 생성자를 통한 객체 초기화 변경 내용 (+Quick Fix 사용법)

2024. 11. 22. 17:01같이 공부합시다 - Flutter/Flutter 기본기

728x90
반응형


출처 : Chat GPT, Flutter 업데이트



이전 글에서 기본이 되는 틀을 잡았다면,
이번에는 기능을 넣어볼 시간인데,
코드 체크를 하다가 벌써 문제(?)가 확인되었다.



[ 기존 코드 ]

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(
      debugShowCheckedModeBanner: false, // 디버그 배너 숨기기
      title: 'To-Do List',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const TodoListScreen(),
    );
  }
}

class TodoListScreen extends StatelessWidget {
  const TodoListScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('To-Do List'),
      ),
      body: const Center(
        child: Text('할 일이 없습니다!'),
      ),
    );
  }
}


생성자에 파란 밑줄이 있는 것을 확인할 수 있다.
(VSCode에서)


코드에서 “'key'를 슈퍼 매개변수로 변환하세요.”
라는 Problem 이 확인된다.

애플리케이션 실행에는 문제가 없지만
고쳐서 나쁠 건 없으니까.

내용을 확인해 보니 다음과 같았다.


  • Dart 2.17 이전에서 사용되던 초기화 방법
  • 부모 클래스(StatelessWidget)의 생성자를 명시적으로 호출하여 key 값을 전달
  • Dart의 전통적인 초기화 방식



사실문제라기보단 Flutter 정식 규격에
맞지 않는다는 경고(?) 정도 해주는 것 같다.

그럼 어떻게 고치면 될까?
바로 Quick Fix!

경고가 있는 곳에서 Ctrl + . 단축키를
사용하면 바로 메뉴가 나온다.


Quick Fix 메뉴 중에서
"Convert to using super parameters" 를 선택하자.


짜잔. 바로 수정 완료.


바꾸기 전에도 잘 동작했기 때문에
달라진 것은 모르겠다.
다른 점이 뭘까?


  • 이 방식은 Dart 2.17부터 추가된 문법으로, 더 간결하게 부모 클래스의 key를 전달할 수 있도록 설계되었습니다.
  • super.key는 부모 클래스의 key 매개변수를 암시적으로 참조하여 값을 전달합니다.
  • 코드가 짧아지고, 가독성이 좋아졌습니다.




으흠 ~
Flutter는 암시적으로 처리되는 것을
참 좋아하는 것 같다.

코드가 짧아지면 더 좋겠지.
하지만 나 같은 초보자에게는 이런 설명 없이
짧아진 코드만 보면 의미 파악이 더 어려울 수 있겠다.

그런데
부모 클래스에 key는 왜 전달해야 하는 걸까?


  • key는 위젯 트리에서 위젯을 고유하게 식별하는 데 필요합니다.
  • 부모 클래스에 key를 전달하는 이유는 Flutter의 효율적인 비교상태 유지를 위해 필수적이기 때문입니다.
  • 간단한 위젯에서는 key가 필요하지 않을 수도 있지만, 동적 리스트상태 유지가 필요한 경우 반드시 사용해야 합니다.

오호 위젯을 식별하는 값이구나.
뭐, 와닿지는 않지만 꼭 넣어야 하는 코드구만.
( 이 내용도 계속 접하다 보면 언젠간 이해가 되겠지. )

오늘은 여기서 끝!





 

728x90
반응형