Flutter - 입력 패턴

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/painting.dart';
import 'package:flutter/widgets.dart';

void main() {
  runApp(const MyApp()); // 앱을 구동
}

// stless + tab 키 누르기
class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    // 여기 위에 4줄은 형식적인 것들임

    // 여기부터가 앱 디자인하는 곳
    return MaterialApp(
        // 구글 느낌 세팅을 제공해준다.
        home: Scaffold(
      // 상중하로 나눠준다, 기준점을 왼쪽 위로 한다.
      body: Body(),
    ));
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        TestCheckBox(),
        TestRadioButton(),
        TestSlider(),
        TestSwitch(),
        TestPopupMenu(),
      ],
    );
  }
}

class TestCheckBox extends StatefulWidget {
  const TestCheckBox({super.key});

  @override
  State<TestCheckBox> createState() => _TestCheckBoxState();
}

class _TestCheckBoxState extends State<TestCheckBox> {
  //checkbox의 값을 가지고 있어야 함
  late List<bool> values;

  @override
  void initState() {
    super.initState();
    values = [false, false, false];
  }

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        Checkbox(
            value: values[0],
            onChanged: (value) => changedValue(0, value ?? false)),
        Checkbox(
            value: values[1],
            onChanged: (value) => changedValue(1, value ?? false)),
        Checkbox(
            value: values[2],
            onChanged: (value) => changedValue(2, value ?? false)),
        // Checkbox(value: values[2], onChanged: (value) => changedValue(2, value: value)),
        // void changedValue(int index, bool? value = false){
        // values[index] = value!;  null일 수가 없기에 ! 붙임
        // value 값이 null이면 false를 주기 위해 ?? 사용
      ],
    );
  }

  void changedValue(int index, bool value) {
    setState(() {
      values[index] = value;
    });
  }
}

class TestRadioButton extends StatefulWidget {
  const TestRadioButton({super.key});

  @override
  State<TestRadioButton> createState() => _TestRadioButtonState();
}

// shift  + f6  키로 클래스 이름을 바꿀수 있다
enum TestTestValue {
  test1,
  test2,
  test3;
}

class _TestRadioButtonState extends State<TestRadioButton> {
  TestTestValue? selectValue;

  // 초기값이 없을 수 있다. nullable 선언

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        ListTile(
          leading: Radio<TestTestValue>(
            value: TestTestValue.test1,
            groupValue: selectValue,
            onChanged: (value) => setState(
              () => selectValue = value!,
            ),
          ),
          title: Text(TestTestValue.test1.name),
          onTap: () => setState(
                () {
                  if(selectValue != TestTestValue.test1){
                    selectValue = TestTestValue.test1;
                  }
                }
                // 옆에 있는 텍스트를 클릭해도 선택이 된다.
          ),
        ),
        Radio<TestTestValue>(
          value: TestTestValue.test2,
          groupValue: selectValue,
          onChanged: (value) => setState(
            () => selectValue = value!,
          ),
        ),
        Radio<TestTestValue>(
          value: TestTestValue.test3,
          groupValue: selectValue,
          onChanged: (value) => setState(
            () => selectValue = value!,
          ),
        ),
      ],
    );
  }
}

class TestSlider extends StatefulWidget {
  const TestSlider({super.key});

  @override
  State<TestSlider> createState() => _TestSliderState();
}

class _TestSliderState extends State<TestSlider> {
  double value = 0;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text('${value.round()}'),
        Slider(
          value: value,
          onChanged: (newValue)=> setState(() => value = newValue),
          divisions: 100,
          max: 100,
          min: 0,
          label: value.round().toString(),
          activeColor: Colors.red,
        ),
      ],
    );
  }
}

class TestSwitch extends StatefulWidget {
  const TestSwitch({super.key});

  @override
  State<TestSwitch> createState() => _TestSwitchState();
}

class _TestSwitchState extends State<TestSwitch> {
  bool value = false;
  
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Switch(value: value, onChanged: (newValue) => setState(() => value = newValue)),
        CupertinoSwitch(value: value, onChanged: (newValue) => setState(() => value = newValue))
      ],
    );
  }
}

class TestPopupMenu extends StatefulWidget {
  const TestPopupMenu({super.key});

  @override
  State<TestPopupMenu> createState() => _TestPopupMenuState();
}

class _TestPopupMenuState extends State<TestPopupMenu> {
  TestTestValue selectValue = TestTestValue.test1;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text(selectValue.name),
        PopupMenuButton(itemBuilder: (context){
          return TestTestValue.values.map((value) => PopupMenuItem(value: value, child: Text(value.name))).toList();
        },
          onSelected: (newValue) => setState(() {
            selectValue = newValue;
          }),
        ),
      ],
    );
  }
}