[flutter] FlatButton을 사용하여 이미지 버튼을 만드는 방법은?

26 Dec 2023

flutter

Flutter에서 이미지 버튼을 만들기 위해 FlatButton을 사용할 수 있습니다. 아래는 이미지 버튼을 만드는 간단한 예제 코드입니다.

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('이미지 버튼'),
        ),
        body: Center(
          child: FlatButton(
            onPressed: () {
              // 버튼을 눌렀을 때 수행할 작업
            },
            child: Image.asset('assets/button_image.png'),
          ),
        ),
      ),
    );
  }
}

위의 예제 코드에서, 이미지 버튼을 만들기 위해 FlatButton 위젯을 사용했습니다. onPressed 속성을 사용하여 버튼 클릭 시 실행할 작업을 정의할 수 있고, child 속성을 사용하여 이미지를 버튼 내에 표시할 수 있습니다.

이미지 파일은 프로젝트의 assets 폴더에 저장되어 있어야 합니다. 이미지 파일의 경로는 Image.asset의 매개변수로 전달됩니다.

이제 위의 코드를 참고하여 이미지 버튼을 만들어 보세요!

더 많은 정보를 원하시면 Flutter 공식 문서를 참고하실 수 있습니다.