지금부터는 기능!

기능

버튼에 기능부여!

// 바깥에 
var a = 1;

floatingActionButton: FloatingActionButton(
          child: Text(a.toString()), // 버튼이 보여지는 부분은 1로 고정 (재렌더링이 안되서 그럼)
          onPressed: (){
            print(a); // 이부분은 콘솔창에 잘 찍힘
            a++;
          },
        ),

재렌더링이 안되는 이슈가 있음.

재렌더링 시키는 법

state 쓰면 state 변할 때마다 재렌더링이 됨.

데이터 잠깐 저장할 때 쓰는애 : 변수 그런데 state에서도 저장할 수 있음.

변수와 state의 차이? 변수는 그냥 변수 state는 뭐가 변한다. 그러면 state를 쓰는 위젯이 재랜더링이 된다.

그래서 state 쓰는 방법

1. StatefulWidget 만들기

stful 치고 tab키 이 안에서만 state 만들수 있음

StatelessWidget을 StatefulWidget으로 변환할 수도 있음. 전구 누르고 변환도 가능함.

class Test extends StatefulWidget {
  const Test({Key? key}) : super(key: key);

  @override
  State<Test> createState() => _TestState();
}

class _TestState extends State<Test> {
  var a = 1; // 이렇게 만들면 state 만들어짐
  
  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

2. state 변경하는 방법

setState(){ 여기서 해야 함! }

child: Text(a.toString()),
          onPressed: (){
            setState(() {
              a++; // 여기서 재랜더링 됨.
            });
          },

앱개발의 핵심 문법인 state 임.

state는 자주 바뀌는 애들 바뀌면 바로바로 보여야하는 데이터들 state로 만들자!

뭐 state나 일반변수나 차이가 없어요

3. 배열 안에 넣고 사용하기

var name = ['김역숙', '홍길동', '피자집'];
...
body: ListView.builder(
            itemCount: 3,
            itemBuilder: (context, index){
              return ListTile( 
                  leading: Image.asset('wild-dog.jpg'),
                  title:Text(name[index]) // 여기서 사용할 수 있음
              );
            }),