[글쓴이:] RUDY

VSCode – 밑줄 제거

RUDY Leave a comment

상수로 변경하는게 좋을것 같다는 표시로 밑줄이 표시되는데 상당이 거슬림. const로 변경하면 밑줄을 사라지지만 상당히 번거롭기 때문에 필요에 의해 자동으로 const를 입력해주는 설정을 추가한다.

command + shift + p

저장후 기존에 밑줄이 발생하던 파일에서 다시한번 저장하면 const가 자동으로 붙으면서 밑줄이 제거 된다.

VSCode – 터미널에서 실행하기

RUDY Leave a comment

터미널에서 바로 VSCode를 실행할수 있는 방법!

프로젝트 폴더로 이동하여 code . 입력으로 VSCode를 실행할수 있습니다.

하지만 그전에 먼저 해야할일이 있는데, 우선 VSCode를 실행하여 Command + Shift + P 다음 shell 을 입력합니다.

이제 다시 프로젝트 폴더에 code . 명령어를 실행합니다.

Flutter – SizedBox

RUDY Leave a comment

https://api.flutter.dev/flutter/widgets/SizedBox-class.html

사이즈를 강제하는 Widget으로 부모 Widget이 허용하지 않을경우 무시된다고 한다. 사용 용도를 확인하기위해 많이 검색해보았지만 실제 개발할때 사용되는 방법은 widget간 간격을 조정할때 많이 사용된다고 하고 그 이외에는 다른 Widget을 사용하는것 같아.

투명한 박스 생성

아무런 속성을 추가하지 않고 높이:50, 너비:50인 투명한 박스를 생성한다.

return SizedBox(
  width: 100,
  height: 100,
);

색상이 들어간 박스 생성

SizedBox에 색상을 바로 설정할수없고, 다른 widget의 속성으로 설정할수 있다.

return SizedBox(
  width: 50,
  height: 50,
  child: Container(
    color: Colors.red,
  ),
);

SizedBox는 사이즈 설정에 최적화되어 있고 다른 속성을 추가하기위해서는 다른 widget을 사용해야한다.

만약 빨간색 박스가 필요하다면 아래와 같이 Container widget을 사용하는것이 효율적으로 보인다.

return Container(
  width: 50,
  height: 50,
  color: Colors.red,
);

SizedBox widget은 Container widget에 비해 적은 리소스를 사용하므로 widget끼리의 간격조정에 많이 사용되는것으로 보인다. 

body: Column(
  children: [
    BoxWidget(),
    SizedBox(height: 50,),
    BoxWidget(),
  ],
)

Flutter – SnackBar

RUDY Leave a comment 
import 'package:flutter/material.dart';

void main() => runApp(const SnackBarDemo());

class SnackBarDemo extends StatelessWidget {
  const SnackBarDemo({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'SnackBar Demo',
      home: Scaffold(
        appBar: AppBar(
          title: const Text('SnackBar Demo'),
        ),
        body: const SnackBarPage(),
      ),
    );
  }
}

class SnackBarPage extends StatelessWidget {
  const SnackBarPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Center(
      child: ElevatedButton(
        onPressed: () {
          final snackBar = SnackBar(
            content: Text('Yay! A Snack Bar!'),
          );
          ScaffoldMessenger.of(context).showSnackBar(snackBar);
        },
        child: const Text('Show SnackBar'),
      ),
    );
  }
}

SnackBarAction 추가하기

onPressed: () {
  final snackBar = SnackBar(
    content: Text('Yay! A Snack Bar!'),
    action: SnackBarAction(
      label: 'Close',
      onPressed: () {
        ScaffoldMessenger.of(context).hideCurrentSnackBar();
      },
    ),
  );
  ScaffoldMessenger.of(context).showSnackBar(snackBar);
},