[Flutter] 5. 스니펫 설정

윤설안

May 27, 2025

💡

스니펫이란 위젯이나 기능을 실제 코드 예제로 간단히 보여주는 짧은 코드 조각이다. 코드 조각을 입력하면 그에 해당하는 코드를 자동 작성해준다.

1. Settings - Live Templates

Flutter를 클릭 후, + 버튼을 눌러서 Live Template 추가

abbreviation : 스니펫 이름(단축어)

Template Text : 자동으로 입력되는 코드작성


import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {

  const MyApp();

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: $NAME$(),
    );
  }
}

class $NAME$ extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Placeholder(),
    );
  }
}

Define 클릭

Dart 선택

스니펫으로 설정한 이름을 작성 시 자동완성이 나오는 모습

Flutter

[Flutter] 5. 스니펫 설정

윤설안

May 27, 2025

💡

스니펫이란 위젯이나 기능을 실제 코드 예제로 간단히 보여주는 짧은 코드 조각이다. 코드 조각을 입력하면 그에 해당하는 코드를 자동 작성해준다.

1. Settings - Live Templates

Flutter를 클릭 후, + 버튼을 눌러서 Live Template 추가

abbreviation : 스니펫 이름(단축어)

Template Text : 자동으로 입력되는 코드작성


import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {

  const MyApp();

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: $NAME$(),
    );
  }
}

class $NAME$ extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Placeholder(),
    );
  }
}

Define 클릭

Dart 선택

스니펫으로 설정한 이름을 작성 시 자동완성이 나오는 모습