플러터 기본 위젯 예제(MaterialWidget) - StatefulWidget

 

많은 분들에게 기본적인 도움이라도 되길 바라며, 학습 목적 외에 상업적 이용은 금합니다. 

 

출처: 패스트캠퍼스 15개 프로젝트로 실무까지 끝내는 Dart & Fultter 앱 개발, 챗 gpt

출처: https://forfire700.tistory.com/152 [IT STUDY CAFE:티스토리]

---

코드

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
 
const assetImagePath = 'assets/images';
const bannerImage = '$assetImagePath/banner.png';
 
void main() {
  runApp(
    MaterialApp(
      home: Body(),
    ),
  );
}
 
class Body extends StatelessWidget {
  const Body({super.key});
 
  @override
  Widget build(BuildContext context) {
    return const Column(children: [
      ExampleStateless(),
      ExampleStateful(index: 3),
    ]);
  }
}
 
class ExampleStateless extends StatelessWidget {
  const ExampleStateless({super.key});
 
  @override
  Widget build(BuildContext context) {
    return Expanded(
        child: Container(
      color: Colors.red,
    ));
  }
}
 
class ExampleStateful extends StatefulWidget {
  final int index;
 
  const ExampleStateful({required this.index, super.key});
 
  @override
  State<ExampleStateful> createState() => _ExampleStatefulState();
}
 
class _ExampleStatefulState extends State<ExampleStateful> {
  late int _index;
  late TextEditingController textController;
  @override
  void initState() {
    super.initState();
    _index = widget.index;
    textController = TextEditingController();
  }
 
  @override
  void dispose() {
    textController.dispose();
    super.dispose();
  }
 
  @override
  Widget build(BuildContext context) {
    return Expanded(
      flex: 1,
      child: GestureDetector(
        onTap: () {
          setState(() {
            if (_index == 5) {
              _index = 0;
              return;
            }
            _index++;
          });
        },
        child: Container(
            color: Colors.blue.withOpacity(_index / 5),
            child: Center(child: Text('$_index'))),
      ),
    );
  }
}